# sanjeevandev/team-chat-app architecture

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

- Interactive diagram: https://gitdiagram.com/sanjeevandev/team-chat-app
- Repository: https://github.com/sanjeevandev/team-chat-app

## Overview

Team Chat App is a privacy-focused collaboration app for team and project communication. Users register or log in, discover or create teams, join channels, and exchange real-time channel or direct messages; they can also manage friends, profile settings, and notifications. The frontend routes through authenticated pages and uses stores for client state, while the Express server dispatches API routes and Socket.IO events to service modules backed by PostgreSQL. Team membership, conversations, uploads, and presence are distinct supporting domains. README and sampled files establish the broad workflow; unsampled route and UI wiring is represented only where the tree supports it.

Main entry points: [`backend/src/server.js`](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/server.js) (HTTP and socket server), [`frontend/src/App.jsx`](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/App.jsx) (App routes), [`frontend/src/pages/DashboardPage.jsx`](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/pages/DashboardPage.jsx) (Team dashboard), [`backend/src/services/socketService.js`](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/socketService.js) (Socket events)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_client["Web client"]
  node_app["App routes<br/>[App.jsx]"]
  node_login["Login and register<br/>[LoginPage.jsx]"]
  node_dashboard["Team dashboard<br/>[DashboardPage.jsx]"]
  node_chatpage["Chat page<br/>[ChatPage.jsx]"]
  node_friendsview["Friends view<br/>[FriendsView.jsx]"]
  node_discover["Discover teams"]
  node_settings["Settings<br/>[SettingsPage.jsx]"]
  node_authstore["Auth state<br/>[authStore.js]"]
  node_teamstore["Team state<br/>[teamStore.js]"]
  node_channelstore["Channel state<br/>[channelStore.js]"]
  node_messagestore["Message state<br/>[messageStore.js]"]
  node_friendstore["Friend state<br/>[friendStore.js]"]
  node_notifstore["Notification state"]
end

subgraph group_api["API and realtime"]
  node_server["HTTP and socket server<br/>[server.js]"]
  node_authroutes["Auth routes<br/>[auth.js]"]
  node_authmw["JWT middleware<br/>[auth.js]"]
  node_teamroutes["Team routes<br/>[teams.js]"]
  node_messageroutes["Message routes<br/>[messages.js]"]
  node_friendroutes["Friend routes<br/>[friends.js]"]
  node_convroutes["Conversation routes<br/>[conversations.js]"]
  node_notifroutes["Notification routes<br/>[notifications.js]"]
  node_uploadroutes["Upload routes<br/>[upload.js]"]
  node_useroutes["User routes<br/>[users.js]"]
  node_socket["Socket events<br/>[socketService.js]"]
end

subgraph group_collaboration["Collaboration services"]
  node_authsvc["Authentication<br/>[authService.js]"]
  node_teamsvc["Team membership<br/>[teamService.js]"]
  node_channelsvc["Channel management<br/>[channelService.js]"]
  node_messagesvc["Channel messages<br/>[messageService.js]"]
  node_convsvc["Direct conversations"]
  node_friendsvc["Friend network<br/>[friendService.js]"]
  node_notifsvc["Notifications"]
  node_usersvc["User profiles<br/>[userService.js]"]
  node_uploadsvc["File upload<br/>[uploadService.js]"]
end

subgraph group_data["Persistence and files"]
end

node_user(("Team member"))

node_user -->|"uses"| node_app
node_app -->|"routes"| node_login
node_app -->|"routes"| node_dashboard
node_app -->|"routes"| node_chatpage
node_app -->|"routes"| node_settings
node_dashboard -->|"opens"| node_discover
node_dashboard -->|"opens"| node_friendsview
node_login -->|"authenticates"| node_authstore
node_settings -->|"updates profile"| node_authstore
node_dashboard -->|"loads teams"| node_teamstore
node_discover -->|"browses teams"| node_teamstore
node_chatpage -->|"loads channels"| node_channelstore
node_chatpage -->|"handles messages"| node_messagestore
node_friendsview -->|"manages friends"| node_friendstore
node_dashboard -->|"shows alerts"| node_notifstore
node_authstore -->|"HTTP requests"| node_server
node_teamstore -->|"HTTP requests"| node_server
node_channelstore -->|"HTTP requests"| node_server
node_messagestore -->|"HTTP requests"| node_server
node_friendstore -->|"HTTP requests"| node_server
node_notifstore -->|"HTTP requests"| node_server
node_server -->|"dispatches"| node_authroutes
node_server -->|"dispatches"| node_teamroutes
node_server -->|"dispatches"| node_messageroutes
node_server -->|"dispatches"| node_friendroutes
node_server -->|"dispatches"| node_convroutes
node_server -->|"dispatches"| node_notifroutes
node_server -->|"dispatches"| node_uploadroutes
node_server -->|"dispatches"| node_useroutes
node_server -->|"sets up"| node_socket
node_authroutes -->|"calls"| node_authsvc
node_teamroutes -->|"calls"| node_teamsvc
node_messageroutes -->|"calls"| node_messagesvc
node_friendroutes -->|"calls"| node_friendsvc
node_convroutes -->|"calls"| node_convsvc
node_notifroutes -->|"calls"| node_notifsvc
node_uploadroutes -->|"calls"| node_uploadsvc
node_useroutes -->|"calls"| node_usersvc
node_authroutes -.->|"validates via"| node_authmw
node_socket -->|"saves messages"| node_messagesvc
node_socket -->|"saves messages"| node_convsvc
node_socket -->|"creates alerts"| node_notifsvc
node_socket -->|"updates presence"| node_usersvc
node_teamsvc -->|"creates default"| node_channelsvc
node_teamsvc -->|"notifies members"| node_notifsvc
node_friendsvc -->|"notifies users"| node_notifsvc

click node_app "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/App.jsx"
click node_login "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/pages/LoginPage.jsx"
click node_dashboard "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/pages/DashboardPage.jsx"
click node_chatpage "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/pages/ChatPage.jsx"
click node_friendsview "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/components/FriendsView.jsx"
click node_discover "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/components/DiscoverTeamsView.jsx"
click node_settings "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/pages/SettingsPage.jsx"
click node_authstore "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/authStore.js"
click node_teamstore "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/teamStore.js"
click node_channelstore "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/channelStore.js"
click node_messagestore "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/messageStore.js"
click node_friendstore "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/friendStore.js"
click node_notifstore "https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/notificationStore.js"
click node_server "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/server.js"
click node_authroutes "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/auth.js"
click node_authmw "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/middleware/auth.js"
click node_teamroutes "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/teams.js"
click node_messageroutes "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/messages.js"
click node_friendroutes "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/friends.js"
click node_convroutes "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/conversations.js"
click node_notifroutes "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/notifications.js"
click node_uploadroutes "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/upload.js"
click node_useroutes "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/users.js"
click node_socket "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/socketService.js"
click node_authsvc "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/authService.js"
click node_teamsvc "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/teamService.js"
click node_channelsvc "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/channelService.js"
click node_messagesvc "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/messageService.js"
click node_convsvc "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/conversationService.js"
click node_friendsvc "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/friendService.js"
click node_notifsvc "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/notificationService.js"
click node_usersvc "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/userService.js"
click node_uploadsvc "https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/uploadService.js"

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,node_login,node_dashboard,node_chatpage,node_friendsview,node_discover,node_settings,node_authstore,node_teamstore,node_channelstore,node_messagestore,node_friendstore,node_notifstore toneBlue
class node_server,node_authroutes,node_authmw,node_teamroutes,node_messageroutes,node_friendroutes,node_convroutes,node_notifroutes,node_uploadroutes,node_useroutes,node_socket toneAmber
class node_authsvc,node_teamsvc,node_channelsvc,node_messagesvc,node_convsvc,node_friendsvc,node_notifsvc,node_usersvc,node_uploadsvc toneMint
class node_user toneIndigo
```

## Components

### Web client

- [App routes](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/App.jsx): `frontend/src/App.jsx`
- [Login and register](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/pages/LoginPage.jsx): `frontend/src/pages/LoginPage.jsx`
- [Team dashboard](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/pages/DashboardPage.jsx): `frontend/src/pages/DashboardPage.jsx`
- [Chat page](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/pages/ChatPage.jsx): `frontend/src/pages/ChatPage.jsx`
- [Friends view](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/components/FriendsView.jsx): `frontend/src/components/FriendsView.jsx`
- [Discover teams](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/components/DiscoverTeamsView.jsx): `frontend/src/components/DiscoverTeamsView.jsx`
- [Settings](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/pages/SettingsPage.jsx): `frontend/src/pages/SettingsPage.jsx`
- [Auth state](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/authStore.js): `frontend/src/store/authStore.js`
- [Team state](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/teamStore.js): `frontend/src/store/teamStore.js`
- [Channel state](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/channelStore.js): `frontend/src/store/channelStore.js`
- [Message state](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/messageStore.js): `frontend/src/store/messageStore.js`
- [Friend state](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/friendStore.js): `frontend/src/store/friendStore.js`
- [Notification state](https://github.com/sanjeevandev/team-chat-app/blob/main/frontend/src/store/notificationStore.js): `frontend/src/store/notificationStore.js`

### API and realtime

- [HTTP and socket server](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/server.js): `backend/src/server.js`
- [Auth routes](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/auth.js): `backend/src/routes/auth.js`
- [JWT middleware](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/middleware/auth.js): `backend/src/middleware/auth.js`
- [Team routes](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/teams.js): `backend/src/routes/teams.js`
- [Message routes](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/messages.js): `backend/src/routes/messages.js`
- [Friend routes](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/friends.js): `backend/src/routes/friends.js`
- [Conversation routes](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/conversations.js): `backend/src/routes/conversations.js`
- [Notification routes](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/notifications.js): `backend/src/routes/notifications.js`
- [Upload routes](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/upload.js): `backend/src/routes/upload.js`
- [User routes](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/routes/users.js): `backend/src/routes/users.js`
- [Socket events](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/socketService.js): `backend/src/services/socketService.js`

### Collaboration services

- [Authentication](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/authService.js): `backend/src/services/authService.js`
- [Team membership](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/teamService.js): `backend/src/services/teamService.js`
- [Channel management](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/channelService.js): `backend/src/services/channelService.js`
- [Channel messages](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/messageService.js): `backend/src/services/messageService.js`
- [Direct conversations](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/conversationService.js): `backend/src/services/conversationService.js`
- [Friend network](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/friendService.js): `backend/src/services/friendService.js`
- [Notifications](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/notificationService.js): `backend/src/services/notificationService.js`
- [User profiles](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/userService.js): `backend/src/services/userService.js`
- [File upload](https://github.com/sanjeevandev/team-chat-app/blob/main/backend/src/services/uploadService.js): `backend/src/services/uploadService.js`

### Other components

- **Team member**

## Connections

- Team member → App routes: uses
- App routes → Login and register: routes
- App routes → Team dashboard: routes
- App routes → Chat page: routes
- App routes → Settings: routes
- Team dashboard → Discover teams: opens
- Team dashboard → Friends view: opens
- Login and register → Auth state: authenticates
- Settings → Auth state: updates profile
- Team dashboard → Team state: loads teams
- Discover teams → Team state: browses teams
- Chat page → Channel state: loads channels
- Chat page → Message state: handles messages
- Friends view → Friend state: manages friends
- Team dashboard → Notification state: shows alerts
- Auth state → HTTP and socket server: HTTP requests
- Team state → HTTP and socket server: HTTP requests
- Channel state → HTTP and socket server: HTTP requests
- Message state → HTTP and socket server: HTTP requests
- Friend state → HTTP and socket server: HTTP requests
- Notification state → HTTP and socket server: HTTP requests
- HTTP and socket server → Auth routes: dispatches
- HTTP and socket server → Team routes: dispatches
- HTTP and socket server → Message routes: dispatches
- HTTP and socket server → Friend routes: dispatches
- HTTP and socket server → Conversation routes: dispatches
- HTTP and socket server → Notification routes: dispatches
- HTTP and socket server → Upload routes: dispatches
- HTTP and socket server → User routes: dispatches
- HTTP and socket server → Socket events: sets up
- Auth routes → Authentication: calls
- Team routes → Team membership: calls
- Message routes → Channel messages: calls
- Friend routes → Friend network: calls
- Conversation routes → Direct conversations: calls
- Notification routes → Notifications: calls
- Upload routes → File upload: calls
- User routes → User profiles: calls
- Auth routes → JWT middleware: validates via
- Socket events → Channel messages: saves messages
- Socket events → Direct conversations: saves messages
- Socket events → Notifications: creates alerts
- Socket events → User profiles: updates presence
- Team membership → Channel management: creates default
- Team membership → Notifications: notifies members
- Friend network → Notifications: notifies users