Repos that we’ll change

...

• Task 1: Create a new feature flag (enable-free-addon-on-cart)

  • This flag will condition the new logic added in the AddOnsItemsContainer

• Task 2: Update types and graphql after changes in the CMS repo

• Task 3: Create a new component to show the add-on free modal

...

Tasks breakdown

RBI Sanity Shared Schemas

...

• Motivation: the client wants to control freely the number of items. This will solve other business problems.

• Label: Quantity of free add-ons

• Description: (to be defined)

PATH FOR THE SOLUTION

• As we’ll have other options we’ll have something equal to the original options (with different names)

• The original option is referenced in the document using the schema for the options. We’ll need to do the same thing here

  

  • We’ll create our new fragment/object in the src/schemas/menu/objects

...

• Motivation: configure the add-ons free modal. The fieldset will help with the organization to group the fields

• Label: (to be defined)

• Description: (to be defined)

• Rules:

  • The fieldset should not be collapsed when appears (DOC)

  • All fields should be children of the fieldset

  • The fieldset should only be visible if the toggle is TRUEfor add-on free items is ON

We also will have the following fields inside this fieldset:

• Image field

  

...

• Modal toggle (to show/hide on the Whitelabel App):

  • Label: (to be defined)

  • Description: (to be defined)

• Modal title field

  • Label: (to be defined)

  • Description: (to be defined)

• Modal description field

  • Label: (to be defined)

  • Description: (to be defined)

• Modal primary button field

  • Label: (to be defined)

  • Description: (to be defined)

PATH FOR THE SOLUTION

• For the fieldset, we have the Hero example on the Intl CMS repo and the doc from Sanity above

• For the image, we can take a look at the item document from the CMS or other documents that have an image field and make the same

...

• After adding the new interfaces open the AddOnsItemsContainer component and add a console log to see if the values from Sanity will be available in the sections. Do some tests (changing the values on Sanity) to see if all is good

Task 3: Create a new component to show the add-on free modal

Create a new sub-component that will be used on the add-on free promotion info

...

• Rules:

  • The text for the title, description, and primary button (the orange one) will come from Sanity

  • The text for the secondary button will be fixed on the “Not Now” label. We’ll add this to the main en.json file and run the lokalize after that

  • If the image is not configured on Sanity the empty space should not be there

  • The modal should only be shown if the respective toggle from Sanity is ON

PATH FOR THE SOLUTION

• He has multiple examples of modals in the application (agreements modal, etc). I don’t see any component that will help us. The Dialog from ctg-components-library did not accept content from what I saw.

DOD-LIKE

• Respect all points from the Rules section

• Implement unit tests

• Validate the layout on: Web and native devices