Repos that we’ll change

Whitelabel App: https://github.com/rbilabs/intl-whitelabel-app

Figma:

...

Solution proposal

In the Sanity went can set images of the product by Restaurant, Delivery or Kiosk

...

Restaurant selected.

...

Delivery

...

...

Acceptance Criteria

• Should show product image by channel.

  • Items.

  • Combo.

    • Items inside the Combo must show the changed images

      

  • Picker.

    • Items and Combos inside the Picker must show the changed images

      

      
      

  • In Section should not change image, example “Top Sales”

    

  • It should show correct image in Recent Order.

    • It should not change after the order ends.

      

  • It should show correct image in Checkout.

    • if a product is at the checkout and you change restaurants (Delivery → Restaurant), the image should change.

      

  • When you finish the order, it must show the correct image in the Add On section.

    

    

    • Should change image in Add Extra as well
      

      

Task summary

Intl Whitelabel App:

• Task 1 - Create a Feature Flag

• Task 2 - Add imagesByChannels in Graphql

• Task 3 - Add new interfaces and update.

• Task 4 - Implement logic for show image by channel (function change image)

• Task 5 - Implement function change image in the add-on section and add extra (Ketchup)

...

Tasks breakdown

Intl Whitelabel APP

Task 1 - Create a Feature Flag

• New feature flag for front-end: ENABLE_IMAGES_BY_CHANNELS

Task 2 - Add imagesByChannels in Graphql

• Should create a new graphql file to imagesByChannel

  • Example : https://github.com/rbilabs/intl-whitelabel-app/pull/1841/files#diff-4570b3b140f129d1e996edb231de396894c13059dc31b8dc1c7caad9e6bd672e

• Update Combo Graphql to add imagesByChannel

  • workspaces/frontend/src/queries/sanity/fragments/combo.graphql

• Update Item Graphql to add imagesByChannel

  • workspaces/frontend/src/queries/sanity/fragments/item.graphql

• Update Picker Graphql to add imagesByChannel

  • workspaces/frontend/src/queries/sanity/fragments/picker-availability.graphql

• Update Product List Graphql to add imagesByChannel

  • workspaces/frontend/src/queries/sanity/fragments/product-list-section.graphql

...

Update Sanity Graphql with command yarn apollo-generate.

Task 3 - Add new interfaces and update

Link reference: https://github.com/rbilabs/intl-whitelabel-app/pull/1841/files#diff-3c5a6dd1f32b86cde31b8257a1e8332e9f8ccd97ae8931f47c64ad105103601c

...

• Should add new imagesByChannels interface with imageDelivery, imageKiosk and imageRestaurant.

• Should add imagesByChannel in IPickerItem

• Should add imagesByChannel in IBasePicker

• Should add imagesByChannel in IBaseCombo

• Should add imagesByChannel in IBaseItem

• Should add imagesByChannel in IMainMenuPickerView

Task 4 - Implement logic to image show per channel.

Link reference: https://github.com/rbilabs/intl-whitelabel-app/pull/1841/files#diff-4516aec29cee97c67b42f2b6e7ebb3e2a78da046f48149a0002e9cb815c0e505

...

• Should add Piotr and Marco in Code Review.

Task 5 - Implement function change image in the Addons section and Add Extra (Ketchup)

Links reference:

Add Ons

https://github.com/rbilabs/intl-whitelabel-app/pull/1841/files#diff-93b83a363f89eac56923577fd7624748a3041ad034ed535fd74229bc2794257a

...

• Must use image change function in Add-on Section and Add Extra (implemented in the task 4)

...

POC:

https://github.com/rbilabs/intl-whitelabel-app/pull/1841

...