diff --git a/ui/src/pages/AppsTab/AppDeploymentPage/ConfigTabs/SensitiveKeysTab.tsx b/ui/src/pages/AppsTab/AppDeploymentPage/ConfigTabs/SensitiveKeysTab.tsx new file mode 100644 index 00000000..7faa7d03 --- /dev/null +++ b/ui/src/pages/AppsTab/AppDeploymentPage/ConfigTabs/SensitiveKeysTab.tsx @@ -0,0 +1,123 @@ +import { useState } from 'react'; +import { Badge, Button, Input, Tag } from '@cameleer/design-system'; +import { Shield, Info } from 'lucide-react'; +import { useSensitiveKeys } from '../../../../api/queries/admin/sensitive-keys'; +import type { SensitiveKeysFormState } from '../hooks/useDeploymentPageState'; +import skStyles from '../../../Admin/SensitiveKeysPage.module.css'; + +const AGENT_DEFAULTS = [ + 'Authorization', + 'Cookie', + 'Set-Cookie', + 'X-API-Key', + 'X-Auth-Token', + 'Proxy-Authorization', +]; + +interface Props { + value: SensitiveKeysFormState; + onChange: (next: SensitiveKeysFormState) => void; + disabled?: boolean; +} + +export function SensitiveKeysTab({ value, onChange, disabled }: Props) { + const [newKey, setNewKey] = useState(''); + const { data: globalKeysConfig } = useSensitiveKeys(); + const globalKeys = globalKeysConfig?.keys ?? []; + + function addKey() { + const v = newKey.trim(); + if (v && !value.sensitiveKeys.some((k) => k.toLowerCase() === v.toLowerCase())) { + onChange({ sensitiveKeys: [...value.sensitiveKeys, v] }); + setNewKey(''); + } + } + + function removeKey(index: number) { + onChange({ sensitiveKeys: value.sensitiveKeys.filter((_, i) => i !== index) }); + } + + return ( +