* Show backorder notice in the Cart block
* Don't render variation <div> if empty
* Create ProductBackorderNotification component
* Add product backorder notification to the checkout block
* Fix classname and comment
* Rename notification->badge and don't show low stock badge if backorder is shown
* Use ternary to dispaly backorder/low stock badge
* Reduce specificity of some button styles
* Submit container: make it possible for themes to change the shadow color without the need to rewrite shadow values
* Use background-color instead of background property in docs
* Add docs to style the button and the submit container
* Remove border from button
* Add back state styles to button component
* Docs improvements
* Undo unncessary changes in button component styles
* Add spaces
* Fix Cart test async logic
* tweak test
* refactor test to not call response twice
* add comment for why we're calling fetch twice
* fix duplicate calls
* reset empty test to normal value
* switch to mockResponse
* convert comment to todo block
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
* Remove legacy files
* Use thumbnail product image for Cart, Checkout and Reviews blocks
* Add option to toggle between full size and cropped image to the Atomic Product image block
* Update base/components classnames
* Fix class name conflict
* Fix some class names mismatch
* Fix review loading placeholder styles
* Fix docs format
* Update old class name
* Fix price slider regression
* Fix load more button component missing legacy class
* Fix wrong loading mask styles classname
* Remove 'checkout' from 'wc-block-components-checkout-payment-methods__save-card-info' classname
* Make it explicit legacy classes will be removed in the next major version
* Make product variation data styles belong to product metadata
* Improve docs sentence
* more setup configuration for rtl
* move default state for cart out of reducer
This also creates a file for default store states, it should make it easier to execute tests in various environments.
* Make sure there’s a default object for cart line item row
* set defaults for cartData
* add fetchMock as a global in eslint config
* add initial cart flow tests
This is just to get the ball rolling, the cart block needs more tests
* fix missing @wordpress/jest-console configs (because I overwrote the original configuration)
* update test because of change in branch
* switch import order
* add globals.d.ts file to declare globals we use.
This is a quick solution to prevent typescript linting warning about `fetchMock`. At some point we could also create a proper interface for it or import the types (if they exist) for the `jest-mock` package.
The new `globals.d.ts` file is excluded from published builds.
* Move order summary styles to component style.scss
* Fix wrong class name in Order summary
* Move express payment methods a little bit higher
* Fix shipping options panel misaligned in the Cart sidebar
* Add right padding to panel button so text doesn't overlap the arrow
* Fix wrong class name in Order summary (II)
* Revert "Move blocks to stable flag (https://github.com/woocommerce/woocommerce-blocks/pull/2261)"
This reverts commit a005649ab8.
* migrate to number based gating
* add todo to watch feature flag
* remove flags from build
* change flag in travis
* load flag in right order
* expose flag to js
* simplify flag definition
* more feature flags
* wrap flag in check
* add helper functions
* add helpers in PHP
* fix typo in flag
* move php code to src/domain/package
* tweak if condition
* return flag to travis
* fix broken block name
* Register Atomic Blocks and save some block content
* renderInnerBlocks utility
* Frontend Rendering
* Clean up atomic block classnames
* Move shared styles
* Create a hoc for attribute mapping
* Rename some unpluralised class names
* Remove prefixes from atomic component class names
* Updated styles
* Update styles from master
* Revert product list styles
* 2020 fixes
* Separate renderFrontend from renderInnerBlocks
* Lazy loading of components
* Tweak loading classes
* FIx all products loading state
* Revert lazy implementation - creates too many unneccessary files due to webpack config
* Cleanup
* Remove wcBlocksBuildUrl
* Move call to register_atomic_blocks
* Remove duplicate key
* reuse render frontend
* Corectly handle frontend attribute mapping to keep editor working
* Style updates
* Update side effects
* Remove width style from rating to fix alignment
* Move ssr grid styles to main stylesheet
* Put back prefixed classnames
* 2020 styling fixes
* Create frontend files instead of doing it all in block map
* Update assets/js/atomic/utils/get-block-map.js
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
* Update assets/js/atomic/utils/render-parent-block.js
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
* Fix last child alignment regardless of block type
* More specificity fixes
* 2020 button alignment
* static fix to prevent offsets
* fix placeholder image in firefox
* Issues reported in feedback
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
* Honor heading styles in Cart and Checkout blocks
* Replace Panel with DisclosureWidget and remove Card
* Remove panel-style from main entry
* Rename DisclosureWidget props
* Simplify TitleTag assign
* Add aria-expanded attribute
* Rename DisclosureWidget to Panel
* Make Panel button clickable area smaller
* Fix specificity issues with Twenty Twenty
* Reset italics in reset-typography mixin
* Make C&C titles font size large
* Add padding to shipping options when in the sidebar
* Use named font sizes instead of values in px
* Convert rem mixin to em
* Remove unnecessary line-height
* 'Design' -> 'layout'
* Add comment to magic line-heihgt number
* Update a couple of class names to use BEM
* Use consistent name for SCSS variables
* Fix order summary line heights
* Update docs/contributors/coding-guidelines.md
Co-authored-by: Mike Jolley <mike.jolley@me.com>
Co-authored-by: Mike Jolley <mike.jolley@me.com>
* Fix different heading size of Cart block between frontend and editor
* Increase Cart submit button specificity so styles are applied in the editor
* Ensure buttons don't inherit borders
* Simplify styles
* Create Title component
* Rename 'level' prop to 'headingLevel'
* Remove summary from API
* Add wordCountType to assets
* Update packages
* Remove summary from test data
* Featured product uses short desc
* Pass description instead of summary
* Use new Summary Component
* Component and tests
* Increased versititilty of methods
* Update assets/js/base/components/cart-checkout/product-summary/index.js
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
* Extra tests for html tags
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
* Use container queries to load Cart and Checkout responsive styles
* Update package-lock.json
* Make form-step react to container queries instead of media queries
* Make sidebar layout inner padding relative to the full-width
* Make container queries breakpoints smaller
* Prevent SnackbarList from loading in the editor
* Fix snackbar styles leaking into the editor
* Prevent 'Proceed to Checkout' button being fixed to the bottom in the editor
- set appropriate padding for main cart container
- card padding is currently provided by Gutenberg component (?)
- overriding padding on totals card to match main container
* Add ending dot to sentence
* Open links to products from Cart and Checkut blocks in new tabs
* Makes sure product names are broken if they overflow the container
* Use native find instead of lodash method
* Update styles to better match designs
* Revert "Open links to products from Cart and Checkut blocks in new tabs"
This reverts commit 9b64aa5f2e81bf0cf09d5640a3cfe1cc1085c046.
* Fix product name overflowing remove menu on mobile
* Remove @todo comments from form step CSS
* Make letter-spacinguse em instead of px
* IE11: Correctly align text in quantity selector
* Fix long product names overflowing in Checkout block on IE11
* abstract pageSelector to its own component and fix titles
* fix unwrapped context
* move control styles outside editor-wrapper
* restore condition to previous state
* move condition outisde
* rename condition
* keep pageSelect visible till next refresh
* remove comment
* Add quantity limit at product level
* Stock checks only needed when backorders are disabled
* Use remaining stock, not stock qty in messages etc
* Prevent duplicate validation from core
* Move validation calls to checkout API class
* Validate before payment
* Support additional error data
* Add coupon validation before payment, and hide hashes from user
* Implement validation and recalculation
* Abstract notice handler and implement legacy filters
* Handle generic cart item errors
* strip tags from coupon error messages woocommerce/woocommerce-blocks#2212
* Ensure item errors are surfaced when coupons are removed
* Fix wrong value passed to hook
* fix broken checkout when no payment method is there
* try fixing unit test errors
* if preview data has a receiveCart function use it, otherwise default to an anononymous function
* fix tests
Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
* API - Block qty > 1 for sold individually products
* Add item validation for sold individually to block checkout
* Fix validation check
* Add client side limit if sold individually
* Prevent never ending loading on failed add to cart
* Change cart button for sold individually errors
* Allow buttons to show loading spinners
* Show spinner on cart checkout button press
* Disable fieldsets when processing
* Check icon when finished
* Style tweak to fix height
* Update events
* feedback
* Move button back
* factor out editor preview data for saved payment methods to previews
* add missing imports lost in rebase
* use editorcontext to provide preview data to payment method context
* remove unused `activePaymentMethod` prop in CheckoutProvider and PaymentMethodDataProvider
* don't set the preview saved card as the default
* fix js error with cart in editor - fix EditorContext, pass previewData:
- editor context preview prop has changed;
- update cart to pass { previewCart } in previewData prop
- correctly destructure cart from previewData in useStoreCart hook
- correct typedefs
- EditorProvider props.previewData - now just Object
- similar for EditorDataContext
- correct default for activePaymentMethod state - empty string as before
* preselect 'use a new payment method' in checkout block editor preview
* update unit tests for changes to editor context
* move preview to editor data and alias it no nothing in frontend builds
* seperate context and provider
* pass previewData as a prop to provider
* address comments
* disable continue to checkout if item is being removed
* rename isPending and selectors/actions to isPendingDelete
* switch itemPendingDelete params order
* change to watching quantity changes not removal
* yield RECEIVE_REMOVED_ITEM
* update types and add return to select
* update tests
* switch params back
* only delete item after response from server
* update tests
* handle errors and unrelated unmounts
* disable row if is loading
* Rename and move existing checkout provider to checkout-state provider.
This allows us to re-use the interface exposed on this provider for cart and checkout blocks.
* refactor checkout provider to implement the new checkout state provider.
* Add Cart provider and export
* fix type-defs
* fix editor context provider and ensure all `isEditor` checks come from this provider
* fix type definition
* implement cart provider
* Make Product Price component accessible
* Render checkout form step number before the content instead of after
* Announce changes in the Shipping Rates Control results
* Render product name before product price in the Checkout sidebar
* Verify error element id exists before using it in describedBy
* Avoid reading 'Choose a shipping method' if no shipping methods are available
* Hide product image from screen readers if there is no alt text and make link not focusable
* Move Checkout block buttons below the sidebar
* Simplify selector
* Remove ternary to make code easier to understand
* Fix rebase issue
* Fix step number not visible for payment methods
* add payment-methods-demo config to sideEffects and install @wordpress/icons and @wordpress/primitives to be used directly.
* configure dependency extraction to ignore imports we want to use directly
* fix style issues for production builds
It looks like when a style is imported on the entrypoint of a component (or in a file with just exports), it get’s treeshaken from the final build _regardless of exception rules_.
* fix style imports from wordpress components
* fix loading skeleton showing on production builds
* fix block skeleton showing on production builds for cart
* import side effectful code
* add treatment for `@wordpress/warning` too
* fix typo
* exclude `settings/block` from sideEffects
* rollback `wordpress-components` update and keep sideEffects fixes
* remove unnecessary handle handling
Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
* record a tracks event when merchant toggles cart shipping calculator:
- add tracks utility func for blocks
- adds standard event name prefix
- supplies post id & type params (an example)
- hook this up to UI when user toggles shipping calc
- pass enabled as boolean prop
* fix typo - call isTracksAvailable() !
* remove unnecessary temporary boolean
* update event name based on best practice guidelines
* remove isTracksAvailable preflight check:
- if site opts out, recordEvent is an empty function
- add in standard fallback boilerplate to ensure function exists
Note: currently no mechanism to detect if tracks is available on front end.
* add errormessage handling to countryinput (along with storybook)
* add types for react
* Add validation context and implement
* implement validation context for country field validation
* tweak ValidationInputError so that it can receive property name for getting error from
* improve storybook webpack config to pull from tsconfig.json
* update storybook story to cover changes with context
* Wrap Checkout Provider with Validation Context Provider
* add screen-reader-text style to storybook
* add styles for input error validation to text input
* improve styling for ValidationInputError component
* add validation error handling to TotalsCouponCode component
And story
* make sure errors are cleared on successful receive/remove item
* dispatch loading cancellation on catching errors
This is needed because loading would be cancelled before the error is thrown so any error handling after the thrown error will not be able to rely on loading.
* implement validation setting for coupon errors
* add error color to labels on inputs too
* fix borders back and force border color
* remove extra structure and improve validation error with alignment for coupon code
* add aria-describedby for text inputs
* add back in validation context provider to fix rebase issue
* rework validation so it works for both checkout and cart
* Some styling tweaks
* more style fixes
* remove unnecessary method
* make sure new function is included in context defaults
* package.lock update? seems harmless so rolling with it.
* Add back icon
* Add cart URL constant
* Add button components
* Implement button components into checkout
* Update checkout styles to match mockup incl updates to margins and padding
* Add options to control return to cart link
* Use checkout context
* Update snapshot
* Update context
* href
* Color/arrow styling
* Implement select instead of open URL field
* Add notice and updated settings control
* Show notice conditonally
* Store permalinks to avoid extra API requests, and get pages via API
* Update snapshots
* Fix double layout conflict
* Switch back to ID and add permalink via block setting
* snaps
* Fix snapshot; add default shape for pages
* Feedback
* Better undefined handling
* Update assets/js/blocks/cart-checkout/checkout/block.js
Co-Authored-By: Darren Ethier <darren@roughsmootheng.in>
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
* Fix address form layout broken because select was occupying too much space
* Fix shipping rates appearing in the Checkout sidebar
* Center button text
* add a hook for throwing errors in a hook callback.
* implement new useThrowError hook
* throw errors when selected shipping rate results in a rest error
* add error handling for various shipping rate error response types
* fix borked merge conflict resolution
* remove throwing error and use correct property for coupons
* add missing default address in use-store-cart
* add missing notices provider
* Add missing props to sidebar-layout components
* Move specific CSS class to checkout block
* Add comment on top of @wordpress/components styles in webpack entry
* Make it so our styles load after vendor styles
* Remove unnecessary @todo comment
* Add Order Summary card to Checkout sidebar
* Improve responsive layout
* Increase cart.js bundlewatch size
* Remove wrong comment
* Remove unnecessary usage of useStoreCartItemQuantity
* Refactor layout so the product description can occupy more width
* Move paddings to the button so focus styles look better
* Move cart attributes to attributes file
* Stop feedback prompt jumping around; consolodate strings
* Update option labels and descriptions
* Match checkout save function
* hasShippingRate helper
* Refactor full cart/frontend views for shipping calc
* Add hasShippingAddress to useShippingRates hook
* Initial shipping calculator in totals row implementation
* Create cart context
* Update preview data to match API response
* Use context provider for cart
* Provide default cart item for placeholder with correct shape
* Remove outdated shape validation from cartlineitemrow
* Use preview data in editor context
* Tidy up components
* Tests/lint
* Update assets/js/base/components/totals/totals-shipping-item/has-shipping-rate.js
Co-Authored-By: Seghir Nadir <nadir.seghir@gmail.com>
* No need to camel case previewdata
* Use isValidElement
* Implement EditorContext
* Use select if no post is given
Co-authored-by: Seghir Nadir <nadir.seghir@gmail.com>
* Set min-height to 0 for Country & State hidden inputs
* Fix button styles broken in the Cart block in editor
* Avoid having editor.scss specific stylesheets for button and totals
* Move Button inside cart-checkout subfolder
* remove throwing errors if there’s an error in state.
These type of errors should be surfaced to user as needed via an error notice, not as a blocking error boundary. Error boundary should only be for non-recoverable errors.
* prevent default behaviour for applyCoupon button
* sticky footer checkout submit button on mobile
* fix storefront footer icons overlaying sticky checkout CTA footer:
- bump z-index of sticky CTA container
- storefront icons have weird z-index due to css opacity
* hide storefront footer on woo cart page only
* remove storefront specific bug fix for sticky cart footer:
- will log this issue separately
* fix proptypes declaration.
This ensures that when `lowStockRemaining` is included it’s either null or a number.
* Ensure backorders_allowed value is boolean.
* add missing properties to cart preview
- restructures `@woocommerce/base-context` imports so it pulls from `index.js` in the `base/context` folder. That way tree-shaking will be used if possible. This also helps with organizing the folder structure a bit better for the new contexts.
- Fixes all the various imports through the code due to the above change.
- Adds `CheckoutContextProvider`, `useCheckoutContext` and related files.
- Adds `PaymentMethodDataProvider`, `usePaymentMethodDataContext` and related files.
- Adds `ShippingMethodDataProvider`, `useShippingMethodDataContext` and related files.
- Adds typedefs used for the various context interfaces.
- `useStoreCartItemQuantity` now receives the cartItem instead of the `cartItemKey` as an argument. I didn't notice in previous reviews how it's used in the context where we already have a cartItem so implementing this reduces complexity and makes the hook more precise for it's purpose.
- Add `backorders_allowed` to the CartItem schema for the API. This allows for client to have correct logic for maximum quantity when this value is true.
- Implement the above in the `CartLineItemRow` so that quantity picker is limited by the amount of stock remaining if that is available (`lowStockRemaining`) and the `backorders_allowed` is false.
- maximum quantity is currently hardcoded to a (filtered) value of `99` when other conditions don't apply (see related issue in woocommerce/woocommerce-blocks#1913)
* add plukedAddress util function in order to use it for shallowEqual
* refactor useShipping so it accepts and returns the address
* refactor fields
* fix test and return shippingRates to hook
* remove unneeded shippingAddress from ShippingRatesControl
* move keys logic to hook
* refactor tests again
* increase cart size
* tidy cart totals layout on mobile:
- totals column is full width
- reset container (card) borders and padding
* increase specificity of mobile cart styles to ensure skeleton hides after load
* use "not loading" && "not skeleton" approach for more readable mobile style selector
* add typedefs for CartItem
* remove cartItem from StoreCartItem typedef
* Implement new typedef and fix defaults as well as returned object.
Now that `cartItem` is only used internally, the default set on the state only has to be the properties required internally in the hook.
* add typedefs for shared settings and implement typedef comments.
* change hook name
* rework the quantity change generator action so the UI updates quick:
- work in progress - still need to figure out how to debounce API call
- add new action for updating quantity for an item
- don't set cart item as pending while quantity is updating
- this leaves QuantitySelector enabled so user can click more/less
- use receiveCartItemQuantity to update quantity in UI before sending request
* debounce line item quantity first cut:
- use local state for quantity, so ui allows multiple clicks up/down
- debounce store updates (and server/API call)
* correct comment on cart item quantity reducer
* remove recieveCartItemQuantity - no longer needed
* remove delegation for deleted RECEIVE_CART_ITEM_QUANTITY
* only update quantity in component sideffect if it has changed:
- reduces unnecessary renders
* factor out debounced quantity update into cartItem hook (hat tip @senadir)
* use quantity from store, instead of passing in to hook +
+ fix latent bug in useStoreCartItem - the cartItem value is now object:
- was previously single-item array
- (note no client code is using this at present)
* tidy/refactor cart item hook - separate dispatch from select
* remove dud reset of item pending flag (came back in rebase)
* add quantity to StoreCartItem hook return value typedef
* fix js error when adding cart block in editor – cartItem not found
* fix typedef
* fix logic for debouncing
* don’t update quantity on server unnecessarily
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
* add select shipping endpoint to router
* add select shipping method
* add selected rates to cart
* better select rates
* move schema function to seperate function
* move validation to Cart Controller
* fix wrong session key
* Update shipping/cart endpoints (https://github.com/woocommerce/woocommerce-blocks/pull/1833)
* Items should not have keys in API response
* Include package ID in response (this is just a basic index)
* /cart/select-shipping-rate/package_id
* Add package_id to package array
* Update responses and add shipping-rates to main cart endpoint
* update-shipping endpoint
* Add querying selected shipping rate to the store (https://github.com/woocommerce/woocommerce-blocks/pull/1829)
* add selecting shipping to store
* directly call useSelectShippingRate
* refactor cart keys transformation to reducer
* remove selecting first result and accept selecting
* move update shipping to new endpoint
* pass selected rates down
* select shipping right directly and fix editor issues
* fix some broken prop types
* key -> package id
* Update and fix cart/shipping-rate tests
* fix case for when rates are set
* Update useShippingRates test
* add args to rest endpoint
* move selecting shipping rate logic to hook
* fix some naming issues
* update propTypes
* update action call
* fully watch cart state
* address review issues
* fix prop type issues
* fix issue with rates not loading in checkout
* remove extra package for shipping
* move ShippingCalculatorOptions to outside
Co-authored-by: Mike Jolley <mike.jolley@me.com>
Co-authored-by: Albert Juhé Lluveras <aljullu@gmail.com>
* add a smaller min-width for cart column on smaller screens
* ensure full price is inline on mobile (when visible)
* ensure line item totals are bottom aligned even if quantity cell is huge
* revert price vertical alignment - in design they are aligned with quantity digit
* Working on store provider
* Working on store provider
* Reducer implementation
* Implement core/notices
* Add notices to store coupon hook with context
* Improve store notice text and styling
* Improve JS side API for notices
* Wrap functions with context additon
* Update test to []
* Implement props feedback and useInstanceId
* Update assets/js/base/context/store-notices-context.js
Co-Authored-By: Darren Ethier <darren@roughsmootheng.in>
* Update assets/js/base/context/store-notices-context.js
Co-Authored-By: Darren Ethier <darren@roughsmootheng.in>
* remove instance id
Co-authored-by: Darren Ethier <darren@roughsmootheng.in>
* first cut - removing an item from cart:
- add actions to cart store for removing an item and keeping track of
pending removal API call
- add reducer logic for storing pending state on an item, and removing
an item
- expose removeCartItem on new useStoreCartItems hook
- hook it up to remove link / trashcan icon in row item
* disable cart quantity picker/remove link while API request in progress:
- expose cart item pending status from store using selector
- use selector to disable quantity related components in line item row
* add typedef for cart items store object provided by hook
* allow user to change quantity of cart items (first cut):
- add action for replacing a cart item in the store
- add generator action for changing quantity
- expose change quantity action on useStoreCartItems hook
- hook up to quantity UI in cart block
(work in progress)
* post-rebase fixes & fix broken typedef:
- rework cart item change quantity callback - now supplies item key like
remove callback
- fix hook StoreCartItem return value typedef - single item with
specified key, was array of all items
- add quantity JSDoc for changeCartItemQuantity action
- remove changeQuantity callback from UI (currently infinite looping)
* fix bug in recieveCartItem reducer - check keys for equality:
- was key === object
* fix invalid url in POST cart/items/quantity request
* hook up cart line item quantity to API:
- remove internal state/ref for QuantitySelector, is now a controlled
component
- call changeQuantity action from QuantitySelector change callback
* QuantitySelector no longer needs a ref to wrangle number input value
* hoist quantity state out of QuantitySelector into story (fix storybook)
* add product sold_individually option to cart item API response
* limit sold_individually items to 1 per cart/order:
- support optional max value in QuantitySelector
- set maximum dependent on sold_individually API field
* prevent user from requesting zero x cart item (API 500 errors):
- add minimum limit to QuantitySelector
- default limit to 1
+ fix bug with limiting to maximum value in number input change handler
* remove useStoreCartItems, zombie hook coming back from rebase 🧟♂️
* address various review feedback:
- inline undefined check, don't use lodash
- quantityInputOnKeyDown callback hook depends on canIncrease/canDecrease
- also removed undefined check for minimum, as minimum has default 0
* use safer typeof check for presence of maximum prop
* first cut - removing an item from cart:
- add actions to cart store for removing an item and keeping track of
pending removal API call
- add reducer logic for storing pending state on an item, and removing
an item
- expose removeCartItem on new useStoreCartItems hook
- hook it up to remove link / trashcan icon in row item
* disable cart quantity picker/remove link while API request in progress:
- expose cart item pending status from store using selector
- use selector to disable quantity related components in line item row
* fix jsdoc - getCartItem returns undefined if not found
* add typedef for cart items store object provided by hook
* fix rebase error - key prop went awol
* orient useStoreCartItem hook to single cart item:
- simplify interface for client component
- isPending bool (was callback)
- removeItem callback no need to specify item key
+ reinstate disabled prop on remove link when updating (lost in rebase)
* move cart item pending state out of cartItems, preserve API state shape:
- pending is now stored as array of keys
- fix isItemQuantityPending selector (now much simpler)
* ensure react knows that our useSelect depends on cartItemKey
* Persist previous shipping rates while loading
* Refactor ShippingRatesControl LoadingMask
* Show package name
* Simplify CSS to avoid using the adjacent selector
* Add comment to explain why 'selected' is hardcoded in the editor
* Rename package 'index' to 'key'
* Chip componet and styling
* Tests
* Move coupon code for API requests to body - fixes issues with coupon codes containing special characters
* Implement chip component in cart page
* Revert "Move coupon code for API requests to body - fixes issues with coupon codes containing special characters"
This reverts commit ac5a72f55d51d939bb989f3936e28cf993af19a6.
* Update comment
* prevent overflow
* Add screen reader text for coupon name
* Adjust icon alignment and padding/hit box
* update string
* Tidied up source code for line item row and fixed image placeholder support
* Return null if not rendering
* Add is loading state and className to cart block
* Hide title if there are no items
* Add placeholder rows when there are not items and cart is loading
* Pass though isLoading to cart
* Set defaults for cart item rows
* Style the placeholder elements
* Move placeholderRows
* Remove getPriceNumber
* Move decodeEntities
* Split up utils
* calculate regular price for line item and return in API `line_subtotal`
* restore `line_subtotal` api field to previous behaviour
* correctly handle discounts on cart line items:
- return product `prices` in cart items endpoint
- calculate full price and discount on client using product
regular_price * quantity in cart
* add product prices to preview cart API data
* show product sale price discount in "save" badge:
- previously we were displaying any effective discount, e.g. from coupons which apply to whole cart
- now this badge will only display discount due to product on sale - much simpler
* rename sale badge class (discount => sale)
* clarify docs for line_subtotal - includes sale prices, not coupons
* clarify line_total docs
* add prices to schema (fix unit test)
* fix schema unit test - return `prices` as object, consistent with `totals`
* Further line total rewording
Co-authored-by: Mike Jolley <mike.jolley@me.com>
* useStoreCartCoupons hook
* Apply coupon w/ basic error handling for the fetch
* Basic store specifically for cart data
* Working on error states
* Show error on coupon fail
* removeCoupon action
* Added extra endpoints for more efficient cart queries
* Apply/remove coupons working
* Track applying/removing state
* StoreCartCoupon typedef
* Use coupon code on index
* Remove custom controls definition
* Adjust storecartcoupons mapper and remove ref
* Move cartData defaults and remove ref
* Call API directly, avoid schema lookup
* Improved selectors
* StoreCart typedef
* Split up cart state data and add more typedefs
* Add API tests for apply/remove coupon
* Jest tests
* Move default cart data to constant
* Comment indentation
* Add product name and quantity to cart shipping rates endpoint
* Make text accessible
* Add styling
* Create Packages component
* Add preview shipping rates to editor
* Add onChange default value
* Order props
* Use CSS instead of JS to render commas between package elements
* Change quantity type to number instead of integer
* install typescript and add typedef support
* add typedefs for Cart things
* improve typescript config
- adds more base config
- add our aliases
* fix error caught by typescript!
* Tweak typescript configuration
* Add missing `@woocommerce/settings` alias to ts config
* Add alias for type-defs
* add cart settings
* address typos
* update how settings should work
* get settings from woo and pass them to frontend
* reapply condition
* fix issue with attributes not presisting
* abstract shipping control
* rename constants
* update props in frontend
* fix bug with attributes not presisting
* conditionally display prices
* use country to decide to show prices
* disable shipping if shipping is not enabled
* enable coupons by default
* hook up cart items to API data in front end (first cut)
* correctly decode entities in product attributes in cart:
+ support unnamed attributes
* correctly render markup in cart line item descriptions:
- description api field is html, so use dangerouslySetInnerHTML
* fix PropTypes - cartItems, not items
* hook up cart totals area to API data +
+ move editor preview totals data to resource-previews (to match API)
* tweak/tidy todo comments for cart front end
* use shorter summary field for cart line item blurb
* render empty cart inner blocks on front end when shopper cart is empty
* ensure empty cart doesn't show while cart contents is loading
* decode entities in attribute names when rendering cart items
Co-Authored-By: Albert Juhé Lluveras <aljullu@gmail.com>
* factor out cart data to a custom hook + exit earlier while loading
* wrap preview/sample cart variation data for translation
* use RawHTML component for rendering cart line item summary +
+ linter whitespace tweak
Co-authored-by: Albert Juhé Lluveras <aljullu@gmail.com>
* Create ShippingCalculatorAddress block
* Make 'change address' button to open/close the address form
* Create ShippingCalculator component
* Use CountryInput and CountyInput instead of TextInputs
* Fix city value not being set
* Fix shipping rate not appearing when there was only one option
* Unify postalCode and postCode to postcode
* Rename 'county' to 'state'
* Add reset styles for popular themes
* Increase cart-frontend.js max size
* Create ShippingMethodsControl component
* Hook up shipping methods to API
* Add support for several packages
* Add tests to useShippingRates
* Fix shipping_rates property name
* Only show the products list if there are several packages
* Use <FormattedMonetaryAmount> to display shipping rate prices
* Make 'country' optional in CartShippingRates
* Make CartShippingRate API return currency info
* Minor improvements
* Fix shipping fields hidden in editor
* Fix missing currency in Checkout shipping rates selector
* Add links to issues in @todo comments
* Improve ShippingRatesControl useEffect
* Remove unnecessary tab
* Remove unnecessary id in RadioControl
* API: Add error when country is invalid
* Debounce shipping rates API requests
* 'Country key' -> 'Country code'
* Don't display radio input when there is only one option
* Add message when there are no results
* Minor enhacements
* Remove unnecessary Fragment
* Simplify RadioControlOption export
* Refactor 'renderOptions' and split it into several components
* Prevent Card sidebar from taking too much width
* Move country request check outside of the loop
* Fix failing test
* introduce feature flags
* move config to webpack-helper
* add flag to deploy command
* remove package default
* add cross-env
* add gating to frontendConfig and coreConfig
* exclude entries from being built on stable mode
* add feature gating to PHP
* add flag to start command
* add flags to travis
* add endpoints
* add better defaults for php
* move code to Bootstrap.php
* no need to spread single object
* ignore blocks.ini
* type check feature flag
* remove blocks.ini
* sanitize flag
* remove flag from npm start
* format condition
* keep spaces for package-lock.json
* check for env before going to block ini
* add env vars to travis
* whitelist env var
* add new icons and remove old ones
* add docs
* add notes and remove gridicons
* update to folderStarred
* typos
* reorder imports
* update prop name to srcElement
* validate element
* fix bad import
* lowecase folderStarred
* add propTypes
* Style mobile qty selector
* Add dedicated column for image and remove duplicate elements
* Tweak column headers
* Refactor cart styles to use CSS grid, and use nesting for organisation
* adjust column widths
* Remove unused div
* Fix wrapping and flexbox styles
* Add decodeEntities to alt attribute
* Use % basis
* Tweak min widths
* correct typography styles for remove link (based on design)
* add trashcan icon from material icons, for removing cart items on mobile
* add & style trash icon for remove cart item on mobile
* a11y - use darker grey for trashcan icon button to improve contrast
* rename IconDelete -> IconTrash
* remove unnecessary div
* use <button> for remove action buttons + add link-button scss mixin
* fix editor styles for cart line items - total column should be right-aligned
* fix various visual issues with cart line items table in editor:
- rows should align hard left and right (first/last child no padding)
- totals should be align-bottom on small screen
- correct vertical padding on column headings
- re-add row border separator lines
* View switcher on cart block
* Dedicated component and styling
* Views and selected should be required
* Rename to ViewSwitcher
* Implement views via render prop
* Remove defaults for required props
* show discount on cart line items (no styling)
* style line item discount badge + use correct colors for prices
* show full price inline on mobile
* move all responsive tweaks for cart prices to explicit breakpoints
* add nowrap to FormattedMoneyAmount so prices don't ever wrap
* fix misaligned full price on mobile when prices are large (edge case):
- if price strings are long, the full price stacks above line total
- previous right-margin on full price showed prices misaligned
* allow client code to add class(es) to FormattedMonetaryAmount
* add nowrap so discount badge doesn't wrap
* remove unnecessary span from discount badge +
+ more explicit `display` style for different price column elements
* show product variation attributes in cart line item + styling:
+ adjust font sizes & colors to match design
* show product description in cart line items…
- this commit also adds descriptions to test cart-items data
- note API does not currently return description/excerpt
* add a class to product attributes to allow custom styling
* Add Cart totals to Cart block
* Accessibility improvements
* Load vendors styles separately
* Use same shipping placeholders for cart and checkout
* Refactor how we import @wordpress/components styles so only panel styles are imported
* Remove style-loader from vendors styles build process
* Add htmlFor attribute to TotalsCouponCodeInput
* Update totalItems shape to match API
* Fix wrong total items shape using numbers instead of strings
* Rename wc-blocks classes to wc-block
* Remove unnecessary parseInt()
* Add radix to parseInt()
* Rename totalRows to totalRowsConfig
* Move placeholder content out of the component
* Use Card component for cart's sidebar (https://github.com/woocommerce/woocommerce-blocks/pull/1423)
* Use Card component for cart's sidebar
* Split RadioControl component
* No need to use Label in RadioControlOption
* Remove no longer valid @todo comment
* Use 'checked' prop instead of 'selected' in RadioControlOption
* Rename wc-blocks classes to wc-block
* Rename wc-blocks classes to wc-block (II)
* Make sure radio control ids are unique using withComponentId
* Load PanelBody and PanelRow from last version of @wordpress/components
* Create vendors-frontend.js file
* Load wordpress-component instead of @wordpress/components from <Button> component
* Only load 'withRestApiHydration' HOC
* Make vendors-frontend a dependency of cart-frontend script
* Revert "Only load 'withRestApiHydration' HOC"
This reverts commit 9f9b9759a98047b26e7d8f04189ffe78c1d5bb06.
* Fix fieldset background
* render block on front end, add `Shopping cart` heading (baby steps)
* fake data for editing full cart + show line count in header
* add note about core/html using `is-active` class for toggle state
* reinstate work-in-progress full cart component (lost in rebase)
* reinstate full cart from master
* component for full cart title & item count + margin tweaks:
- add margin between main cart & sidebar
- add margin after cart block
* add cart items sample data + factor sample product image to module
* use sample cart data for item count
* basic table of cart line items (no styling)
* prettification
* show images for cart line items + initial table styling
* cart quantity selector component (work in progress)
* use state for cart product quantity, allow incr/decr from UI (WIP)
* replace WIP custom quantity control with number edit (temporary)
* correctly format cart line item total price
* align cart item columns with headings + indent image on desktop
* tweak css for cart line item padding on mobile so it's more explicit
* show cart line item full price if discounted
* add placeholder for cart remove item link
* switch cart table to flex layout (was table)…
This will allow us to move things around for mobile/responsive layout.
* only show cart items table header on desktop
* more cart items styling - row borders, appropriate padding +
+ move image width to variable
+ fix class name plurality for row (item not items)
* use standard $gap instead of 1em for padding/margins
* responsive (mobile) layout for cart line items:
- shift line $ total to bottom right
- stack quantity selector in product info column
* remove extraneous cart table padding on mobile
* comment about unused styles for quantity selector component
* add follow up issue for todo
* remove inappropriate href
* render srcset & sizes for cart line item product image
* remove todo comment
* switch back to table markup for cart items (in progress):
- table is more semantic, associates headers with columns
* cart line items column widths - product column is larger (60%)
* reinstate table row borders
* bottom-align line item price on mobile
* cart contents heading should be H2 + prettify
* remove unused QuantitySelector code/styles, rename main class in line with BEM
* defaults for QuantitySelector props
* variable/property name tidies - match conventions/API
* fix bug: line total price is only bottom-align on small screen
* move QuantitySelector to root of components, intended to be generally useful
* use lineItem directly for cart, specify shape in PropTypes
* rename cart components to align with "line item" rather than "product"
* rejig class names to better align with new component names & BEM style
* show cart item image correct size:
- use single column for product image and info, with flex container
- specify image width (rem instead of px)
* fix safari issue - cart product images displaying vertically stretched
* shift product name left margin from image, to account for no-image case
* experiment: bump bundlewatch size limit for cart temporarily:
- our fake data inline image is heavy
- when we switch to real API we will no longer need it
* fix issue introduced when moving margin from image to details div:
- product details needs margin on left (not right)
* fix react props issues:
- explicitly destructure image props for srcSet (vs srcset)
- use API key field for line item key instead of id, fix duplicate test id
- CartLineItemsTable takes an array of lineItems (incorrect PropTypes)
* remove redundant divs + use conventional `null` (when no full price)
* override editor styles to ensure cart product image is correct size
* move cart items editor style override to editor.css
* add an explicit readable heading for cart heading to match visual layout
* Add Feedback Prompt in Cart & Checkout blocks sidebar
* Add border
* Move getInspectorControls out of the component function
* Move feedback prompt to a HOC
* Add @todo comment to feedback link
* Use filter for withFeedbackPrompt
* Export withFeedbackPrompt from hocs index.js
* Typo
* Try moving the feedback texts to context
* Revert "Try moving the feedback texts to context"
This reverts commit 21f889b021ceea6fef722efab9663799829bc769.
* Revert "Use filter for withFeedbackPrompt"
This reverts commit 96bba029d61a383eafa2c0a1c08f7988e319b50d.
* Set feedback text in the HOC function
* Use arrow-function to simplify code
* Refactor
* Update NPM packages
* Switch JSON dependencies to new PHP files
* include->require
* include->require
* Remove from package and run audit fix
* Update wp-prettier
* Use version from asset file
* Fix eslint issues and test failures
* Update OriginalComponent docblocks
* Props are objects, not arrays
* Array to Object
* fix tests throwing unhandled rejection errors in node.
These tests were all testing Promise.rejects but then not properly catching the reject in the assertions.
* exclude rule for no short array syntax allowed
This is a WordPress core standard that we choose to ignore because it’s silly in our context to follow that rule (and we’re being consistent with WooCommerce Admin).
* Add Empty Cart View with inner blocks
* Add logic so empty cart is always saved and only displayed when cart is empty
* Make cart hidden until the correct display is loaded
* Add missing propTypes
* Remove is-loading class
* Import InnerBlocks from @wordpress/block-editor
* Add explanation for always rendering EmptyCart in the editor
* allow merchant to toggle cart empty/full modes in block editor
* use text `Button` for empty/full toolbar buttons
* fix highlighting of current cart state (empty/full) in editor:
- use new custom TextToolbarButton for empty/full mode buttons
* use color variables from css/abstracts/_colors
* Update assets/js/components/text-toolbar-button/index.js
Co-Authored-By: Seghir Nadir <nadir.seghir@gmail.com>
* fix className now props is separated out
* basic empty cart block
* use a real placeholder for placeholder editor content
* remove unnecessary Fragment
* updates to config and frontend script
* enqueue frontend script
* add example config to block registration
* change name typo
Albert Juhé Lluveras
Seghir Nadir
Mike Jolley
Darren Ethier
Rua Haszard
Albert Juhé Lluveras