Skip to end of metadata
Go to start of metadata

You are viewing an old version of this content. View the current version.

Compare with Current View Version History

« Previous Version 27 Next »

🛠️ 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.

  • In some regions the phone number may always be empty.

  • Customers may provide different numbers for each order.

  • If the Profile 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.

Show Phone Number - Workflow

The workflow is basically an order flow where the FetchOrder query is fetched, then the phone number is read from Dynamo DB and then it is returned to the Admin Tool to be displayed on screen.

 https://sequencediagram.org/ - Show Phone Number
title Show Phone Number

participant Admin Tool
participant Graphql
participant DB

Admin Tool->Graphql: FetchOrder
Graphql->DB: Read phone number
DB->Graphql: Return phone number 
Admin Tool<-Graphql:Display phone number

For more references:

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

 src/components/order-details/order-details-card.tsx
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

No feature flags are needed as this solution does not impact any existing processes and does not significantly change the support tool UI.

🗓️ Delivery Plan

  • Update query and interface

  • Add new fields table

  • Add new Lokalise translations

🧑‍🚒 QA Plan

Scenario

Condition

Result

Profile Phone Number and Order Both Phone Number populated

Both Profile Phone Number and Order Phone Number should be populated

Both Profile Phone Number and Order Phone Number should have values different or equal values

Order Phone Number populated.

Only Order Phone Number should be populated.

Only Order Phone Number should have a value and Profile Phone Number should show empty line validation

Profile Phone Number populated

In a pickup order, only Profile Phone Number should be populated.

Only Profile Phone Number should have a value and Order Phone Number should show empty line validation

Any Phone Number populated

In a pickup order, any Phone Number should be populated.

Both Profile Phone Number and Order Phone Number should should show empty line validation

⚠️ Call-outs

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

  • No labels