mirror of
https://github.com/supabase/supabase.git
synced 2026-10-16 14:49:10 +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). ```
27 lines
865 B
TypeScript
27 lines
865 B
TypeScript
import { AnalyticsBucket, BigQuery, ClickHouse, Database } from 'icons'
|
|
import { SnowflakeIcon } from 'lucide-react'
|
|
import type { ComponentType, SVGProps } from 'react'
|
|
|
|
import type { DestinationType } from './DestinationPanel/DestinationPanel.types'
|
|
|
|
type DestinationIconComponent = ComponentType<SVGProps<SVGSVGElement> & { size?: string | number }>
|
|
|
|
const destinationIconByType: Record<DestinationType, DestinationIconComponent> = {
|
|
BigQuery,
|
|
'Analytics Bucket': AnalyticsBucket,
|
|
DuckLake: Database,
|
|
Snowflake: SnowflakeIcon,
|
|
ClickHouse,
|
|
}
|
|
|
|
interface DestinationIconProps extends Omit<SVGProps<SVGSVGElement>, 'strokeWidth'> {
|
|
type: DestinationType
|
|
size?: string | number
|
|
}
|
|
|
|
export const DestinationIcon = ({ type, ...props }: DestinationIconProps) => {
|
|
const Icon = destinationIconByType[type]
|
|
|
|
return <Icon {...props} strokeWidth={1.5} />
|
|
}
|