Muffin Shop Dashboard

👨‍💼 The muffin shop wants a simple dashboard for a single order so the team can double-check totals before handing it off.

📜 This example uses React + Vite, but everything React-related is already done for you. You only need the workshop skills: numbers, strings, booleans, variables, functions, if/else, switch statements, loops, and never.

🐨 Open

src/muffin-utils.ts

and complete the following tasks:

Format money with a template literal.
Add the (GF) label for gluten-free items.
Sum the subtotal with a loop.
Apply the member discount.
Calculate tax and tip.
Calculate the final total.
Return the pickup fee with a switch statement.
Return the pickup label with a switch statement.
Format the special note when it's empty.
Log the ready message.
Implement assertNever.

💰 Toggle memberStatus or pickupMethod in

src/app.tsx

to see different outputs.

Try next

🐨 Add another OrderItem and watch the totals change.
🐨 Add a rushOrder boolean and increase the tip when it is true.
🐨 Add a itemCount helper that uses a loop to count total quantity.
🐨 Add a happyHour boolean and reduce the muffin price when true.
🐨 Add a memberMessage string in app.tsx using an if check.
💰 Change specialNote to a real note and confirm the fallback logic.

Extras/Muffin Shop Dashboard

Try next