mirror of
https://github.com/supabase/supabase.git
synced 2026-10-06 09:55:06 +03:00
Gildas Garcia
cabe14e5ca
## Problem Now that we migrated all usages of the deprecated `Tabs` component, we don't need the `_Shadcn_` suffix anymore. ## Solution Remove `_Shadcn_` suffix from `ui` tabs components. That's all this PR does, no visual nor functional changes <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Standardized tab components across the app so pages and dialogs now use the same consistent tab UI. * Improved tab-based views in design, docs, studio, learn, and website experiences for a more uniform interface. * **Chores** * Updated shared UI exports to expose tab components directly, simplifying future usage across the product. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
56 lines
1.7 KiB
TypeScript
56 lines
1.7 KiB
TypeScript
import type { LucideIcon } from 'lucide-react'
|
|
import { cn, TabsTrigger } from 'ui'
|
|
|
|
export interface ProjectBranchSelectorSheetTabTriggerProps {
|
|
value: 'organization' | 'project' | 'branch'
|
|
label: string
|
|
icon: LucideIcon
|
|
isMainBranch?: boolean
|
|
isLast: boolean
|
|
}
|
|
|
|
export function ProjectBranchSelectorSheetTabTrigger({
|
|
value,
|
|
label,
|
|
icon: Icon,
|
|
isMainBranch = false,
|
|
isLast,
|
|
}: ProjectBranchSelectorSheetTabTriggerProps) {
|
|
const isBranch = value === 'branch'
|
|
const isProductionBranch = isBranch && isMainBranch
|
|
|
|
return (
|
|
<TabsTrigger
|
|
value={value}
|
|
className={cn(
|
|
'group relative text-xs flex flex-col items-center gap-1.5 px-4 py-3 data-[state=active]:bg-surface-200 data-[state=active]:border-foreground-light border-b duration-0',
|
|
isProductionBranch &&
|
|
'text-warning data-[state=active]:text-warning hover:text-warning hover:opacity-70'
|
|
)}
|
|
>
|
|
<Icon className="shrink-0" size={16} strokeWidth={1.5} />
|
|
<span className="truncate max-w-full text-xs leading-tight" title={label}>
|
|
{label}
|
|
</span>
|
|
|
|
{!isLast && (
|
|
<svg
|
|
aria-hidden="true"
|
|
width="100%"
|
|
height="100%"
|
|
viewBox="0 0 6 63"
|
|
fill="none"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
className="absolute duration-0 bottom-0 top-0 -right-2 w-3 h-full z-10"
|
|
>
|
|
<path
|
|
d="M5.49365 31L0.493652 0V62L5.49365 31Z"
|
|
className="fill-[var(--background-dash-sidebar)] group-data-[state=active]:fill-[var(--background-surface-200)]"
|
|
/>
|
|
<path d="M0.493652 0L5.49365 31L0.493652 62" stroke="var(--border-default)" />
|
|
</svg>
|
|
)}
|
|
</TabsTrigger>
|
|
)
|
|
}
|