# phamtanhoang/jira-fe architecture

> Architecture diagram of the GitHub repository phamtanhoang/jira-fe, 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/phamtanhoang/jira-fe
- Repository: https://github.com/phamtanhoang/jira-fe

## Overview

This is a Jira-style project-management frontend: users authenticate, enter workspaces and projects, manage issues on Kanban/Scrum boards, and collaborate through comments, mentions, notifications, and sharing. Project configuration includes columns, labels, custom fields, templates, and recurring issues; separate branches cover account management and administration. The app’s feature hooks and shared HTTP client form the internal interaction layer. Edges reflect documented capabilities and sampled calls; unsampled feature wiring is intentionally not inferred.

Main entry points: [`src/lib/api/client.ts`](https://github.com/phamtanhoang/jira-fe/blob/main/src/lib/api/client.ts) (HTTP client), [`src/app/(main)/workspaces/[workspaceId]/projects/[projectId]/settings/client.tsx`](https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/workspaces/%5BworkspaceId%5D/projects/%5BprojectId%5D/settings/client.tsx) (Project settings), [`src/app/(admin)/admin/client.tsx`](https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(admin)/admin/client.tsx) (Admin console), [`src/app/(main)/workspaces/client.tsx`](https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/workspaces/client.tsx) (Workspace views)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_entry["App entry and access"]
  node_auth_pages["Auth pages<br/>[page.tsx]"]
  node_middleware["Route protection<br/>[middleware.ts]"]
  node_dashboard["Dashboard<br/>[client.tsx]"]
end

subgraph group_work["Project work management"]
  node_workspace_pages["Workspace views<br/>[client.tsx]"]
  node_board["Project board<br/>[client.tsx]"]
  node_project_features["Issues and boards<br/>[api.ts]"]
  node_project_settings["Project settings<br/>[client.tsx]"]
  node_custom_fields["Custom fields<br/>[api.ts]"]
  node_templates["Issue templates<br/>[api.ts]"]
  node_recurring["Recurring issues<br/>[api.ts]"]
  node_workspaces_feature["Workspace membership<br/>[api.ts]"]
end

subgraph group_collab["Collaboration and account"]
  node_auth_feature["Authentication<br/>[api.ts]"]
  node_sharing["Issue sharing<br/>[api.ts]"]
  node_notifications["Notifications<br/>[api.ts]"]
  node_profile["Profile and security<br/>[client.tsx]"]
end

subgraph group_admin["Administration"]
  node_admin_pages["Admin console<br/>[client.tsx]"]
  node_admin_feature["Admin operations<br/>[api.ts]"]
  node_admin_users["User administration<br/>[api.ts]"]
  node_webhooks["Webhook management<br/>[api.ts]"]
end

subgraph group_core["Client interaction layer"]
  node_api_client["HTTP client<br/>[client.ts]"]
  node_query["Query state<br/>[index.tsx]"]
end

node_person(("User"))
node_backend{{"Jira Clone backend"}}

node_person -->|"signs in"| node_auth_pages
node_auth_pages -->|"uses auth"| node_auth_feature
node_auth_feature -->|"sends requests"| node_api_client
node_api_client -->|"HTTP requests"| node_backend
node_person -->|"opens routes"| node_middleware
node_middleware -->|"permits access"| node_dashboard
node_person -->|"views work"| node_dashboard
node_person -->|"selects workspace"| node_workspace_pages
node_workspace_pages -->|"opens project"| node_board
node_board -->|"manages issues"| node_project_features
node_project_settings -->|"configures columns"| node_project_features
node_project_settings -->|"configures fields"| node_custom_fields
node_project_settings -->|"manages templates"| node_templates
node_project_settings -->|"sets recurrence"| node_recurring
node_sharing -->|"sends requests"| node_api_client
node_notifications -->|"sends requests"| node_api_client
node_profile -->|"updates account"| node_auth_feature
node_profile -->|"sets preferences"| node_notifications
node_workspace_pages -->|"manages membership"| node_workspaces_feature
node_admin_pages -->|"loads admin data"| node_admin_feature
node_admin_pages -->|"shows user health"| node_admin_users
node_admin_pages -->|"manages webhooks"| node_webhooks
node_project_features -->|"sends requests"| node_api_client
node_custom_fields -->|"sends requests"| node_api_client
node_templates -->|"sends requests"| node_api_client
node_recurring -->|"sends requests"| node_api_client
node_workspaces_feature -->|"sends requests"| node_api_client
node_admin_feature -->|"sends requests"| node_api_client
node_admin_users -->|"sends requests"| node_api_client
node_webhooks -->|"sends requests"| node_api_client
node_query -->|"shares server state"| node_api_client

click node_auth_pages "https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(auth)/sign-in/page.tsx"
click node_auth_feature "https://github.com/phamtanhoang/jira-fe/blob/main/src/features/auth/api.ts"
click node_middleware "https://github.com/phamtanhoang/jira-fe/blob/main/src/middleware.ts"
click node_dashboard "https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/dashboard/client.tsx"
click node_workspace_pages "https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/workspaces/client.tsx"
click node_board "https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/workspaces/%5BworkspaceId%5D/projects/%5BprojectId%5D/board/client.tsx"
click node_project_features "https://github.com/phamtanhoang/jira-fe/blob/main/src/features/projects/api.ts"
click node_project_settings "https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/workspaces/%5BworkspaceId%5D/projects/%5BprojectId%5D/settings/client.tsx"
click node_custom_fields "https://github.com/phamtanhoang/jira-fe/blob/main/src/features/custom-fields/api.ts"
click node_templates "https://github.com/phamtanhoang/jira-fe/blob/main/src/features/issue-templates/api.ts"
click node_recurring "https://github.com/phamtanhoang/jira-fe/blob/main/src/features/recurring-issues/api.ts"
click node_sharing "https://github.com/phamtanhoang/jira-fe/blob/main/src/features/issue-share/api.ts"
click node_notifications "https://github.com/phamtanhoang/jira-fe/blob/main/src/features/notifications/api.ts"
click node_profile "https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/profile/client.tsx"
click node_workspaces_feature "https://github.com/phamtanhoang/jira-fe/blob/main/src/features/workspaces/api.ts"
click node_admin_pages "https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(admin)/admin/client.tsx"
click node_admin_feature "https://github.com/phamtanhoang/jira-fe/blob/main/src/features/admin/api.ts"
click node_admin_users "https://github.com/phamtanhoang/jira-fe/blob/main/src/features/admin-users/api.ts"
click node_webhooks "https://github.com/phamtanhoang/jira-fe/blob/main/src/features/webhooks/api.ts"
click node_api_client "https://github.com/phamtanhoang/jira-fe/blob/main/src/lib/api/client.ts"
click node_query "https://github.com/phamtanhoang/jira-fe/blob/main/src/components/providers/query-provider/index.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_auth_pages,node_middleware,node_dashboard,node_person toneBlue
class node_workspace_pages,node_board,node_project_features,node_project_settings,node_custom_fields,node_templates,node_recurring,node_workspaces_feature toneAmber
class node_auth_feature,node_sharing,node_notifications,node_profile toneMint
class node_admin_pages,node_admin_feature,node_admin_users,node_webhooks toneRose
class node_api_client,node_query,node_backend toneIndigo
```

## Components

### App entry and access

- [Auth pages](https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(auth)/sign-in/page.tsx): `src/app/(auth)/sign-in/page.tsx`
- [Route protection](https://github.com/phamtanhoang/jira-fe/blob/main/src/middleware.ts): `src/middleware.ts`
- [Dashboard](https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/dashboard/client.tsx): `src/app/(main)/dashboard/client.tsx`

### Project work management

- [Workspace views](https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/workspaces/client.tsx): `src/app/(main)/workspaces/client.tsx`
- [Project board](https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/workspaces/%5BworkspaceId%5D/projects/%5BprojectId%5D/board/client.tsx): `src/app/(main)/workspaces/[workspaceId]/projects/[projectId]/board/client.tsx`
- [Issues and boards](https://github.com/phamtanhoang/jira-fe/blob/main/src/features/projects/api.ts): `src/features/projects/api.ts`
- [Project settings](https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/workspaces/%5BworkspaceId%5D/projects/%5BprojectId%5D/settings/client.tsx): `src/app/(main)/workspaces/[workspaceId]/projects/[projectId]/settings/client.tsx`
- [Custom fields](https://github.com/phamtanhoang/jira-fe/blob/main/src/features/custom-fields/api.ts): `src/features/custom-fields/api.ts`
- [Issue templates](https://github.com/phamtanhoang/jira-fe/blob/main/src/features/issue-templates/api.ts): `src/features/issue-templates/api.ts`
- [Recurring issues](https://github.com/phamtanhoang/jira-fe/blob/main/src/features/recurring-issues/api.ts): `src/features/recurring-issues/api.ts`
- [Workspace membership](https://github.com/phamtanhoang/jira-fe/blob/main/src/features/workspaces/api.ts): `src/features/workspaces/api.ts`

### Collaboration and account

- [Authentication](https://github.com/phamtanhoang/jira-fe/blob/main/src/features/auth/api.ts): `src/features/auth/api.ts`
- [Issue sharing](https://github.com/phamtanhoang/jira-fe/blob/main/src/features/issue-share/api.ts): `src/features/issue-share/api.ts`
- [Notifications](https://github.com/phamtanhoang/jira-fe/blob/main/src/features/notifications/api.ts): `src/features/notifications/api.ts`
- [Profile and security](https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(main)/profile/client.tsx): `src/app/(main)/profile/client.tsx`

### Administration

- [Admin console](https://github.com/phamtanhoang/jira-fe/blob/main/src/app/(admin)/admin/client.tsx): `src/app/(admin)/admin/client.tsx`
- [Admin operations](https://github.com/phamtanhoang/jira-fe/blob/main/src/features/admin/api.ts): `src/features/admin/api.ts`
- [User administration](https://github.com/phamtanhoang/jira-fe/blob/main/src/features/admin-users/api.ts): `src/features/admin-users/api.ts`
- [Webhook management](https://github.com/phamtanhoang/jira-fe/blob/main/src/features/webhooks/api.ts): `src/features/webhooks/api.ts`

### Client interaction layer

- [HTTP client](https://github.com/phamtanhoang/jira-fe/blob/main/src/lib/api/client.ts): `src/lib/api/client.ts`
- [Query state](https://github.com/phamtanhoang/jira-fe/blob/main/src/components/providers/query-provider/index.tsx): `src/components/providers/query-provider/index.tsx`

### Other components

- **User**
- **Jira Clone backend**

## Connections

- User → Auth pages: signs in
- Auth pages → Authentication: uses auth
- Authentication → HTTP client: sends requests
- HTTP client → Jira Clone backend: HTTP requests
- User → Route protection: opens routes
- Route protection → Dashboard: permits access
- User → Dashboard: views work
- User → Workspace views: selects workspace
- Workspace views → Project board: opens project
- Project board → Issues and boards: manages issues
- Project settings → Issues and boards: configures columns
- Project settings → Custom fields: configures fields
- Project settings → Issue templates: manages templates
- Project settings → Recurring issues: sets recurrence
- Issue sharing → HTTP client: sends requests
- Notifications → HTTP client: sends requests
- Profile and security → Authentication: updates account
- Profile and security → Notifications: sets preferences
- Workspace views → Workspace membership: manages membership
- Admin console → Admin operations: loads admin data
- Admin console → User administration: shows user health
- Admin console → Webhook management: manages webhooks
- Issues and boards → HTTP client: sends requests
- Custom fields → HTTP client: sends requests
- Issue templates → HTTP client: sends requests
- Recurring issues → HTTP client: sends requests
- Workspace membership → HTTP client: sends requests
- Admin operations → HTTP client: sends requests
- User administration → HTTP client: sends requests
- Webhook management → HTTP client: sends requests
- Query state → HTTP client: shares server state