# KROW Project Workflows This document contains diagrams describing the technical architecture and collaboration processes for the project. ## 1. Web App Migration Architecture This diagram illustrates the migration workflow for the web application. It shows how the UI is exported from the Base44 environment and then connected to our new, unified backend built on Firebase services. ```mermaid graph LR subgraph Base44 Environment direction TB Client[Client] -- Modifies --> B44_UI[Base44 Visual Builder
Features:
- Event Management
- Staff Directory] B44_UI --> B44_Backend[Base44 Backend
Provides Schemas & SDK] end subgraph Firebase Ecosystem - GCP direction TB KROW_FE[KROW Web Frontend
Vite/React + TanStack Query] subgraph Firebase Services direction TB Auth[Firebase Authentication] DataConnect[Firebase Data Connect
GraphQL API] SQL_DB[Cloud SQL for PostgreSQL] end KROW_FE -- "Uses" --> Auth KROW_FE -- "Calls API via SDK" --> DataConnect DataConnect -- "Manages & Queries" --> SQL_DB end B44_UI -- "UI Code Export" --> KROW_FE style Client fill:#f9f,stroke:#333,stroke-width:2px style B44_UI fill:#ffe,stroke:#333,stroke-width:2px style KROW_FE fill:#eef,stroke:#333,stroke-width:2px ``` ## 2. Mobile App Architecture This diagram shows how the native mobile applications (Client and Staff) connect to the centralized Firebase backend. This backend is the same one used by the web application. ```mermaid graph TD subgraph KROW Mobile Applications direction LR Mobile_Client[Mobile Client App
Flutter] Mobile_Staff[Mobile Staff App
Flutter] end subgraph Firebase Backend Services - GCP direction TB Auth[Firebase Authentication] DataConnect[Firebase Data Connect
GraphQL API &
Generated SDKs] SQL_DB[Cloud SQL for PostgreSQL
Managed by Data Connect] end Mobile_Client -- "Authenticates with" --> Auth Mobile_Client -- "Calls API via generated SDK" --> DataConnect Mobile_Staff -- "Authenticates with" --> Auth Mobile_Staff -- "Calls API via generated SDK" --> DataConnect DataConnect -- "Manages & Queries" --> SQL_DB style Mobile_Client fill:#eef,stroke:#333,stroke-width:2px style Mobile_Staff fill:#eef,stroke:#333,stroke-width:2px ``` ## 3. Collaboration Workflow for Modifications This diagram formalizes the process to follow for any modifications initiated by the client on the Base44 platform. The objective is to control the pace of changes and evaluate their impact on our backend before integration. ```mermaid flowchart TD A[Client identifies a need
for modification] --> B{Define functionality
and scope}; B --> C{Does the modification impact
only the UI or also
logic/data?}; C -- "UI Only" --> D[Client makes modifications
on Base44]; C -- "Logic/Data" --> E[Team-Client Coordination
to assess impact on GCP backend]; D --> F[Planned export of the
new UI version]; E --> F; F --> G["Developer runs the automation
1. `make integrate-export`
2. `make prepare-export`"]; G --> H[Development & Testing
- Adapt GCP backend if needed
- Validate locally]; H --> I[✅ Integration complete]; style A fill:#f9f,stroke:#333,stroke-width:2px style D fill:#f9f,stroke:#333,stroke-width:2px ```