mirror of
https://github.com/supabase/supabase.git
synced 2026-09-06 18:11:51 +08:00
6c6ac567b1
## What
The Workers list page at `/project/[ref]/workers`, behind
`useFlag('workers')`. Reads `GET /v2/projects/{ref}/workers`.
- Sidebar and command-menu entries, both hidden when the flag is off
- Name search, state and access filters, pagination
- Read-only
Gating, in order: flag off redirects to the project home; a 404 from the
API means the project is outside the alpha allow-list ("not enabled for
this project"); a 403 means the caller lacks the permission
(`NoPermission`); anything else is an `AlertError`.
`parseWorker` in `data/workers/workers.utils.ts` is the only place the
API shape becomes the view model. It validates with zod, so a drifted
response fails the query instead of half-rendering a row.
## How to test
Only on the **Mockamaster** project in staging — it is the one project
in the alpha allow-list, and standing a worker up anywhere else is
involved right now.
1. Staging dashboard → Mockamaster → **Compute** in the sidebar
2. Expect the `dashboard-test` worker: state `Active`, runtime Deno,
private, US West, 2 GB · 1 vCPU · 1 inst
3. Open any other project's `/workers` URL → "Compute is not enabled for
this project"
4. Turn the `workers` flag off → the sidebar entry disappears and the
URL redirects to the project home
Closes FE-4188
32 lines
964 B
TypeScript
32 lines
964 B
TypeScript
import { cn } from 'ui'
|
|
|
|
import { getWorkerStateMeta } from './Workers.constants'
|
|
import type { Worker } from './Workers.types'
|
|
|
|
interface WorkerStatePillProps {
|
|
worker: Worker
|
|
className?: string
|
|
}
|
|
|
|
export const WorkerStatePill = ({ worker, className }: WorkerStatePillProps) => {
|
|
const meta = getWorkerStateMeta(worker)
|
|
const isPulsing = worker.buildState === 'building' || worker.isDeleting
|
|
|
|
return (
|
|
<span className={cn('inline-flex items-center gap-2', className)}>
|
|
<span className="relative flex h-2 w-2">
|
|
{isPulsing && (
|
|
<span
|
|
className={cn(
|
|
'absolute inline-flex h-full w-full animate-ping rounded-full opacity-75',
|
|
meta.dotClassName
|
|
)}
|
|
/>
|
|
)}
|
|
<span className={cn('relative inline-flex h-2 w-2 rounded-full', meta.dotClassName)} />
|
|
</span>
|
|
<span className={cn('text-sm', meta.textClassName)}>{meta.label}</span>
|
|
</span>
|
|
)
|
|
}
|