Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update README with Data Flow and Code Structure for Cupcake App #113

Open
wants to merge 3 commits into
base: main
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 34 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,3 +19,37 @@ Getting Started
2. Download the sample.
3. Import the sample into Android Studio.
4. Build and run the sample.


Flow Diagram
---------------
![cupcake app diagram (1)](https://github.com/user-attachments/assets/62f0a0aa-5497-4603-9f52-64cc759a7e01)

## Data Flow and Code Structure (with Diagram Explanation)

The diagram explains the overall data flow of the "Cupcake" app. The architecture and flow can be summarized as follows:

### User Interaction (Screens):
The user interacts with the app through four key screens:
1. **StartOrderScreen**: Users select the number of cupcakes.
2. **FlavorScreen**: Users select the cupcake flavor.
3. **PickupScreen**: Users choose a pickup date.
4. **SummaryScreen**: The final order details are displayed, and users can share the order.

### Cupcake Screens Enum:
The app navigates between screens using the `CupcakeScreen` enum, where each screen is associated with a title resource (e.g., `R.string.choose_flavor`).

### OrderViewModel:
The `OrderViewModel` manages the cupcake order state. It uses `MutableStateFlow` to store the order details, like quantity, flavor, and pickup date. The model also handles logic like price calculation, including adding a surcharge for same-day pickup.

- As users interact with the UI (selecting a quantity, flavor, or date), the `OrderViewModel` updates the `uiState`, which is observed by the UI to reflect the changes in real-time.

### Navigation:
The navigation between screens is handled using the `NavController`. Based on user actions (e.g., clicking "Next"), the app moves to the next screen, and the `OrderViewModel` updates the necessary state (e.g., quantity, flavor, or date).

### UI State and Updates:
The UI is reactive, meaning that it observes changes in the `uiState`. For example, the price is recalculated every time the user changes the quantity or pickup date, and the updated price is displayed in the UI.

### Order Summary:
The `SummaryScreen` displays the final order details and allows the user to share the order using an Android implicit intent.