# sanniayomide/konnectme architecture

> Architecture diagram of the GitHub repository sanniayomide/konnectme, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-11). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/sanniayomide/konnectme
- Repository: https://github.com/sanniayomide/konnectme

## Overview

KonnectMe is a Flutter video-meeting app. A user signs in with Clerk, enters a shared meeting ID in the responsive lounge, and joins a ZEGO call using their signed-in identity and device preferences. Shared theme and reusable controls support the interface. The README documents these product stages and integrations; Dart implementation files were not excerpted, so the relationships below reflect that documentation rather than inspected call sites.

Main entry points: [`lib/main.dart`](https://github.com/sanniayomide/konnectme/blob/main/lib/main.dart) (Flutter app), [`lib/presentation/join_meeting_page.dart`](https://github.com/sanniayomide/konnectme/blob/main/lib/presentation/join_meeting_page.dart) (Meeting lounge), [`lib/login_page.dart`](https://github.com/sanniayomide/konnectme/blob/main/lib/login_page.dart) (Clerk sign-in), [`lib/presentation/meeting_page.dart`](https://github.com/sanniayomide/konnectme/blob/main/lib/presentation/meeting_page.dart) (ZEGO call)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_app["App entry"]
  node_app_entry["Flutter app<br/>[main.dart]"]
  node_env_config["Environment config<br/>[env_config.dart]"]
end

subgraph group_identity["Authentication"]
  node_login["Clerk sign-in<br/>[login_page.dart]"]
end

subgraph group_meeting["Meeting experience"]
  node_lounge["Meeting lounge"]
  node_call["ZEGO call<br/>[meeting_page.dart]"]
end

subgraph group_shared["Shared UI"]
  node_theme["Material styling<br/>[app_theme.dart]"]
  node_components["Reusable controls<br/>[components.dart]"]
end

node_user(("User"))
node_clerk{{"Clerk"}}
node_zego{{"ZEGO UIKit"}}

node_user -->|"opens app"| node_app_entry
node_app_entry -->|"presents sign-in"| node_login
node_login -->|"authenticates with"| node_clerk
node_app_entry -.->|"uses configuration"| node_env_config
node_login -->|"continues signed-in"| node_lounge
node_user -->|"enters meeting ID"| node_lounge
node_lounge -->|"joins meeting"| node_call
node_call -->|"runs call with"| node_zego
node_app_entry -->|"uses styling"| node_theme
node_lounge -->|"uses controls"| node_components
node_call -->|"applies preferences"| node_components

click node_app_entry "https://github.com/sanniayomide/konnectme/blob/main/lib/main.dart"
click node_env_config "https://github.com/sanniayomide/konnectme/blob/main/lib/data/config/env_config.dart"
click node_login "https://github.com/sanniayomide/konnectme/blob/main/lib/login_page.dart"
click node_lounge "https://github.com/sanniayomide/konnectme/blob/main/lib/presentation/join_meeting_page.dart"
click node_call "https://github.com/sanniayomide/konnectme/blob/main/lib/presentation/meeting_page.dart"
click node_theme "https://github.com/sanniayomide/konnectme/blob/main/lib/ui/app_theme.dart"
click node_components "https://github.com/sanniayomide/konnectme/blob/main/lib/ui/components.dart"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_app_entry,node_env_config,node_user toneBlue
class node_login toneAmber
class node_lounge,node_call toneMint
class node_theme,node_components toneRose
class node_clerk,node_zego toneIndigo
```

## Components

### App entry

- [Flutter app](https://github.com/sanniayomide/konnectme/blob/main/lib/main.dart): `lib/main.dart`
- [Environment config](https://github.com/sanniayomide/konnectme/blob/main/lib/data/config/env_config.dart): `lib/data/config/env_config.dart`

### Authentication

- [Clerk sign-in](https://github.com/sanniayomide/konnectme/blob/main/lib/login_page.dart): `lib/login_page.dart`

### Meeting experience

- [Meeting lounge](https://github.com/sanniayomide/konnectme/blob/main/lib/presentation/join_meeting_page.dart): `lib/presentation/join_meeting_page.dart`
- [ZEGO call](https://github.com/sanniayomide/konnectme/blob/main/lib/presentation/meeting_page.dart): `lib/presentation/meeting_page.dart`

### Shared UI

- [Material styling](https://github.com/sanniayomide/konnectme/blob/main/lib/ui/app_theme.dart): `lib/ui/app_theme.dart`
- [Reusable controls](https://github.com/sanniayomide/konnectme/blob/main/lib/ui/components.dart): `lib/ui/components.dart`

### Other components

- **User**
- **Clerk**
- **ZEGO UIKit**

## Connections

- User → Flutter app: opens app (evidence: `README.md`)
- Flutter app → Clerk sign-in: presents sign-in (evidence: `README.md`)
- Clerk sign-in → Clerk: authenticates with (evidence: `README.md`)
- Flutter app → Environment config: uses configuration
- Clerk sign-in → Meeting lounge: continues signed-in (evidence: `README.md`)
- User → Meeting lounge: enters meeting ID (evidence: `README.md`)
- Meeting lounge → ZEGO call: joins meeting (evidence: `README.md`)
- ZEGO call → ZEGO UIKit: runs call with (evidence: `README.md`)
- Flutter app → Material styling: uses styling (evidence: `README.md`)
- Meeting lounge → Reusable controls: uses controls (evidence: `README.md`)
- ZEGO call → Reusable controls: applies preferences (evidence: `README.md`)