Skip to main content

Charges Display


Use the Charges section to review the payable amount for an appointment.

This section shows the appointment cost, any applied discounts, and the final total.


This screen includes:

  • Doctor details that show the doctor name, profile image, and medical specialty.
  • A Request summary section that displays the appointment date, time, and visit location.
  • A Location note that explains when the exact address becomes available.
  • A Charges section that lists the appointment cost.
  • An optional promo discount row that shows the promo name and a negative amount when a promo applies.
  • A Total row that shows the final payable amount after discounts.

Workflow

This workflow describes how the app displays charges during an appointment request.

  1. Select a doctor or First available doctor.
  2. Select visit type, date, and time.
  3. Open the Confirm Request screen.
  4. Display the Charges section.
  5. Show the Appointment cost based on the selected visit type.
  6. Show an approximate converted amount when the appointment currency differs.
  7. Display a promo input and apply a discount when a valid promo code exists.
  8. Update the Total based on the displayed charges.

Currency Behavior

The Charges section follows these currency display rules.

Same Currency

When the appointment currency matches the user currency:

  • Show each amount in a single currency.
  • Do not show currency conversion.

Example: Appointment cost $25.

Charges section showing appointment cost in the same currency

Different Currency

When the appointment currency differs from the user currency:

  • Show the primary amount in the appointment currency.
  • Show an approximate converted amount under the price.
  • Display the converted value in parentheses with a tilde (~).

Example: Appointment cost $25 with (~EUR 22) under the price.

Charges section showing appointment cost with approximate currency conversion

Promo Behavior – Same Currency

When a promo applies and currencies match:

  • Add a discount row under Appointment cost.
  • Use the promo name as the row label.
  • Show the discount as a negative amount.
  • Add a Total row.
Charges section showing appointment cost, promo discount, and total in the same currency

Promo Behavior – Different Currency

When a promo applies and currencies differ:

  • Show all primary amounts in the appointment currency.
  • Show an approximate converted amount under each price.
  • Apply this behavior to:
    • Appointment cost.
    • Promo discount.
    • Total.

The converted value appears in parentheses.

Charges section showing appointment cost, promo discount, and total with currency conversion

Validations

These rules control charge presentation.

ScenarioApp behavior
Appointment uses one currency.Shows a single amount per row.
Appointment uses a different currency.Shows an approximate converted value under each amount.
Promo applies.Adds a discount row and shows Total.
Promo does not apply.Shows only Appointment cost.

Actions

Charge updates reflect pricing and discount changes.

ScenarioApp behavior
Price changes.Updates Appointment cost and recalculates Total.
Promo applies.Adds a discount row and recalculates Total.
Promo removal occurs.Removes the discount row and updates Total.
Currency context changes.Updates currency display for all rows.

Endpoint Resources

🧰 Endpoint Resources under construction