From f7d42f36d0f0b8dd2b6d46bece83bc7c506b9c4b Mon Sep 17 00:00:00 2001 From: codecalm Date: Sat, 12 Sep 2026 19:35:20 +0200 Subject: [PATCH] feat: rework deployment-failed and project-settings pages on shared components - shared ProjectHeader with breadcrumb, badge and section tabs - Datagrid, ListGroup and FormGroup instead of hand-rolled markup; menu entries and changeset --- .changeset/deployment-project-pages.md | 5 + preview/pages/deployment-failed.astro | 420 +++++++--------- preview/pages/project-settings.astro | 511 ++++++++++---------- shared/components/parts/ProjectHeader.astro | 63 +++ shared/data/menu.json | 10 + 5 files changed, 499 insertions(+), 510 deletions(-) create mode 100644 .changeset/deployment-project-pages.md create mode 100644 shared/components/parts/ProjectHeader.astro diff --git a/.changeset/deployment-project-pages.md b/.changeset/deployment-project-pages.md new file mode 100644 index 000000000..11da68fd7 --- /dev/null +++ b/.changeset/deployment-project-pages.md @@ -0,0 +1,5 @@ +--- +"@tabler/preview": minor +--- + +Added the deployment failed and project settings preview pages with a shared `ProjectHeader` component. diff --git a/preview/pages/deployment-failed.astro b/preview/pages/deployment-failed.astro index b58e048b7..e6c02771a 100644 --- a/preview/pages/deployment-failed.astro +++ b/preview/pages/deployment-failed.astro @@ -1,269 +1,191 @@ --- -import DefaultLayout from '@shared/layouts/DefaultLayout.astro'; -import Breadcrumb from '@shared/components/ui/Breadcrumb.astro'; -import Avatar from '@shared/components/ui/Avatar.astro'; -import Badge from '@shared/components/ui/Badge.astro'; -import Button from '@shared/components/Button.astro'; -import Alert from '@shared/components/Alert.astro'; -import Icon from '@shared/components/Icon.astro'; -import StatusDot from '@shared/components/ui/StatusDot.astro'; +import DefaultLayout from '@shared/layouts/DefaultLayout.astro' +import ProjectHeader from '@shared/components/parts/ProjectHeader.astro' +import Alert from '@ui/Alert.astro' +import Avatar from '@ui/Avatar.astro' +import Badge from '@ui/Badge.astro' +import Button from '@ui/Button.astro' +import ButtonList from '@ui/ButtonList.astro' +import Card from '@ui/Card.astro' +import CardActions from '@ui/CardActions.astro' +import CardBody from '@ui/CardBody.astro' +import CardFooter from '@ui/CardFooter.astro' +import CardHeader from '@ui/CardHeader.astro' +import CardTitle from '@ui/CardTitle.astro' +import Datagrid from '@ui/Datagrid.astro' +import DatagridItem from '@ui/DatagridItem.astro' +import Icon from '@ui/Icon.astro' +import StatusDot from '@ui/StatusDot.astro' -const navItems = [ - { label: 'Overview' }, - { label: 'Deployments', href: './deployment-failed.html', active: true }, - { label: 'Analytics' }, - { label: 'Logs' }, - { label: 'Settings', href: './project-settings.html' }, -]; +type BuildStep = { + status: 'success' | 'danger' | 'secondary' + icon?: string + name: string + time: string + detail: string + error?: string +} -const buildSteps = [ - { - status: 'success', - icon: 'check', - name: 'Clone', - time: '2s', - detail: 'Fetched feat/redis-limiter at 2e77b09', - }, - { - status: 'success', - icon: 'check', - name: 'Install', - time: '38s', - detail: 'pnpm install — 412 packages', - }, - { - status: 'success', - icon: 'check', - name: 'Build', - time: '24s', - detail: 'pnpm build completed', - }, - { - status: 'danger', - icon: 'x', - name: 'Compile', - time: '8s', - detail: 'TypeScript exited with code 2', - error: `src/lib/rate-limit.ts:47:12 — error TS2345: +const buildSteps: BuildStep[] = [ + { status: 'success', icon: 'check', name: 'Clone', time: '2s', detail: 'Fetched feat/redis-limiter at 2e77b09' }, + { status: 'success', icon: 'check', name: 'Install', time: '38s', detail: 'pnpm install, 412 packages' }, + { status: 'success', icon: 'check', name: 'Build', time: '24s', detail: 'pnpm build completed' }, + { + status: 'danger', + icon: 'x', + name: 'Compile', + time: '8s', + detail: 'TypeScript exited with code 2', + error: `src/lib/rate-limit.ts:47:12 - error TS2345: Argument of type 'RedisClient' is not assignable to parameter of type 'RateLimiterStore'. Property 'incr' is missing in type 'RedisClient'. -src/lib/rate-limit.ts:61:5 — error TS2322: +src/lib/rate-limit.ts:61:5 - error TS2322: Type 'Promise' is not assignable to type 'Promise'. Found 2 errors in 1 file.`, - }, - { - status: 'secondary', - name: 'Deploy', - time: '—', - detail: 'Skipped', - muted: true, - }, -]; - -const failureSummary = [ - { label: 'Exit code', value: '2' }, - { label: 'Failed step', value: 'Compile' }, - { label: 'Errors', value: '2 TypeScript errors' }, - { label: 'File', value: 'src/lib/rate-limit.ts' }, - { label: 'Duration', value: '1m 12s' }, - { label: 'Region', value: 'fra1' }, -]; + }, + { status: 'secondary', name: 'Deploy', time: '-', detail: 'Skipped' }, +] const nextSteps = [ - { - title: 'Fix type errors in rate-limit.ts', - sub: 'Align RedisClient with RateLimiterStore', - }, - { - title: 'Push to feat/redis-limiter', - sub: 'A new preview deploy starts automatically', - }, - { - title: 'Or retry this deployment', - sub: 'Re-runs the same commit without a new push', - }, -]; + { title: 'Fix type errors in rate-limit.ts', description: 'Align RedisClient with RateLimiterStore' }, + { title: 'Push to feat/redis-limiter', description: 'A new preview deploy starts automatically' }, + { title: 'Or retry this deployment', description: 'Re-runs the same commit without a new push' }, +] --- - - + + + +