## What the prompt does This prompt generates a Mermaid diagram that visualizes the backend architecture of a Flutter project. It uses the given overview and use case diagrams to create a detailed diagram that shows the relationships between different components and services. ## Assumption - Flutter project is given - Overview mermaid diagram is given - Use case diagram is given ## How to use the prompt For the given Flutter project, the backend uses **GraphQL** and **Firebase**. I want multiple detailed Mermaid diagrams to understand how everything is connected. Please do the following: 1. **Read and analyze** the entire project, along with these two files: * `overview.mermaid` * `use-case-flowchart.mermaid` 2. Based on all available information, generate **three separate Mermaid diagrams**: ### A. Backend Architecture Diagram * Show the high-level structure of the backend. * Include GraphQL server components, Firebase services (Auth, Firestore, Storage, Functions, etc.), and how the Flutter app connects to them. * Show data flow between Flutter → GraphQL → Firebase → back to the client. ### B. API Map (GraphQL Operations + Firebase Interactions) * List and group all GraphQL queries, mutations, and subscriptions. * Show which ones interact with Firebase and how. * If Firestore collections or documents are involved, show them as nodes. * Clearly illustrate the relationship between API operations and backend resources. ### C. Use-Case Flow Diagrams * For each major use case in the project: * Show how the request moves from the Flutter UI to the backend. * Show the sequence of steps involving GraphQL operations and Firebase services. * Show how responses return back to the UI. * Organize all use cases into **one combined Mermaid diagram** or **multiple subgraph clusters**. 3. Ensure all diagrams are: * Clean, readable, and logically grouped * Consistent with the structure of the existing project and the two Mermaid reference files * Detailed enough for developers to understand backend behavior at a glance 4. Output the three diagrams clearly labeled as: * **Backend Architecture** * **API Map** * **Use-Case Flows**