mirror of
https://github.com/supabase/supabase.git
synced 2026-10-10 03:45:06 +03:00
Gildas Garcia
243e079a2c
## Problem The `_Shadcn_` suffix isn't needed anymore on `Command` components ## Solution - Remove the `_Shadcn_` suffix - Simplify UI package exports - Apply prettier <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Refactor** * Simplified command component imports and exports across the UI library by removing internal naming aliases and adopting direct component references. Updated the public UI package barrel export to use wildcard re-exports for cleaner API surface. <!-- review_stack_entry_start --> [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/46153?utm_source=github_walkthrough&utm_medium=github&utm_campaign=change_stack) <!-- review_stack_entry_end --> <!-- end of auto-generated comment: release notes by coderabbit.ai -->
88 lines
2.5 KiB
TypeScript
88 lines
2.5 KiB
TypeScript
import { ChevronDown, Terminal } from 'lucide-react'
|
|
import { useState } from 'react'
|
|
import {
|
|
Button,
|
|
Command,
|
|
CommandGroup,
|
|
CommandItem,
|
|
CommandList,
|
|
Popover,
|
|
PopoverContent,
|
|
PopoverTrigger,
|
|
} from 'ui'
|
|
|
|
import { BASE_PATH } from '@/lib/constants'
|
|
import { useAppStateSnapshot } from '@/state/app-state'
|
|
|
|
interface LanguageSelectorProps {
|
|
/**
|
|
* Only show icons to represent the language
|
|
*/
|
|
simplifiedVersion?: boolean
|
|
}
|
|
|
|
const LanguageSelector = ({ simplifiedVersion = false }: LanguageSelectorProps) => {
|
|
const snap = useAppStateSnapshot()
|
|
const [showLanguage, setShowLanguage] = useState(false)
|
|
|
|
const updateLanguage = (value: 'js' | 'bash') => {
|
|
snap.setDocsLanguage(value)
|
|
setShowLanguage(false)
|
|
}
|
|
|
|
return (
|
|
<div className="flex items-center gap-x-2">
|
|
<Popover modal={false} open={showLanguage} onOpenChange={setShowLanguage}>
|
|
<PopoverTrigger asChild>
|
|
<Button
|
|
type="default"
|
|
className={simplifiedVersion ? 'px-1' : ''}
|
|
icon={
|
|
simplifiedVersion ? (
|
|
snap.docsLanguage === 'js' ? (
|
|
<img
|
|
src={`${BASE_PATH}/img/libraries/javascript-icon.svg`}
|
|
alt={`javascript logo`}
|
|
width="14"
|
|
/>
|
|
) : (
|
|
<Terminal size={14} strokeWidth={2.5} />
|
|
)
|
|
) : undefined
|
|
}
|
|
iconRight={!simplifiedVersion && <ChevronDown size={14} strokeWidth={2} />}
|
|
>
|
|
{!simplifiedVersion
|
|
? `Language: ${snap.docsLanguage === 'js' ? 'Javascript' : 'Bash'}`
|
|
: undefined}
|
|
</Button>
|
|
</PopoverTrigger>
|
|
<PopoverContent className="p-0 w-24" side="bottom" align="end">
|
|
<Command>
|
|
<CommandList>
|
|
<CommandGroup>
|
|
<CommandItem
|
|
className="cursor-pointer"
|
|
onSelect={() => updateLanguage('js')}
|
|
onClick={() => updateLanguage('js')}
|
|
>
|
|
<p>Javascript</p>
|
|
</CommandItem>
|
|
<CommandItem
|
|
className="cursor-pointer"
|
|
onSelect={() => updateLanguage('bash')}
|
|
onClick={() => updateLanguage('bash')}
|
|
>
|
|
<p>Bash</p>
|
|
</CommandItem>
|
|
</CommandGroup>
|
|
</CommandList>
|
|
</Command>
|
|
</PopoverContent>
|
|
</Popover>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default LanguageSelector
|