mirror of
https://github.com/supabase/supabase.git
synced 2026-10-17 07:09:07 +03:00
Joshen Lim
09a1f431bc
## Context This is largely just a mechanical change here: Opting to use lucide icons with the `Icon` suffix across all icon imports within `studio` - so that it’s clearer which components are icons + reduces the possibility of name collision with our own components - e.g <User /> vs <UserIcon /> Also added a eslint rule for this: <img width="1069" height="167" alt="image" src="https://github.com/user-attachments/assets/7f36f443-5ca2-4bf6-8d22-86e774513bfc" /> And updated `AGENTS.md` as such: ``` Icons come from `lucide-react`, always imported with the `Icon` suffix (`import { CheckIcon, Trash2Icon } from 'lucide-react'`) — never the bare names (`Check`) or `Check as CheckIcon` aliases (lint-enforced). ```
38 lines
1.2 KiB
TypeScript
38 lines
1.2 KiB
TypeScript
import { CheckIcon } from 'lucide-react'
|
|
import { Badge, cn } from 'ui'
|
|
|
|
import PartnerIcon from '@/components/ui/PartnerIcon'
|
|
import { getManagedByFromOrganizationPartner } from '@/data/organizations/managed-by-utils'
|
|
|
|
export interface ProjectRowLinkProps {
|
|
project: {
|
|
ref: string
|
|
name: string
|
|
status?: string
|
|
integration_source?: string | null
|
|
}
|
|
selectedRef: string | undefined
|
|
}
|
|
|
|
export function ProjectRowLink({ project, selectedRef }: ProjectRowLinkProps) {
|
|
const isSelected = project.ref === selectedRef
|
|
const isPaused = project.status === 'INACTIVE'
|
|
const managedBy = getManagedByFromOrganizationPartner(undefined, project.integration_source)
|
|
|
|
return (
|
|
<div className="w-full flex items-center justify-between p-0.5 md:p-0 text-sm md:text-xs">
|
|
<span
|
|
className={cn(
|
|
'flex items-center gap-2 min-w-0',
|
|
isSelected ? 'md:max-w-60' : 'md:max-w-64'
|
|
)}
|
|
>
|
|
<span className="truncate">{project.name}</span>
|
|
{isPaused && <Badge className="ml-2">Paused</Badge>}
|
|
<PartnerIcon organization={{ managed_by: managedBy }} />
|
|
</span>
|
|
{isSelected && <CheckIcon size={16} />}
|
|
</div>
|
|
)
|
|
}
|