mirror of
https://github.com/supabase/supabase.git
synced 2026-10-08 10:55:06 +03:00
kemal.earth
8ffdcfc145
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Introduces UI for Scoped PAT's. ## Additional context WIP. Testing endpoints. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Scoped access tokens: create, view, delete, and manage granular resource/action permissions with custom expiry options and scoped creation flows. * New scoped token UI: modal/sheet creation flow, resource access selectors, permissions editor, and a scoped token list. * **UI Improvements** * Tabbed Classic vs Scoped tokens layout, refreshed tokens page, improved forms, search/filtering, and table tweaks. * **Bug Fixes / Maintenance** * New data hooks and utilities for scoped tokens and token handling. * **Removed** * Legacy account settings layout and legacy token banner. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
45 lines
1.5 KiB
TypeScript
45 lines
1.5 KiB
TypeScript
import { Card, CardContent, cn } from 'ui'
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableHead,
|
|
TableHeader,
|
|
TableHeadSort,
|
|
TableRow,
|
|
} from 'ui/src/components/shadcn/ui/table'
|
|
import { AccessTokenSort, AccessTokenSortColumn } from '../AccessToken.types'
|
|
|
|
const tableHeaderClass = 'text-left font-mono uppercase text-xs text-foreground-lighter py-2'
|
|
|
|
interface TableContainerProps {
|
|
children: React.ReactNode
|
|
sort: AccessTokenSort
|
|
onSortChange: (column: AccessTokenSortColumn) => void
|
|
}
|
|
|
|
export const TableContainer = ({ children, sort, onSortChange }: TableContainerProps) => (
|
|
<Card className="w-full overflow-hidden">
|
|
<CardContent className="p-0">
|
|
<Table className="p-5 table-auto">
|
|
<TableHeader>
|
|
<TableRow className="bg-200">
|
|
<TableHead className={tableHeaderClass}>Token</TableHead>
|
|
<TableHead className={tableHeaderClass}>
|
|
<TableHeadSort column="last_used_at" currentSort={sort} onSortChange={onSortChange}>
|
|
Last used
|
|
</TableHeadSort>
|
|
</TableHead>
|
|
<TableHead className={tableHeaderClass}>
|
|
<TableHeadSort column="expires_at" currentSort={sort} onSortChange={onSortChange}>
|
|
Expires
|
|
</TableHeadSort>
|
|
</TableHead>
|
|
<TableHead className={cn(tableHeaderClass, '!text-right')} />
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>{children}</TableBody>
|
|
</Table>
|
|
</CardContent>
|
|
</Card>
|
|
)
|