mirror of
https://github.com/supabase/supabase.git
synced 2026-05-08 01:40:13 -04:00
Danny White
b23c6a7fed
## What kind of change does this PR introduce? Chore that references DEPR-394. ## What is the current behavior? Key/value editors for headers are implemented separately in multiple places. ## What is the new behavior? DEPR-394 is consolidating repeated RHF field-array UIs across Studio and the design system. - adds a shared `KeyValueFieldArray` component in `ui-patterns` - adds a shared `httpHeaderAddActions` helper for preset header rows - migrates the key/value header editors in: - Platform Webhooks - Cron Jobs HTTP headers - Database Webhooks HTTP headers - documents the key/value pattern in the design system with: - a dedicated fragment page - updated forms guidance - updated form pattern demos | Preview | | --- | | <img width="1102" height="420" alt="CleanShot 2026-03-23 at 12 22 18@2x" src="https://github.com/user-attachments/assets/f8d23ff9-7063-462f-8074-b400561f77e9" /> | ## Additional context This is PR 1 of a 3-PR stack for DEPR-394.
31 lines
1.0 KiB
TypeScript
31 lines
1.0 KiB
TypeScript
import type { KeyValueFieldArrayAction } from 'ui-patterns/form/KeyValueFieldArray/KeyValueFieldArray'
|
|
|
|
interface BuildEdgeFunctionHeaderAddActionsParams<TRow> {
|
|
apiKey: string
|
|
includeApiKeyHeader?: boolean
|
|
createRow: (name: string, value: string) => TRow
|
|
}
|
|
|
|
export const buildEdgeFunctionHeaderAddActions = <TRow>({
|
|
apiKey,
|
|
includeApiKeyHeader = false,
|
|
createRow,
|
|
}: BuildEdgeFunctionHeaderAddActionsParams<TRow>): KeyValueFieldArrayAction<TRow>[] => [
|
|
{
|
|
key: 'add-auth-header',
|
|
label: 'Add auth header with secret key',
|
|
description: 'Required if your edge function enforces JWT verification',
|
|
createRows: () => [
|
|
createRow('Authorization', `Bearer ${apiKey}`),
|
|
...(includeApiKeyHeader ? [createRow('apikey', apiKey)] : []),
|
|
],
|
|
},
|
|
{
|
|
key: 'add-source-header',
|
|
label: 'Add custom source header',
|
|
description: 'Useful to verify that the edge function was triggered from this webhook',
|
|
createRows: () => createRow('x-supabase-webhook-source', '[Use a secret value]'),
|
|
separatorAbove: true,
|
|
},
|
|
]
|