Projects List
The Projects List page is the operational entry point for project management. It supports search, status filtering, tag filtering, and responsive table/card layouts for desktop and mobile.
Accessing the Page
Section titled “Accessing the Page”- Route:
/projects/projects - Menu Path: Projects → Projects
The Projects sidebar item has a + button. Clicking it navigates to /projects/projects#new-project and opens the Create Project dialog directly.
What you can do here
Section titled “What you can do here”- Search projects by code or name.
- Filter by project status and tags.
- Open a project detail page (or slide-over preview) by clicking any row/card.
- Open a project in a new browser tab with Ctrl+click / Cmd+click.
- Create a new project (if you have write permissions).
- Edit or delete non-terminal projects from row actions (if authorized).
- Load more records without leaving the page.
Filters
Section titled “Filters”| Filter | Type | Description |
|---|---|---|
| Search | Free text | Matches project code/name (debounced search). |
| Status | Single-select dropdown | all, draft, active, on-hold, completed, archived, cancelled. |
| Tags | Tag input | Tag chips input that filters projects matching all selected tags. |
The page shows an Active Filters Summary with quick clear actions for each filter and a clear-all option.
List Columns
Section titled “List Columns”| Column | Default Visible | Sortable | Description |
|---|---|---|---|
| Code | Yes | Yes | Project code with a color dot indicator matching the project color |
| Name | Yes | Yes | Project name; one-line description shown below when available |
| Status | Yes | Yes | Status badge with icon |
| Owner | Yes | No | Owner display name |
| End Date | Yes | Yes | Planned end date |
| Tags | Yes | No | Tag chips assigned to the project |
| Actions | Yes | No | Edit/Delete context menu for non-terminal projects |
Default sort is Name ascending.
Project Color
Section titled “Project Color”Every project has a color. The API populates a default color (#3b82f6 blue) if none is set, so projects no longer appear without a color indicator in the list.
Sorting
Section titled “Sorting”Click any sortable column header to cycle through three states:
- First click — Ascending (A→Z, 0→9)
- Second click — Descending (Z→A, 9→0)
- Third click — Remove sort (return to default)
Only one column can be sorted at a time.
Pagination
Section titled “Pagination”The list uses a Load More pattern:
- Page size: 25 records per load
- Load More button appears at the bottom when more records are available
- Total count displays above the table
Mobile Layout
Section titled “Mobile Layout”On narrow viewports (below the lg breakpoint) the table switches to a card layout. Each card includes:
- Status badge and project code badge (with color dot)
- Project name and description (up to 2 lines)
- A colored left-border strip using the project color
- Owner, end date, and tag chips
Status Model and Action Rules
Section titled “Status Model and Action Rules”| Status | Meaning |
|---|---|
| Draft | Initial setup state |
| Active | In execution |
| On Hold | Temporarily paused |
| Completed | Finished (terminal) |
| Archived | Closed and archived (terminal) |
| Cancelled | Stopped/cancelled (terminal) |
Terminal statuses (completed, archived, cancelled) are read-only for edit/delete flows on this page.
Project Open Mode
Section titled “Project Open Mode”How a project opens when you click its row depends on a tenant-level setting:
| Setting value | Behavior |
|---|---|
| Page (default) | Navigates directly to the Project Detail page |
| Slide-over | A side panel opens with a project preview without leaving the list |
Ctrl+click / Cmd+click always opens the project in a new browser tab.
See Project Governance Settings to configure the open mode.
Actions
Section titled “Actions”Page Actions
Section titled “Page Actions”| Action | Permission | Description |
|---|---|---|
| Create New | canWriteProjects | Opens the Create Project dialog |
Row Actions
Section titled “Row Actions”| Action | Permission | Availability |
|---|---|---|
| Edit | canWriteProjects | Non-terminal projects only |
| Delete | canAdminProjects | Non-terminal projects only |
Click any row to open the Project Detail page (or slide-over, based on the open-mode setting).
Deleting a Project
Section titled “Deleting a Project”- Click the row actions menu (three-dot icon) on the project row
- Select Delete
- A confirmation dialog warns that the action is permanent
- Click Delete to confirm — the list reloads without the deleted project
Deletion is blocked for projects in terminal status (completed, archived, cancelled). To remove a terminal project, first contact your administrator.
Common Tasks
Section titled “Common Tasks”Create a project
- Open the Projects list from the sidebar.
- Click Create New (or the + button in the sidebar).
- Fill in the required fields and save.
Filter by status
- Open the Projects list.
- Select a status from the Status dropdown.
- The list updates immediately; use the active-filter chip to clear the filter.
Open a project
- Open the Projects list.
- Click any project row to open the Project Detail page (or slide-over).