mirror of
https://github.com/supabase/supabase.git
synced 2026-10-13 21:29:08 +03:00
2ab9915d8c
<img width="1670" height="1030" alt="image" src="https://github.com/user-attachments/assets/fa2e4f9a-2287-402c-89cc-7f05d04f57e5" /> - Connect button becomes primary on new projects - Switch from HoverCard to a "Copy" button on project url - Adds "API Keys" item to the "Get Connected" section on project home --------- Co-authored-by: Copilot <198982749+Copilot@users.noreply.github.com> Co-authored-by: SaxonF <1072756+SaxonF@users.noreply.github.com>
41 lines
1.1 KiB
TypeScript
41 lines
1.1 KiB
TypeScript
import { BASE_PATH } from 'lib/constants'
|
|
import { useTheme } from 'next-themes'
|
|
import Image from 'next/image'
|
|
|
|
interface ConnectionIconProps {
|
|
icon: string
|
|
iconFolder?: string
|
|
supportsDarkMode?: boolean
|
|
size?: number
|
|
className?: string
|
|
}
|
|
|
|
export const ConnectionIcon = ({
|
|
icon,
|
|
iconFolder,
|
|
supportsDarkMode,
|
|
size = 14,
|
|
className,
|
|
}: ConnectionIconProps) => {
|
|
const { resolvedTheme } = useTheme()
|
|
|
|
const imageFolder =
|
|
iconFolder || (['ionic-angular'].includes(icon) ? 'icons/frameworks' : 'libraries')
|
|
|
|
const imageExtension = imageFolder === 'icons/frameworks' ? '' : '-icon'
|
|
|
|
const shouldUseDarkMode =
|
|
supportsDarkMode ||
|
|
['expo', 'nextjs', 'prisma', 'drizzle', 'astro', 'remix', 'refine'].includes(icon.toLowerCase())
|
|
|
|
const iconImgSrc = icon.startsWith('http')
|
|
? icon
|
|
: `${BASE_PATH}/img/${imageFolder}/${icon.toLowerCase()}${
|
|
shouldUseDarkMode && resolvedTheme?.includes('dark') ? '-dark' : ''
|
|
}${imageExtension}.svg`
|
|
|
|
return (
|
|
<Image className={className} src={iconImgSrc} alt={`${icon} logo`} width={size} height={size} />
|
|
)
|
|
}
|