* Add validation reducers, actions, and action types
* Add selector for getValidationErrors
* Export store key and register store
* Export validation store key
* Move TextInput files to checkout package
* Export ValidatedTextInput from blocks-checkout package
* Update imports of ValidatedTextInput to reflect new location
* Use the validation wp-data store for showing error messages
* Export getValidationError in checkout package
* Move validation store to checkout package
* Move ValidationInputError to blocks-checkout package
* Only export "exposedSelectors" from validation
* Convert validation context to data store
* Fixed linting error
* Fixed linting error
* Change the validation selectors to return a function
* Convert reducer and selectors to TS
* Remove superfluous comments and improve test titles
* Test to ensure visible errors remain visible
* Make test for hasValidationErrors more robust
* Augment the wp-data module to include our selectors and actions
* Removed unused `exposedSelectors` variable
* Remove TS error because of `instanceId` on props
* Remove unnecessary as const
* Use function returned by getValidationError
* Use correct selector/action names now context has been decoupled
* hide validation error when input value changes
* Add correct aria-describedBy now we can get error id from store
* Clear validation error from store when component unmounts
* Clear validation error if input is valid
* convert ValidationInputError to TS and get correct id/error from store
* Ensure checkout block doesn't break when there are no errors
* Get validation data from the store instead of context
* Update country input to remove validation context
* Move validation store out of checkout package
* Move TextInput and ValidationInputError back out of the checkout package
* Remove duplicate internal styles comment
* Remove exports that no longer exist
* Get validation store key from block-data
* Make attribute-select-control use validation data store
* Export FieldValidationStatus type
* Make combobox use validation store not context
* Make Address use validation store not context
* Make Address use validation store not context
* Use hasValidationErrors selector as a function in shipping calculator
* Remove validation context from coupon story
* Import VALIDATION_STORE_KEY from correct location
* Stop coupon story from erroring
* Update useStoreCartCoupons to use validation store not context
* Make TotalsCoupon use validation store instead of context
* Make AddToCartFormContext use validation store not context
* Remove ValidationContext
* Import FieldValidationStatus from correct location
* Import ValidatedTextInput and ValidatedTextInput from correct location
* Remove ValidationContextProvider
* Update components to use validation store not context
* Update useValidation to use the data store
* Replace the validation context in checkout-events file
* Use the re-mapped path for the store key import
* Use "register" instead of the deprecated "registerStore"
* Fix import error of the "FieldValidationStatus" type
* Use TS instead of React's "PropTypes"
* Fix the type of "ValidationInputError" in the "payment-method-interface"
* Fix error not showing on the first place order click bug
We were mutating the state in the reducer, which prevented re-rendering
on state change
* Fix state mutation issue in the Validation reducer
Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
* Add checkout data store
* wip on checkout data store
* CheckoutContext now uses the checkout store
* Investigated and removed setting the redirectUrl on the default state
* update extension and address hooks to use checkout data store
* use checkout data store in checkout-processor and use-checkout-button
* trim useCheckoutContext from use-payment-method-interface && use-store-cart-item-quantity
* Remove useCheckoutContext from shipping provider
* Remove isCalculating from state
* Removed useCheckoutContext from lots of places
* Remove useCheckoutContext from checkout-payment-block
* Remove useCheckoutContext in checkout-shipping-methods-block and checkout-shipping-address-block
* add isCart selector and action and update the checkoutstate context
* Fixed redirectUrl bug by using thunks
* Remove dispatchActions from checkout-state
* Change SET_HAS_ERROR action to be neater
* Thomas' feedback
* Tidy up
* Oops, deleted things I shouldn't have
* Typescript
* Fix types
* Fix tests
* Remove isCart
* Update docs and remove unecessary getRedirectUrl() selector
* validate event emitter button
* Added thunks in a separate file
* Call thunks from checkout-state
* Checkout logic tested and working
* Remove dependency injection as much as poss, tidy up and fix some TS errors
* Fix types in thunks.ts
* Fixed some ts errors
* WIP
* Fixed bug
* Shift side effects from checkout-state to checkout-processor
* Revert "Shift side effects from checkout-state to checkout-processor"
This reverts commit 059533da4eb34f9982f66cd4adacc7b2c24f939f.
* Rename CheckoutState to CheckoutEvents
* Move status check outside the thunk
* remove duplicate EVENTS constant
* remove temp buttons
* Remove console logs
* Augment @wordpress/data package with our new store types
* Add correct type for CheckoutAction
* Remove createErrorNotice arg from runCheckoutAfterProcessingWithErrorObservers
* Remove createErrorNotice from emit event types
* Use type keyword when importing types
* Add correct types for dispatch and select in thunks
* Update wordpress/data types
* Replace store creation with new preferred method
* Set correct action type on reducer
* Remove unnecessary async from thunk
* add CHECKOUT_ prefix to checkout events again
* export EVENTS with eveything else in checkout0-events/event-emit
* Remove duplicate SelectFromMap and TailParameters
* Updated type for paymentStatus
* TODO remove wp/data experimental thunks
* Remove `setCustomerId` from events and `processCheckoutResponseHeaders` (https://github.com/woocommerce/woocommerce-blocks/pull/6586)
* Prevent passing dispatch, instead get actions direct from store
* Get setCustomerId from the store instead of passing it to processCheckoutResponseHeaders
* Revert "Prevent passing dispatch, instead get actions direct from store"
This reverts commit 4479a2ef5599d9c8d99c3629616b3d662210fc08.
* Auto stash before revert of "Prevent passing dispatch, instead get actions direct from store"
* Remove duplicate dispatch
* Fix unit tests
Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Add checkout data store
* wip on checkout data store
* CheckoutContext now uses the checkout store
* Investigated and removed setting the redirectUrl on the default state
* update extension and address hooks to use checkout data store
* use checkout data store in checkout-processor and use-checkout-button
* trim useCheckoutContext from use-payment-method-interface && use-store-cart-item-quantity
* Remove useCheckoutContext from shipping provider
* Remove isCalculating from state
* Removed useCheckoutContext from lots of places
* Remove useCheckoutContext from checkout-payment-block
* Remove useCheckoutContext in checkout-shipping-methods-block and checkout-shipping-address-block
* add isCart selector and action and update the checkoutstate context
* Fixed redirectUrl bug by using thunks
* Remove dispatchActions from checkout-state
* Change SET_HAS_ERROR action to be neater
* Thomas' feedback
* Tidy up
* Oops, deleted things I shouldn't have
* Typescript
* Fix types
* Fix tests
* Remove isCart
* Update docs and remove unecessary getRedirectUrl() selector
* set correct type for preloadedCheckoutData
* Remove duplicate Address type
* Fix missing addresses from type-defs index
* Update docs/block-client-apis/checkout/checkout-api.md
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Update docs/block-client-apis/checkout/checkout-api.md
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Update docs
* Update docs/block-client-apis/checkout/checkout-api.md
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Update docs/block-client-apis/checkout/checkout-api.md
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Revert feedback changes
* REvert feedback formatting
* Update docs formatting
* Delete empty types.ts file
* remove merge conflict from docs
* Correct linting in docs
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
Sanitizing the merchant store link in the error message added in WooPay when in some
cases the customer could run into an issue where we need to tell them an error occurred
and they have to go back to the merchant store and re-initialize WooPay to fix it.
Because previously we were only expecting strings, the text was not sanitized.
* Enabled __unstableHTML hidden option for HTML rendering within notices.
* Fixed margin-bottom for HTML notice content
* Fixed margin-top for HTML notice content
* Attempt to fix a broken e2e test
We noticed that oftentimes our labels and text tend to be overly
technical or unclear. We decided to do a bulk pass to improve
the readability to non-technical users.
* Adjust filter titles margins
* Show the Apply button placeholder and adjust title margins
* Add placeholder for the Apply button on filter by price
* Add placeholder for the Apply button on filter by attr
* Update stock filter snapshot
* Move the apply button placeholder to inside the FilterSubmitButton component
* Fix the placeholder button height
* Fix apply button on editor
* Change loading class to be is-loading
* Active Filters Loading Placeholders
* Use flexbox for active filters loading placeholders
* Clear all placeholder loading styles
* Ensure active filters which arent attribute filters render null when in a loading state
* Refactor loading placeholders and state setting
* Add useIsMounted to shared hooks and check productAttributes only when mounted
* Add componentHasMounted to useMemo deps
* Check URL for attribute filter hint
* Check URL for attribute filter hint
* Remove border-radius from placeholder for clear all button
* Fix filter loading when no filters are active on shop page
* Update filter by attribute skeleton design
* Update filter by attribute skeleton design
* Start using the FilterTitlePlaceholder
* Fix title animation
* Show two placeholder lines on checkboxes
* Fix dropdown border
* Fix gap
* Fix border radius for dropdown
* Don't show placeholder when changing other filters
* Improve filter title margins
* Update filter by price skeleton design
* Improve skeleton colors
* Update skeleton when no apply button
* Update skeleton with apply button
* Avoid showing a very wide placeholder when the filter title is very long
* Start using the FilterTitlePlaceholder component for the placeholder
* Add comment to isUpdating
* Remove unneeded styles
* Fix title animation
* Set max-height to avoid showing a big placeholder on longer titles
* Avoid showing placeholder when no there are no products
* Extract the placeholder to a separate component
* Adjust width
* Adjust border radius
* Pass the title to adjust the placeholder width/height
* Rename component
* Add a static class name for the product details item instead of the translatable string
* Update Jest snapshot
Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
* Reverse ordter of filter item name and close btn.
* Update layout & typography styles for block items
* Update chip ui view styles.
Additionally, add editor styles to have the editor match the rendered
frontend.
* Update additional remove button styles.
- Add hover state to remove button on chip layout.
- Update disabled styles to remove button in both layouts (mainly relevant
to the editor view).
* Adjust remove button colors.
Set hover states to shades of grey. Also set chip color and text to
match selected text color of the block.
* Update e2e test to account for new element order.
Since we're moving the remove button in the list view from the last
child node to the first child node, we need to adjust the expected order
of the active filter item text.
* Design and copy updates on the block settings
Co-authored-by: Alba Rincón <albarin@users.noreply.github.com>
Co-authored-by: Alba Rincón <alba.rincon@automattic.com>
* Update Filter by Stock controls and UI to include custom checkbox and settings.
* Include and style Filter by Stock reset button
* Make checkbox accessible via keyboard
* Update snapshot tests for Filter Products by Stock component
* Update E2E tests with new label value
* Update label test for Apply Filters in E2E tests
* Specify checkbox type so styles are not overridden in the editor
* Update E2E test label for filter button
* Update label selector to search for containing text rather than exact match
* Escape quotation marks for label query in E2E shopper tests for Filter by Stock
* Correct typo on Filter by Stock controls
* Replace custom checkbox with CheckboxControl component from the checkout package.
* Remove opacity on product count for checkbox label so its the same color as the label.
* Update snapshot tests with new component usage for filter by stock
* Update block title from Filter Products by Stock to Filter by Stock
* Update reset button behaviour to clear selections immediately regardless of whether the Apply Filters button is active or not.
* Pass option value as ID to satisfy E2E tests
* Update snapshot tests for stock filter
* Reset checked state on reset for when they have filters checked but not applied.
* make toggle control full width
* add inlineInput attribute
* add inlineInput sidebar setting
* add inlineInput help text
* style the filter button
* style price input
* wip: reset button
* clicking on reset button will reset the price query
* support inline input fields
* price text styling update
* fix reset button font size
* add loading placeholder to all elements
* fix filter button style
* update range slider thumb and track style
* fix loading placeholder for non empty query
* move reset button into FilterSubmitButton component
* try: render placeholder serverside
* update filter button label
* Revert "try: render placeholder serverside"
This reverts commit 98f08efdb8048b8f78c7476b774d1128c1d31295.
* remove LoadingPlaceholder component
* remove Price: prefix from the current displayed price range
* update labels
* extract reset button as a dedicated component
* update price text section
* update reset button behavior
* avoid breaking filter submit button style for other filter blocks
* rename block to Filter by Price
* fix e2e test
* remove border support
* adjust padding for elments
* rename panel title
* Make the inline option enabled by default and fix frontend rendering
* Make the `Price Range Selector` uppercase
* Show `Reset` button only when a selection has been made
* Revert the `save` change to avoid the 'Block Recovery Prompt'
Co-authored-by: Alba Rincón <alba.rincon@automattic.com>
* Add default page notice
* show notice all inner blocks
* support flow when page isnt saved
* switch from where we get the current post id
* update lock
* fix types
* Remove old compatibility notices from Cart and Checkout
* Move useCompatibilityNotice to sidebar-compatibility-notice directory
* Remove old CartCheckoutCompatibilityNotice
* Create sidebar compatibility notice hoc
* Add isCartOrCheckoutOrInnerBlock function
* Refactor defaultNotice to use new isCartOrCheckoutOrInnerBlock func
* Remove BlockSettings from checkout edit and export from checkout-shared
* Change so component still renders, it is just hidden with display: none
This is required because when it returns null the component gets skipped from being added to the Slot, then when it does return a component, then it gets rendered at the bottom of the Slot. By ensuring it always renders we can have it at the top all the time.
* Set the priorities of the hoc filters so compat notice renders first
* Make isCartOrCheckoutInnerBlock a hook
* Remove old compatibility notice related tests
* Remove BlockSettings from Cart
* Remove withDefaultNotice hoc
* Include DefaultNotice in compatibility notice
* Remove DefaultNotice from Checkout
* Rename withSidebarCompatibilityNotice to withSidebarNotices
This is because it includes the sidebar compatibility notice and the default notices
* Remove useIsCartOrCheckoutOrInnerBlock hook
* Remove compatibility notice code from tests
* Revert DefaultNotice back to the old one
* Remove unused components
* Remove withBlockSettings HOC and fix TS types
This is an abstraction that is no longer required, we can just include BlockSettings in the Cart and Checkout blocks
* Remove CartCheckoutFeedbackPrompt from BlockSettings
It will be included in sidebar-notices instead
* Fix TS Types in DefaultNotice
* Add BlockSettings to cart and checkout edit
* Editor: Add feedback box to the Cart & Checkout Inner Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/6881)
* Show "Feedback prompt" for all inner blocks
* Fix the "feedback" notice position for these blocks
The "checkout fields", "checkout billing address" and
"checkout shipping address" have the addressFields option which
gets rerendered and placed at the bottom of the inspector controls.
* Tidy up the address-fields hoc
* Use correct block name to check for billing or shipping address
* Revert "Editor: Add feedback box to the Cart & Checkout Inner Blocks (https://github.com/woocommerce/woocommerce-blocks/pull/6881)"
This reverts commit 5f3d6cf15ce08d9c303e62ec3e0d0315ead1281f.
* Add hack to get feedback prompt to render last
* Fix TS errors for context and attributes
* Include CartCheckoutFeedbackPrompt in accountcontrols & addresscontrols
* Do not include feedback prompt if on an address block or contact info
* Remove unused hoc for address fields
Co-authored-by: Nadir Seghir <nadir.seghir@gmail.com>
Co-authored-by: Saad Tarhi <saad.trh@gmail.com>
* Copy style-attributes file to desired directory.
Add a copy of the style-attributes file in blocks/hooks to the desired
base/hooks directory with the other hooks.
* Remove relative imports in favor of global aliases
Utilizes the custom global project aliases in place of using relative
imports.
Note: seeing some linting issues with the aliases. This seems to be the
case elsewhere so it is likely not a blocker for this effort, however,
it may be worth looking into as a follow-up.
* Adjust all imports to use @woocommerce/base-hooks.
Replace all instances of relative file paths to hooks/style-attributes
to use the custom global alias.
* Remove the hooks dir in `assets/js/blocks/`.
Now that everything is using the `@woocommerce/base-hooks` custom global
alias and we have the `style-attributes` hooks file in the base/hooks
directory, we no longer need the `style-attributes` hooks file in the
aforementioned `assets/js/blocks` directory.
* Split style-attributes.ts out into separate files.
Moved the four hooks in style-attributes.ts out into their own, separate
hook file to be consistent with the rest of our custom hooks.
Additionally, moved the helper function (parseStyle) out into a separate
export in base/utils.
* Check package length >= 1 to show package name
* Check shipping rates length in order shipping packages slot
* Fix TS error where boolean value could be undefined
* Show items if there is more than one shipping rate
* Get shipping rates from preview cart in editor
* Set showItems in ShippingRatesControl to true if multiple packages
* Move dependency in useShippingData to correct section
* Ensure getting packageData.shipping_rates.length won't error
* update billing address when shipping address gets change in Cart block
* Add a new line to test linting error
* Remove a new line to test linting error
* Fix linting error
* Fix linting error
* Fix linting error by adding a space and removing a comma
* Fix linting error by replacing a space with tab
Co-authored-by: Niels Lange <info@nielslange.de>
* wip: convert attribute filter to ts
* change query to optional
* update SearchListControlProps and SearchListItemType
* get default attribute from metadata
* update types
* convert attributes utils to ts
* convert attribute query utils to ts
* fix type error, remove type casting
* revert type change for SearchListItemType
* apply new format
* Rename billingData to billingAddress
* Add unit test to ensure billingData remains accessible
* add integration tests for slots
* Keep billingData in usePaymentMethodRegistration for backwards compatibility
* Gate `billingData` in deprecation gate
* Replace deprecation call
Co-authored-by: Nadir Seghir <nadir.seghir@gmail.com>