[DNM] Combine donation form pages #471
Open
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
moiikana
force-pushed
the
combine-donation-pages
branch
10 times, most recently
from
ee8739e
to
85d2609
Compare
Abban
reviewed
Aug 29, 2024
...components/pages/donation_form/singlePageFromSections/PersonalDataSectionDonationReceipt.vue
Outdated
Show resolved
Hide resolved
moiikana
force-pushed
the
combine-donation-pages
branch
12 times, most recently
from
ad636eb
to
f4f5ba9
Compare
moiikana
force-pushed
the
combine-donation-pages
branch
7 times, most recently
from
b799dad
to
a08454c
Compare
Abban
requested changes
Sep 26, 2024
- contains both, payment and address fields - created new "Sections" to keep both contexts separated - created sections for payment + personal data https://phabricator.wikimedia.org/T368525
- add titles to sections - add scroll behaviour to "change data" button https://phabricator.wikimedia.org/T368525
- use "use-cards" styling to make main background white->transparent - style the form sections to have a white background and blue buttom border - rename folder to be more clear that this is not for FormSection components (which we already have somewhere else in the code for something else) - create new entry point for the new single page form https://phabricator.wikimedia.org/T368525 Use content cards in entry point
- the buttons should be smaller, have less rows https://phabricator.wikimedia.org/T368525 - Fix option styling on mobile screens https://phabricator.wikimedia.org/T368525
- combines error items for payment and address data https://phabricator.wikimedia.org/T368525
- uses the new RadioFieldHelpText component with a slot - the slot name needs to be #tooltip-4 (4 = anonymous option) https://phabricator.wikimedia.org/T368525
- the order of validation calls in the event handlers hook needed to be switched (payment needs to be validated after bankdata) - for the DonationReceipt feature (ap=1) a different hook is needed (with equal changes) - ErrorSummary for DonationReceipt feature needed to be added (and another condition added to hide it properly again) https://phabricator.wikimedia.org/T368525
- the paymentpage previously did dynamic form tracking (with a special matomo plugin) - as the pages got merged, it's not possible to track like that anymore https://phabricator.wikimedia.org/T368525
- rebased main (new BankFields component and street suggestion error summary got introduced) - adapted some tests and components for that
- adds new tests for 2 features: - donationreceipt - street autocomplete - their combination
- removes PaymentPage + AddressPage components https://phabricator.wikimedia.org/T368525
- renames single-page-form-section -> donation-page-form-section - fixes button width (row alignment) https://phabricator.wikimedia.org/T368525
- singlePageFromSections -> singlePageFormSections
- there is only 1 donation form for the donation page supported currently, so it can keep the basic name https://phabricator.wikimedia.org/T368525
- remove unused statements in the code - fix warning in test setup - fix scroll tests - fix tests around error summary https://phabricator.wikimedia.org/T368525
- this will prevent content from getting overlapped by the navigation bar https://phabricator.wikimedia.org/T368525
- this caused warnings in the browser console
moiikana
force-pushed
the
combine-donation-pages
branch
from
8134ed5
to
daebe90
Compare
|
is currently deployed at https://testing03.wikimedia.customers.manitu.net/ |
moiikana
force-pushed
the
combine-donation-pages
branch
2 times, most recently
from
bbac595
to
efc4dd7
Compare
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Warning
this is a major frontend change, merging this might block deployment to production
Changes:
new donation form contains both, payment and address fields
created new "Sections" to keep both contexts separated
separate sections visually (white boxes) (try using confirmation page design)
make payment button groups 50% width
buttons look good on mobile
form submission should validate the payment section as well
error summary shows items for both sections
write tests for all new components
move iban component from PersData section into Payment section
handle form tracking (-> trackDynamicForm ) (different forms, different address options?)
add back more accessibility behaviour for the sections
acceptance test with ap=0/ap=1, afo=0/1? options
make sure the 2 page memebership form still looks good (buttons, options, spacing..)
for reviews:
the 2 subpages have been converted ...
PaymentPage -> PaymentSection
AddressPage -> PersonalDataSection (now does some more checks + contains both error summaries)
AddressFormErrorSummaries -> SinglePageErrorSummary
https://phabricator.wikimedia.org/T368525