🛠️ Potential Solutions

🧐 Assumptions

• Admin Tool does not provide the phone number information provided by the customer during the ordering process.

• Customer is not required to register a phone number in their profile.

• Customers may provide different numbers for each order.

• If the Customer phone number is not provided it will be shown three dashes or points according to the brand design.

✅ Proposed Solution

Get the user's phone number from the customer data and order phone number from the order data.

For more references:

• POC: https://github.com/rbilabs/intl-admin-app/pull/793

✅ Pros:

• Quick implementation.

Proposal

Update FetchOrder query

• Add phoneNumber to dropoff and customer

export const FetchOrder = gql`
  query Order($rbiOrderId: String!) {
    Order(rbiOrderId: $rbiOrderId) {
      id: rbiOrderId
      __typename
      ...
      customer {
        ...
        phoneNumber
      }
      delivery {
        ...
        dropoff {
          ...
          phoneNumber
        }
      ...
    }
  }
  ${CartEntryFragment}
`;

Update Dropoff interface

• Add phoneNumber to the Dropoff in services/graphql/src/schemas/orders.ts and run yarn types.

Add phone number info to the table

const OrderDetailsCard = ({
  order,
  loading,
  isRefundEligible,
}: OrderDetailsProps & RefundEligibilityProps) => {
  ...

  return (
    <Card variant="outlined">
      ...
      <Table>
        <TableBody>
         ...
          <TwoColumnTableRow
            headerText={formatMessage({ id: 'loyaltyCartDetails.customerPhoneNumber' })}
            loading={loading}
            empty={!order?.delivery?.dropoff?.phoneNumber}
            value={order?.delivery?.dropoff?.phoneNumber}
          />
          <TwoColumnTableRow
            headerText={formatMessage({ id: 'rderDetails.phoneNumber' })}
            loading={loading}
            empty={!order?.customer?.phoneNumber}
            value={order?.customer?.phoneNumber}
          />
          ...
        </TableBody>
      </Table>
    </Card>
  );
};

export default OrderDetailsCard;

Add new translations

• loyaltyCartDetails.customerPhoneNumber: Profile phone number.

• orderDetails.phoneNumber: Order phone number.

🎛️ Configuration

🗓️ Delivery Plan

• Update query and interface

• Add new fields table

• Add new Lokalise translations

🧑‍🚒 QA Plan

⚠️ Call-outs

https://www.figma.com/design/Ti8Qr6jeSEPaencIDyYfcJ/branch/20qsLOwGIwHajxKTTrVpOp/Burger-King?node-id=3176-13800&t=2KAGZQ6XmCFFg5YX-0