Page Comparison

...

• Base interface:

  Code Block
  language typescript
  { title: 'Show section items in cart', description: 'All the items from this section will be available directly in the cart. The section name will be the header title', name: 'showSectionItemsOnCart', type: 'boolean', initialValue: false, hidden: () => ctx.isUS validation: ... }

• The hidden key will be important to not show the toggle for the US market

• Use the validation field and add logic to show an error in Sanity if this the toggle is false but has some service mode selectedON but the user doesn’t select any mode (we changed what I showed in the video above to improve the UX)

For the “Service Modes” toggles:

...

{
  title: 'Service Modes',
  description:
    'If nothingthe isthe selectedtoggle the"show section items willin becart" availableis forON allyou services mode. Ifneed to select oneat orleast moreone options then the items will be shown just for these optionsservice mode.',
  name: 'sectionItemsServiceModes',
  type: 'object',
  fields: [
    {
      title: 'Pick Up',
      name: 'pickUpServiceMode',
      type: 'boolean',
    },
    ... and so on
  ],
  validation: ...,
  hidden: hideIfNoShowSectionItemsOnCart,
}

...

• Add the new interfaces in the add-on-section.graphql

  • Path: src/queries/sanity/fragments/add-on-section.graphql

  Code Block
  language graphql
  fragment AddOnSectionFragment on AddOnSection { ... showSectionItemsOnCart sectionItemsServiceModes { pickUpServiceMode driveThruServiceMode curbsideServiceMode dineInServiceMode tableServiceMode } }

  • yarn run apollo:generate

  • Clear the generated file just with the needed changes

• Update the Interface for the use-feature-menu-add-on.tsx

  • Path: src/hooks/use-feature-menu-add-on.tsx

    Code Block
    language typescript
    export interface IAddOnSection { ..., showSectionItemsOnCart: boolean,; sectionItemsServiceModes: { pickUpServiceMode: boolean,; driveThruServiceMode: boolean,; curbsideServiceMode: boolean,; dineInServiceMode: boolean,; tableServiceMode: boolean,; } }

• Some unit tests will break and we’ll need to adjust them

...