Bug/816 long names #870
Bug/816 long names #870
Conversation
There was a problem hiding this comment.
Pull Request Overview
Addresses bug/816 focused on improving handling of long names and UX/navigation, while introducing global Snapshots and Deployments views and unifying timestamp parsing.
- Adds global Snapshots and Deployments routes/pages and top-level project tab navigation
- Centralizes timestamp parsing via prepareBackendTimestamp and refactors components to use it
- Refactors list tables (Deployments/Snapshots) to accept column definitions and introduces shared column factories; updates destructive action dropdowns to use a unified Delete dialog; adds a header Back button
Reviewed Changes
Copilot reviewed 54 out of 59 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| src/router/routes.tsx | Adds overview routes for snapshots and deployments under projects. |
| src/router/Router.tsx | Registers new lazy-loaded routes for global snapshots/deployments pages. |
| src/lib/timeline/mapping.ts | Uses prepareBackendTimestamp for robust date parsing in timeline. |
| src/lib/dates.ts | Introduces prepareBackendTimestamp to normalize backend timestamps. |
| src/lib/bulk-delete.tsx | Improves bulk delete error toasts to show specific failures per item. |
| src/layouts/project-tabs/tabs.tsx | Adds Snapshots and Deployments tabs and navigation handlers. |
| src/layouts/AuthenticatedLayout/back-button.tsx | Adds a back button to the authenticated header. |
| src/layouts/AuthenticatedLayout/AuthenticatedHeader.tsx | Integrates BackButton and reorders breadcrumb imports. |
| src/components/service-connectors/expiry.tsx | Uses prepareBackendTimestamp for expiry calculations. |
| src/components/pipeline-snapshots/table-actions.tsx | Renames action component to PipelineSnapshotActions. |
| src/components/pipeline-snapshots/list/use-queryparams.ts | Renames hook to useSnapshotListQueryParams. |
| src/components/pipeline-snapshots/list/table.tsx | Table now accepts external columns; pagination and selection unchanged. |
| src/components/pipeline-snapshots/list/column-definitions.tsx | New shared snapshot column factories used across pages. |
| src/components/logs/log-line.tsx | Normalizes timestamp parsing and switches display formatting. |
| src/components/deployments/list/use-deployment-queryparams.ts | Renames hook to useDeploymentQueryParams. |
| src/components/deployments/list/table.tsx | Table now accepts external columns. |
| src/components/deployments/list/column-definitions.tsx | New shared deployment column factories. |
| src/components/breadcrumbs/library.ts | Enables breadcrumb links for Deployments/Snapshots. |
| src/components/DisplayDate.tsx | Uses prepareBackendTimestamp for consistent date handling. |
| src/components/DeleteAlertDialog.tsx | Allows disabling Delete during pending state. |
| src/components/dialog/DialogItem.tsx | Removes obsolete dialog helper. |
| src/components/AlertDialogDropdownItem.tsx | Removes obsolete alert dialog menu item helper. |
| src/app/snapshots/** | Adds global snapshots page and columns. |
| src/app/pipelines/[pipelineId]/snapshots/** | Adopts shared list components and columns. |
| src/app/pipelines/[pipelineId]/runs/columns.tsx | Adjusts run name cell layout for long names. |
| src/app/pipelines/_components/columns.tsx | Improves layout and widths to handle long pipeline names. |
| src/app/pipelines/[pipelineId]/deployments/** | Adopts shared deployment list components/columns. |
| src/app/deployments/** | Adds global deployments page and columns. |
| src/app/settings/** | Unifies delete/edit dropdowns to use shared DeleteAlertContent with proper dialogs; uses prepareBackendTimestamp for age checks. |
| package.json | Updates vite version. |
| CLAUDE.md, AGENTS.md, .coderabbit.yaml | Adds tooling guidance and repository agent configs (docs only). |
Files not reviewed (1)
- pnpm-lock.yaml: Language not supported
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
| export function prepareBackendTimestamp(dateString: string | number) { | ||
| if (typeof dateString === "number") { | ||
| return new Date(dateString); | ||
| } | ||
| if (!dateString.endsWith("Z")) { | ||
| return new Date(dateString + "Z"); | ||
| } | ||
| return new Date(dateString); | ||
| } |
There was a problem hiding this comment.
Appending 'Z' whenever the string doesn't end with 'Z' breaks timestamps that already include an explicit timezone offset (e.g. '+01:00'), producing invalid strings like '...+01:00Z'. Only append 'Z' when the input has no timezone information.
Copilot uses AI. Check for mistakes.
| return { | ||
| id: "latest-run", | ||
| header: "Latest Run", | ||
| accessorFn: (row) => row.resources?.latest_triggered_run_id, |
There was a problem hiding this comment.
The accessor reads latest_triggered_run_id while the cell reads latest_run_id. This mismatch will cause sorting/filtering to operate on a different field than what is displayed.
| accessorFn: (row) => row.resources?.latest_triggered_run_id, | |
| accessorFn: (row) => row.resources?.latest_run_id, |
Copilot uses AI. Check for mistakes.
| return { | ||
| id: "latest-run-author", | ||
| header: "Latest Run Author", | ||
| accessorFn: (row) => row.resources?.latest_run_author, |
There was a problem hiding this comment.
Accessor returns latest_run_author while the cell renders resources.user. This inconsistency will break correct sorting/filtering on this column.
| accessorFn: (row) => row.resources?.latest_run_author, | |
| accessorFn: (row) => row.resources?.user, |
Copilot uses AI. Check for mistakes.
| const date = prepareBackendTimestamp(timestamp); | ||
| return date.toLocaleString("sv-SE", { | ||
| year: "numeric", | ||
| month: "2-digit", | ||
| day: "2-digit", | ||
| hour: "2-digit", | ||
| minute: "2-digit", | ||
| second: "2-digit", | ||
| hour12: false | ||
| }); |
There was a problem hiding this comment.
[nitpick] Log timestamps are formatted with a hard-coded 'sv-SE' locale, while other components use DisplayDate or default locale settings. For consistency across the app, consider using the shared DisplayDate component or centralize the format in a single utility.
Copilot uses AI. Check for mistakes.
There was a problem hiding this comment.
Nice 👍 The truncate works better now
There still seems to be something off. For smaller sizes the columns (here the actions) overflow with other columns.
I wonder if we should use width, with a min-width or so, and apply this to all tables.
Another option I would see is using a fixed table layout
Wdyt? It may also be needed for other tables I assume
Co-authored-by: Copilot <[email protected]>
2 participants
No description provided.