Skip to content
This repository has been archived by the owner on Feb 23, 2024. It is now read-only.

Checkout i2: Add Inner Block Areas to each Form Step #4306

Closed
mikejolley opened this issue Jun 3, 2021 · 0 comments
Closed

Checkout i2: Add Inner Block Areas to each Form Step #4306

mikejolley opened this issue Jun 3, 2021 · 0 comments
Assignees
@mikejolley
Labels
block: checkout Issues related to the checkout block. category: extensibility Work involving adding or updating extensibility. Useful to combine with other scopes impacted. type: enhancement The issue is a request for an enhancement.

Comments

@mikejolley
Copy link
Member

mikejolley commented Jun 3, 2021 •
edited
Loading

Introduce a structure with inner block areas within each checkout step.

Each form step currently on the checkout should have an inner block area. Components within the form step should either be fixed in place (outside of the inner blocks), or a block within the inner blocks.

This is related to #4445 but can be implemented before locking is available.
@mikejolley mikejolley added the block: checkout Issues related to the checkout block. label Jun 3, 2021
@mikejolley mikejolley changed the title Form Step Inner Blocks Checkout i2: Add Inner Block Areas to each Form Step Jul 8, 2021
@mikejolley mikejolley added type: enhancement The issue is a request for an enhancement. category: extensibility Work involving adding or updating extensibility. Useful to combine with other scopes impacted. labels Jul 8, 2021
This was referenced Jul 8, 2021
Closed
Closed
Closed
@mikejolley mikejolley self-assigned this Jul 14, 2021
mikejolley added a commit that referenced this issue Jul 15, 2021
@mikejolley
Add inner block areas below each form step.
bd1db9b 
This does not include the form step contents, just adds inner blocks after existing content. Moving content within the inner block area is a separate discussion.

This closes #4306
mikejolley added a commit that referenced this issue Jul 20, 2021
@mikejolley
Add inner block areas below each form step.
16a55b9 
This does not include the form step contents, just adds inner blocks after existing content. Moving content within the inner block area is a separate discussion.

This closes #4306
mikejolley added a commit that referenced this issue Jul 22, 2021
@mikejolley @senadir @nerrad
WIP - Checkout i2 Feature Branch Tracking (#4268)
89b5d30 
* Duplicate checkout block

* Contact information block

* form step block

* shipping address block

* Setup atomic blocks

* Container structure

* More formal steps rather than generic form step

* Add billing and shipping forms

* add checkout actions block

* add order note block

* Add order summary

* add payment block

* Add inspector controls for address fields

* frontend WIP

* move attributes

* wrap shipping with form step

* PhoneNumber to typescript

* Remove column block

* form steps

* move payment logic to frontend

* Express block

* inline payment block

* Add shipping method block

* Render inner blocks (not standalone blocks) and add classes to Atomic Block list on php side

* lazy again

* Add more wrappers from old frontend file

* add layout

* Checkout wrappers were missing

* Enqueue payment methods for new block

* Add missing classnames

* Move shipping as billing state to context provider

* express payments rendering

* try/block-registry

* Remove atomic components (unused)

* Fix attribute persistance due to template locking

* Fix shipping display when not needed

* Set correct parent blocks for inner blocks

* pass data to blocks

* demo/newsletter

* Skeleton styling

* only apply styles to loading state for now

* shipping method block frontend

* rename express block

* lock template

* fix ts warning for __webpack_public_path__

* Refactor to avoid duplicating atomic block logic

* remove changes in save method

* Add zones and shipping methods to the sidebar for the shipping inner block

Closes #4320

* Fix script handles

* Fix method display when there are none

* Add shipping phone

* Add phone to api and sync with billing correctly

* Clear hidden fields on load

* fix requirePhoneField property

* Enable shipping and billing phone fields

* readonly field support

* Handle context attributes

* Fix createInterpolateElement usage

* add totalswrapper

* Implement Terms and Conditions block for Checkout i2  (#4436)

* Setup atomic blocks

* frontend WIP

* Express block

* try/block-registry

* Set correct parent blocks for inner blocks

* Skeleton styling

* Refactor to avoid duplicating atomic block logic

* add block locking

* add terms and conditions block

* hardcore settings image

* lock blocks from being deleted

* hide original checkout block

* mark blocks as side effectful

* move variations to block register function

* prevent core checkout blocks from needlessly showing in the inserter

* enable checkout i1

* fix broken rebase

* move save back

* Localise default text

Co-authored-by: Mike Jolley <[email protected]>

* Add add-hoc Block locking from WooCommerce Blocks side. (#4454)

* add locking

* use subscribe instead

* fix condition

* add locking to blocks

* check if the item is not a text field

* Tidy up hacks CSS class handling

* Fix error if node is undefined

* Hide menu when move is disabled

* update package lock

* Add todo and fix issue where selector returns null

* split todos

* move todo

* edit comment

Co-authored-by: Mike Jolley <[email protected]>

* Un-disable the billing checkbox in the editor (#4457)

* Add missing Slot fill provider on frontend

Fixes #4441 by adding the slot fill provider to the checkout-i2 block.

* Use column style appender

* Add padding/styles to actions

* Add/update icon library

* Multiline checkbox alignment

* Icons and copy changes for i2 blocks

* Add terms by default

* Add notice if text is missing links (#4466)

* Swap variations for toggle

* Add payment settings to inspector

* Update package lock

* Add inline docs to block registry

* Add inner block areas below each form step.

This does not include the form step contents, just adds inner blocks after existing content. Moving content within the inner block area is a separate discussion.

This closes #4306

* Sample block registration + docs

* Add tests for registerCheckoutBlock

* Fix lazy component detection in tests

* Add basic transform between i1 and i2

* remove template lock todo

* Update scroll to top hoc

* Move shared settings to new context providers

Closes #4472

* Remove readonly field support (unused)

* Remove context code

* Experimental

* remove invalid typedef

* FIx scrolling on validation due to misplaced context provider

* Update assets/js/base/context/providers/cart-checkout/checkout-state/index.tsx

Co-authored-by: Darren Ethier <[email protected]>

* Update comment to remove reference to phone

* Update packages/checkout/blocks-registry/README.md

Co-authored-by: Darren Ethier <[email protected]>

* Rename ScrollToTopComponent

* Add explicit list of expectedType in TypeScript definition

* Add todo to remove custom shipping phone handling

* Remove dangerouslySetInnerHTML in External Link Card Component

* Add ExternalLinkCard to storybook

* update todo wording

* Refactor withScrollToTop to remove useCallback and use typescript

* Support children on CheckboxControl, with added Typescript

* Spread getRegisteredBlocks return value

Co-authored-by: Nadir Seghir <[email protected]>
Co-authored-by: Darren Ethier <[email protected]>
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@mikejolley mikejolley

Labels
block: checkout Issues related to the checkout block. category: extensibility Work involving adding or updating extensibility. Useful to combine with other scopes impacted. type: enhancement The issue is a request for an enhancement.
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@mikejolley