Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  • Task 1 - Update GraphQL Query to get new data

  • Task 2 - Update hook for get new objects of sanity (validate cache)

  • Task 3 - Validate if purchased products have a refill for this store

  • Task 4 - Create a new request for backend “intl-whitelabel-graphql” - GetRefillDrinkQRCode (Request GraphQL implementation)

  • Task 5 - Get and use QRCode of GetRefillDrinkQRCode and Scheduled (Request GraphQL implementation)

  • Task 6 - Get QRCode for purchased scheduled

Tasks breakdown

Intl Whitelabel CMS

...

  • create unit test - doesn’t need

  • receive a hash code with success

Task 5 - Get and use QRCode of GetRefillDrinkQRCode (Request GraphQL implementation) and Scheduled

We need to validate the Order, if fireOrderIn exists, it should not generate a hashCode, but rather start monitoring times, and when the configured time arrives, it should show the QRCode..

If there is no fireOrderIn in the Order, hashQrCode must be generated via backend and saved in local storage.

  • Implement GetRefillDrinkQRCode function to call backend.

  • In the use-free-refill-drinks.ts should create a new function to save order information in the Local Storage, make to validation in status and fireOrderIn field and create useState to storage hashCode

    Code Block
      const [hashQrCodeRefill, setHashQrCodeRefill] = useState('');
      
     const getHashQrCodeBackEnd = (data: FreeRefillOrderInfosProps) => {
        if (data?.status) {
          return 'hash-qr-code'; // GetRefillDrinkQRCode
        }
    
        return '';
      };
     
     const handleOrderFreeRefill = useCallback((order: FreeRefillOrderInfosProps) => {
        if (
          order.status === RbiOrderStatus.INSERT_SUCCESSFUL ||
          order.status === RbiOrderStatus.UPDATE_SUCCESSFUL
        ) {
          const hashQrCode = !order?.fireOrderIn ? getHashQrCodeBackEnd(order) : '';
    
          const qrCodeInfos = {
            ...order,
            hashCode: hashQrCode,
          };
    
          setHashQrCodeRefill(hashQrCode);
    
          LocalStorage.setItem(Keys.FREE_REFILL_ORDER_INFOS, qrCodeInfos);
        }
      }, []);
  • In the use-order-status.ts should call handleOrderFreeRefill function, this function is order status control and all orders pass here.

    Code Block
      useEffect(() => {
        if (!serverOrder) {
          return;
        }
    
        handleOrderFreeRefill({
          orderId: serverOrder?.rbiOrderId,
          storeId: serverOrder?.cart?.storeDetails?.storeNumber,
          fireOrderIn: serverOrder?.fireOrderIn,
          updatedAt: serverOrder?.updatedAt,
          serviceMode: serverOrder?.cart?.serviceMode,
          transactionId: serverOrder?.posOrderId,
          status: serverOrder?.status,
        });
      }, [handleOrderFreeRefill, serverOrder]);

  • In the use-free-refill-drinks.ts should create a new function to monitor the schedule and show the QRCode according to the settings.

    Code Block
    const checkHashRefillQrCode = useCallback((): void => {
        const freeRefillOrderInfos = getOrderInfos();
    
        if (freeRefillOrderInfos?.hashCode) {
          setHashQrCodeRefill(freeRefillOrderInfos.hashCode);
        }
    
        if (freeRefillOrderInfos?.fireOrderIn && freeRefillOrderInfos?.updatedAt) {
          const updateAtOrder = new Date(freeRefillOrderInfos.updatedAt).getTime();
          const fireOrderShowQrCode = addSeconds(
            updateAtOrder,
            freeRefillOrderInfos.fireOrderIn + (fireOrderAhead ?? 0)
          ).getTime();
    
          const dateNow = Date.now();
    
          const hasQrCodeAvailable = dateNow >= fireOrderShowQrCode;
    
          if (hasQrCodeAvailable) {
            const updateFreeRefillOrderInfos = {
              ...freeRefillOrderInfos,
              hashCode: getHashQrCodeBackEnd(freeRefillOrderInfos),
            };
    
            LocalStorage.setItem(Keys.FREE_REFILL_ORDER_INFOS, updateFreeRefillOrderInfos);
            setHashQrCodeRefill(updateFreeRefillOrderInfos.hashCode);
          }
        }
      }, [fireOrderAhead, getOrderInfos]);
    
      useEffect(() => {
        checkHashRefillQrCode();
    
        const interval = setInterval(checkHashRefillQrCode, 5000);
    
        if (hashQrCodeRefill) {
          clearInterval(interval);
        }
    
        return () => clearInterval(interval);
      }, [checkHashRefillQrCode, hashQrCodeRefill]);
  • In the bottom-sheet-refill-drinks.tsx should renderhashQrCodeRefill field.

  • In the refill-drinks-qrcode-button.tsx should renderhashQrCodeRefill field.

DOD-LIKE

  • Create unit test

  • Call hashCode in backend.

  • Validate fireOrderIn and show QRCode in time correct

    • FireOrder time is incremented with fireOrderAhead settings in LauchDarkly.

    • Code Block
      const fireOrderAhead = useFlag(LaunchDarklyFlag.FIRE_ORDER_AHEAD);
      
      const fireOrderShowQrCode = addSeconds(
              updateAtOrder,
              freeRefillOrderInfos.fireOrderIn + (fireOrderAhead ?? 0)
        ).getTime(); 

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

Get the response of GetRefillDrinkQRCode and return hash, save this hash in Local Storage of our application for use in QRCode.

...