mirror of
https://github.com/supabase/supabase.git
synced 2026-10-15 06:09:08 +03:00
Stojan DimitrovskiandIvan Vasilov
4945ba1861
* original files from previous PR * get rid of router in jwt-secrets to make it show up * rename jwt-secrets page to jwt-signing-keys * add jwt-signing-keys query * add legacy jwt signing keys query * wire-up JwtSecretKeysTable with queries * add jwt signing keys page to settings menu * deduplicate labels, descriptions, etc * add create, update jwt-signing-key mutations * update types * remove unused components, to be refactored later * make everything into a mostly working state * legacy migration added * put jwt keys page like api keys * fully migrate legacy jwt secret page * fix prettier * fix typecheck ts-expect-error * rm unneeded file * Fix compile errors. * Rename the files and move them to the same folder. * Merge the two constant files. * Fix the imports. * Fix a bug in the API keys page when opening it in a new tab. * Change the page to be at /signing-keys * Fix some minor types. * Break apart some of the components in the signing keys UI. * Use a feature banner for the initial action. * Make a create key dialog and move functionality there. * Fix some cosmetic issues. * Minor cosmetic fixes. * Remove extra keys in RQ cache. * Add a missing link * Add a banner when the feature flag is false. * Minor type fix. * more tiny type fix * fix error on create standby key * add alert to prevent revoking legacy jwt secret without disabling legacy api keys first --------- Co-authored-by: Ivan Vasilov <vasilov.ivan@gmail.com>
62 lines
1.8 KiB
TypeScript
62 lines
1.8 KiB
TypeScript
import React from 'react'
|
|
import {
|
|
HoverCard,
|
|
HoverCardContent,
|
|
HoverCardTrigger,
|
|
} from 'ui/src/components/shadcn/ui/hover-card'
|
|
import { Badge } from 'ui/src/components/shadcn/ui/badge'
|
|
import { ExternalLink } from 'lucide-react'
|
|
|
|
interface Link {
|
|
url: string
|
|
label: string
|
|
}
|
|
|
|
interface InfoPillProps {
|
|
label: string
|
|
icon: React.ReactNode
|
|
title: string
|
|
description: string
|
|
links?: Link[]
|
|
}
|
|
|
|
export const InfoPill: React.FC<InfoPillProps> = ({ label, icon, title, description, links }) => {
|
|
return (
|
|
<HoverCard closeDelay={50} openDelay={300}>
|
|
<HoverCardTrigger>
|
|
<Badge className="gap-2 py-0 hover:border-foreground">
|
|
{icon} {label}
|
|
</Badge>
|
|
</HoverCardTrigger>
|
|
<HoverCardContent className="w-80 flex items-start gap-3" side="right" align="center">
|
|
<div className="rounded-full bg-surface-300 p-2 flex-shrink-0">
|
|
{React.cloneElement(icon as React.ReactElement, {
|
|
className: 'w-5 h-5',
|
|
strokeWidth: 1.5,
|
|
})}
|
|
</div>
|
|
<div className="flex-1">
|
|
<h4 className="text-sm font-semibold truncate">{title}</h4>
|
|
<p className="text-xs text-foreground-light">{description}</p>
|
|
{links && links.length > 0 && (
|
|
<div className="space-y-1 mt-2">
|
|
{links.map((link, index) => (
|
|
<a
|
|
key={index}
|
|
href={link.url}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
className="text-xs text-brand hover:text-brand-600 flex items-center"
|
|
>
|
|
<ExternalLink className="w-3 h-3 mr-1 flex-shrink-0" />
|
|
<span className="truncate">{link.label}</span>
|
|
</a>
|
|
))}
|
|
</div>
|
|
)}
|
|
</div>
|
|
</HoverCardContent>
|
|
</HoverCard>
|
|
)
|
|
}
|