# nayakops/project-management-tool architecture

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

- Interactive diagram: https://gitdiagram.com/nayakops/project-management-tool
- Repository: https://github.com/nayakops/project-management-tool

## Overview

Vision Board is a project-management web app. Users authenticate, enter a protected workspace, select an organization, and manage projects, members, and tasks; the task board supports filtering and drag-and-drop status updates. The tree also identifies invitation, comments, tags, profile, and organization-management capabilities. The sampled task page and endpoint module establish the task-fetch/update path; other subsystem links reflect named modules and are left unwired where callers were not sampled.

Main entry points: [`src/App.tsx`](https://github.com/nayakops/project-management-tool/blob/main/src/App.tsx) (Application router), [`src/pages/authorized/Tasks.tsx`](https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/Tasks.tsx) (Task board), [`src/services/endpoints`](https://github.com/nayakops/project-management-tool/tree/main/src/services/endpoints) (API endpoints), [`src/store/index.ts`](https://github.com/nayakops/project-management-tool/blob/main/src/store/index.ts) (Redux application state)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_navigation["App and access"]
  node_app["Application router<br/>[App.tsx]"]
  node_protected["Protected routes"]
  node_public["Public routes<br/>[PublicRoutes.tsx]"]
  node_login["Login and signup"]
end

subgraph group_workspace["Workspace management"]
  node_workspace_pages["Workspace pages"]
  node_dashboard["Dashboard<br/>[Home.tsx]"]
  node_projects["Project management<br/>[ProjectUpdate.tsx]"]
  node_organization["Organization settings"]
  node_tasks["Task board<br/>[Tasks.tsx]"]
  node_task_forms["Task forms and comments<br/>[TaskForm.tsx]"]
end

subgraph group_collaboration["Team collaboration"]
  node_members["Member management<br/>[MemberList.tsx]"]
  node_invites["Invitations<br/>[Invitation.tsx]"]
  node_profile["User profile<br/>[UserProfile.tsx]"]
end

subgraph group_data["State and API"]
  node_api_endpoints["API endpoints"]
  node_api_slice["API query layer<br/>[apiSlice.ts]"]
  node_store[("Redux application state<br/>[index.ts]")]
end

node_user(("User"))
node_backend{{"Backend API"}}

node_user -->|"opens app"| node_app
node_app -->|"guards workspace"| node_protected
node_app -->|"routes public"| node_public
node_app -->|"routes dashboard"| node_dashboard
node_app -->|"routes tasks"| node_tasks
node_app -->|"routes projects"| node_projects
node_app -->|"routes settings"| node_organization
node_app -->|"routes members"| node_members
node_app -->|"routes profile"| node_profile
node_public -->|"shows when signed out"| node_login
node_protected -->|"reads auth state"| node_store
node_tasks -->|"reads organization"| node_store
node_tasks -->|"queries and updates"| node_api_endpoints
node_api_endpoints -->|"injects endpoints"| node_api_slice
node_api_slice -->|"registers middleware"| node_store
node_api_endpoints -->|"requests data"| node_backend

click node_app "https://github.com/nayakops/project-management-tool/blob/main/src/App.tsx"
click node_protected "https://github.com/nayakops/project-management-tool/blob/main/src/routes/ProtectedRoutes.tsx"
click node_public "https://github.com/nayakops/project-management-tool/blob/main/src/routes/PublicRoutes.tsx"
click node_login "https://github.com/nayakops/project-management-tool/tree/main/src/pages/non-authorized"
click node_workspace_pages "https://github.com/nayakops/project-management-tool/tree/main/src/pages/authorized"
click node_dashboard "https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/Home.tsx"
click node_projects "https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/ProjectUpdate.tsx"
click node_organization "https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/UpdateOrganisation.tsx"
click node_tasks "https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/Tasks.tsx"
click node_task_forms "https://github.com/nayakops/project-management-tool/blob/main/src/components/form/TaskForm.tsx"
click node_members "https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/MemberList.tsx"
click node_invites "https://github.com/nayakops/project-management-tool/blob/main/src/components/form/Invitation.tsx"
click node_profile "https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/UserProfile.tsx"
click node_api_endpoints "https://github.com/nayakops/project-management-tool/tree/main/src/services/endpoints"
click node_api_slice "https://github.com/nayakops/project-management-tool/blob/main/src/store/slices/apiSlice.ts"
click node_store "https://github.com/nayakops/project-management-tool/blob/main/src/store/index.ts"

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_protected,node_public,node_login,node_user toneBlue
class node_workspace_pages,node_dashboard,node_projects,node_organization,node_tasks,node_task_forms toneAmber
class node_members,node_invites,node_profile,node_backend toneMint
class node_api_endpoints,node_api_slice,node_store toneRose
```

## Components

### App and access

- [Application router](https://github.com/nayakops/project-management-tool/blob/main/src/App.tsx): `src/App.tsx`
- [Protected routes](https://github.com/nayakops/project-management-tool/blob/main/src/routes/ProtectedRoutes.tsx): `src/routes/ProtectedRoutes.tsx`
- [Public routes](https://github.com/nayakops/project-management-tool/blob/main/src/routes/PublicRoutes.tsx): `src/routes/PublicRoutes.tsx`
- [Login and signup](https://github.com/nayakops/project-management-tool/tree/main/src/pages/non-authorized): `src/pages/non-authorized`

### Workspace management

- [Workspace pages](https://github.com/nayakops/project-management-tool/tree/main/src/pages/authorized): `src/pages/authorized`
- [Dashboard](https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/Home.tsx): `src/pages/authorized/Home.tsx`
- [Project management](https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/ProjectUpdate.tsx): `src/pages/authorized/ProjectUpdate.tsx`
- [Organization settings](https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/UpdateOrganisation.tsx): `src/pages/authorized/UpdateOrganisation.tsx`
- [Task board](https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/Tasks.tsx): `src/pages/authorized/Tasks.tsx`
- [Task forms and comments](https://github.com/nayakops/project-management-tool/blob/main/src/components/form/TaskForm.tsx): `src/components/form/TaskForm.tsx`

### Team collaboration

- [Member management](https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/MemberList.tsx): `src/pages/authorized/MemberList.tsx`
- [Invitations](https://github.com/nayakops/project-management-tool/blob/main/src/components/form/Invitation.tsx): `src/components/form/Invitation.tsx`
- [User profile](https://github.com/nayakops/project-management-tool/blob/main/src/pages/authorized/UserProfile.tsx): `src/pages/authorized/UserProfile.tsx`

### State and API

- [API endpoints](https://github.com/nayakops/project-management-tool/tree/main/src/services/endpoints): `src/services/endpoints`
- [API query layer](https://github.com/nayakops/project-management-tool/blob/main/src/store/slices/apiSlice.ts): `src/store/slices/apiSlice.ts`
- [Redux application state](https://github.com/nayakops/project-management-tool/blob/main/src/store/index.ts): `src/store/index.ts`

### Other components

- **User**
- **Backend API**

## Connections

- User → Application router: opens app
- Application router → Protected routes: guards workspace
- Application router → Public routes: routes public
- Application router → Dashboard: routes dashboard
- Application router → Task board: routes tasks
- Application router → Project management: routes projects
- Application router → Organization settings: routes settings
- Application router → Member management: routes members
- Application router → User profile: routes profile
- Public routes → Login and signup: shows when signed out
- Protected routes → Redux application state: reads auth state
- Task board → Redux application state: reads organization
- Task board → API endpoints: queries and updates
- API endpoints → API query layer: injects endpoints
- API query layer → Redux application state: registers middleware
- API endpoints → Backend API: requests data