# aymansoliman-dev/coop architecture

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

- Interactive diagram: https://gitdiagram.com/aymansoliman-dev/coop
- Repository: https://github.com/aymansoliman-dev/coop

## Overview

Coop is a Next.js project-workspace application. Users can sign in, then view a dashboard or open a project to see its details, collaborators, technology stack, and tasks. Project data is fetched and mutated through feature hooks and API modules; the sampled project API sends authenticated requests to a configured backend. The source index documents several connections, but many feature components and APIs were not excerpted, so their internal interactions are represented only where supported.

Main entry points: [`src/app/(workspace)/project/page.tsx`](https://github.com/aymansoliman-dev/coop/blob/main/src/app/(workspace)/project/page.tsx) (Project page), [`src/features/projects/api.ts`](https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/api.ts) (Projects API), [`src/app/(workspace)/layout.tsx`](https://github.com/aymansoliman-dev/coop/blob/main/src/app/(workspace)/layout.tsx) (Workspace layout), [`src/app/(workspace)/dashboard/page.tsx`](https://github.com/aymansoliman-dev/coop/blob/main/src/app/(workspace)/dashboard/page.tsx) (Dashboard)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_routes["App routes"]
  node_login_route["Login route<br/>[page.tsx]"]
  node_workspace_layout["Workspace layout<br/>[layout.tsx]"]
  node_dashboard["Dashboard<br/>[page.tsx]"]
  node_project_page["Project page<br/>[page.tsx]"]
end

subgraph group_identity["Authentication"]
  node_login_form["Login form<br/>[login-form.tsx]"]
  node_auth_api["Auth API<br/>[api.ts]"]
  node_auth_user["Auth user hook<br/>[useAuthUser.ts]"]
end

subgraph group_projects["Project workspace"]
  node_projects_api["Projects API<br/>[api.ts]"]
  node_project_hook["Project query<br/>[useProject.ts]"]
  node_projects_list_hook["Projects list<br/>[useProjectsList.ts]"]
  node_create_hook["Create project"]
  node_delete_hook["Delete project"]
  node_create_dialog["Project creation form"]
  node_collaborators["Collaborators"]
  node_collab_hook["Collaborators query"]
  node_collab_api["Collaborations API<br/>[api.ts]"]
  node_stack["Project stack<br/>[project-stack.tsx]"]
  node_stack_hook["Stack query<br/>[useProjectStack.ts]"]
  node_stack_api["Stack API<br/>[api.ts]"]
  node_tasks_table["Tasks table<br/>[tasks-table.tsx]"]
  node_tasks_hook["Tasks query<br/>[useTasks.ts]"]
  node_tasks_api["Tasks API<br/>[api.ts]"]
end

subgraph group_shared["Shared UI"]
  node_app_sidebar["App navigation<br/>[app-sidebar.tsx]"]
  node_data_table["Data table<br/>[data-table.tsx]"]
  node_chart["Interactive chart"]
end

node_visitor(("User"))
node_backend{{"Configured API"}}

node_visitor -->|"opens"| node_login_route
node_login_route -->|"renders"| node_login_form
node_login_form -->|"calls"| node_auth_api
node_auth_user -->|"fetches via"| node_auth_api
node_visitor -->|"opens"| node_workspace_layout
node_workspace_layout -->|"renders"| node_app_sidebar
node_workspace_layout -.->|"routes to"| node_dashboard
node_workspace_layout -.->|"routes to"| node_project_page
node_dashboard -->|"renders"| node_chart
node_dashboard -->|"renders"| node_data_table
node_project_page -->|"queries via"| node_project_hook
node_project_hook -->|"fetches via"| node_projects_api
node_projects_list_hook -->|"fetches via"| node_projects_api
node_create_hook -->|"creates via"| node_projects_api
node_delete_hook -->|"deletes via"| node_projects_api
node_create_dialog -.->|"submits to"| node_create_hook
node_projects_api -->|"sends requests"| node_backend
node_project_page -->|"renders"| node_collaborators
node_project_page -->|"renders"| node_stack
node_project_page -->|"renders"| node_tasks_table
node_collaborators -.->|"uses"| node_collab_hook
node_collab_hook -->|"fetches via"| node_collab_api
node_stack -.->|"uses"| node_stack_hook
node_stack_hook -->|"fetches via"| node_stack_api
node_tasks_table -->|"queries via"| node_tasks_hook
node_tasks_hook -->|"fetches via"| node_tasks_api
node_tasks_table -->|"renders"| node_data_table

click node_login_route "https://github.com/aymansoliman-dev/coop/blob/main/src/app/(auth)/login/page.tsx"
click node_workspace_layout "https://github.com/aymansoliman-dev/coop/blob/main/src/app/(workspace)/layout.tsx"
click node_dashboard "https://github.com/aymansoliman-dev/coop/blob/main/src/app/(workspace)/dashboard/page.tsx"
click node_project_page "https://github.com/aymansoliman-dev/coop/blob/main/src/app/(workspace)/project/page.tsx"
click node_login_form "https://github.com/aymansoliman-dev/coop/blob/main/src/features/auth/components/login-form.tsx"
click node_auth_api "https://github.com/aymansoliman-dev/coop/blob/main/src/features/auth/api.ts"
click node_auth_user "https://github.com/aymansoliman-dev/coop/blob/main/src/features/auth/hooks/useAuthUser.ts"
click node_projects_api "https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/api.ts"
click node_project_hook "https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/hooks/useProject.ts"
click node_projects_list_hook "https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/hooks/useProjectsList.ts"
click node_create_hook "https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/hooks/useCreateProject.ts"
click node_delete_hook "https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/hooks/useDeleteProject.ts"
click node_create_dialog "https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/components/new-project-dialog.tsx"
click node_collaborators "https://github.com/aymansoliman-dev/coop/blob/main/src/features/collaborations/components/project-collaborators.tsx"
click node_collab_hook "https://github.com/aymansoliman-dev/coop/blob/main/src/features/collaborations/hooks/useCollaborators.ts"
click node_collab_api "https://github.com/aymansoliman-dev/coop/blob/main/src/features/collaborations/api.ts"
click node_stack "https://github.com/aymansoliman-dev/coop/blob/main/src/features/stack/components/project-stack.tsx"
click node_stack_hook "https://github.com/aymansoliman-dev/coop/blob/main/src/features/stack/hooks/useProjectStack.ts"
click node_stack_api "https://github.com/aymansoliman-dev/coop/blob/main/src/features/stack/api.ts"
click node_tasks_table "https://github.com/aymansoliman-dev/coop/blob/main/src/features/tasks/components/tasks-table.tsx"
click node_tasks_hook "https://github.com/aymansoliman-dev/coop/blob/main/src/features/tasks/hooks/useTasks.ts"
click node_tasks_api "https://github.com/aymansoliman-dev/coop/blob/main/src/features/tasks/api.ts"
click node_app_sidebar "https://github.com/aymansoliman-dev/coop/blob/main/src/shared/components/app-sidebar.tsx"
click node_data_table "https://github.com/aymansoliman-dev/coop/blob/main/src/shared/components/data-table.tsx"
click node_chart "https://github.com/aymansoliman-dev/coop/blob/main/src/shared/components/chart-area-interactive.tsx"

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_login_route,node_workspace_layout,node_dashboard,node_project_page,node_visitor toneBlue
class node_login_form,node_auth_api,node_auth_user toneAmber
class node_projects_api,node_project_hook,node_projects_list_hook,node_create_hook,node_delete_hook,node_create_dialog,node_collaborators,node_collab_hook,node_collab_api,node_stack,node_stack_hook,node_stack_api,node_tasks_table,node_tasks_hook,node_tasks_api,node_backend toneMint
class node_app_sidebar,node_data_table,node_chart toneRose
```

## Components

### App routes

- [Login route](https://github.com/aymansoliman-dev/coop/blob/main/src/app/(auth)/login/page.tsx): `src/app/(auth)/login/page.tsx`
- [Workspace layout](https://github.com/aymansoliman-dev/coop/blob/main/src/app/(workspace)/layout.tsx): `src/app/(workspace)/layout.tsx`
- [Dashboard](https://github.com/aymansoliman-dev/coop/blob/main/src/app/(workspace)/dashboard/page.tsx): `src/app/(workspace)/dashboard/page.tsx`
- [Project page](https://github.com/aymansoliman-dev/coop/blob/main/src/app/(workspace)/project/page.tsx): `src/app/(workspace)/project/page.tsx`

### Authentication

- [Login form](https://github.com/aymansoliman-dev/coop/blob/main/src/features/auth/components/login-form.tsx): `src/features/auth/components/login-form.tsx`
- [Auth API](https://github.com/aymansoliman-dev/coop/blob/main/src/features/auth/api.ts): `src/features/auth/api.ts`
- [Auth user hook](https://github.com/aymansoliman-dev/coop/blob/main/src/features/auth/hooks/useAuthUser.ts): `src/features/auth/hooks/useAuthUser.ts`

### Project workspace

- [Projects API](https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/api.ts): `src/features/projects/api.ts`
- [Project query](https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/hooks/useProject.ts): `src/features/projects/hooks/useProject.ts`
- [Projects list](https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/hooks/useProjectsList.ts): `src/features/projects/hooks/useProjectsList.ts`
- [Create project](https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/hooks/useCreateProject.ts): `src/features/projects/hooks/useCreateProject.ts`
- [Delete project](https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/hooks/useDeleteProject.ts): `src/features/projects/hooks/useDeleteProject.ts`
- [Project creation form](https://github.com/aymansoliman-dev/coop/blob/main/src/features/projects/components/new-project-dialog.tsx): `src/features/projects/components/new-project-dialog.tsx`
- [Collaborators](https://github.com/aymansoliman-dev/coop/blob/main/src/features/collaborations/components/project-collaborators.tsx): `src/features/collaborations/components/project-collaborators.tsx`
- [Collaborators query](https://github.com/aymansoliman-dev/coop/blob/main/src/features/collaborations/hooks/useCollaborators.ts): `src/features/collaborations/hooks/useCollaborators.ts`
- [Collaborations API](https://github.com/aymansoliman-dev/coop/blob/main/src/features/collaborations/api.ts): `src/features/collaborations/api.ts`
- [Project stack](https://github.com/aymansoliman-dev/coop/blob/main/src/features/stack/components/project-stack.tsx): `src/features/stack/components/project-stack.tsx`
- [Stack query](https://github.com/aymansoliman-dev/coop/blob/main/src/features/stack/hooks/useProjectStack.ts): `src/features/stack/hooks/useProjectStack.ts`
- [Stack API](https://github.com/aymansoliman-dev/coop/blob/main/src/features/stack/api.ts): `src/features/stack/api.ts`
- [Tasks table](https://github.com/aymansoliman-dev/coop/blob/main/src/features/tasks/components/tasks-table.tsx): `src/features/tasks/components/tasks-table.tsx`
- [Tasks query](https://github.com/aymansoliman-dev/coop/blob/main/src/features/tasks/hooks/useTasks.ts): `src/features/tasks/hooks/useTasks.ts`
- [Tasks API](https://github.com/aymansoliman-dev/coop/blob/main/src/features/tasks/api.ts): `src/features/tasks/api.ts`

### Shared UI

- [App navigation](https://github.com/aymansoliman-dev/coop/blob/main/src/shared/components/app-sidebar.tsx): `src/shared/components/app-sidebar.tsx`
- [Data table](https://github.com/aymansoliman-dev/coop/blob/main/src/shared/components/data-table.tsx): `src/shared/components/data-table.tsx`
- [Interactive chart](https://github.com/aymansoliman-dev/coop/blob/main/src/shared/components/chart-area-interactive.tsx): `src/shared/components/chart-area-interactive.tsx`

### Other components

- **User**
- **Configured API**

## Connections

- User → Login route: opens
- Login route → Login form: renders (evidence: `src/app/(auth)/login/page.tsx`)
- Login form → Auth API: calls (evidence: `src/features/auth/components/login-form.tsx`)
- Auth user hook → Auth API: fetches via (evidence: `src/features/auth/hooks/useAuthUser.ts`)
- User → Workspace layout: opens
- Workspace layout → App navigation: renders (evidence: `src/app/(workspace)/layout.tsx`)
- Workspace layout → Dashboard: routes to
- Workspace layout → Project page: routes to
- Dashboard → Interactive chart: renders (evidence: `src/app/(workspace)/dashboard/page.tsx`)
- Dashboard → Data table: renders (evidence: `src/app/(workspace)/dashboard/page.tsx`)
- Project page → Project query: queries via (evidence: `src/app/(workspace)/project/page.tsx`)
- Project query → Projects API: fetches via (evidence: `src/features/projects/hooks/useProject.ts`)
- Projects list → Projects API: fetches via (evidence: `src/features/projects/hooks/useProjectsList.ts`)
- Create project → Projects API: creates via (evidence: `src/features/projects/hooks/useCreateProject.ts`)
- Delete project → Projects API: deletes via (evidence: `src/features/projects/hooks/useDeleteProject.ts`)
- Project creation form → Create project: submits to
- Projects API → Configured API: sends requests (evidence: `src/features/projects/api.ts`)
- Project page → Collaborators: renders (evidence: `src/app/(workspace)/project/page.tsx`)
- Project page → Project stack: renders (evidence: `src/app/(workspace)/project/page.tsx`)
- Project page → Tasks table: renders (evidence: `src/app/(workspace)/project/page.tsx`)
- Collaborators → Collaborators query: uses
- Collaborators query → Collaborations API: fetches via (evidence: `src/features/collaborations/hooks/useCollaborators.ts`)
- Project stack → Stack query: uses
- Stack query → Stack API: fetches via (evidence: `src/features/stack/hooks/useProjectStack.ts`)
- Tasks table → Tasks query: queries via (evidence: `src/features/tasks/components/tasks-table.tsx`)
- Tasks query → Tasks API: fetches via (evidence: `src/features/tasks/hooks/useTasks.ts`)
- Tasks table → Data table: renders (evidence: `src/features/tasks/components/tasks-table.tsx`)