CodeSandBox/monaco-editor-lsp-next
2
0
Fork 0
mirror of https://github.com/cfngc4594/monaco-editor-lsp-next.git synced 2025-05-18 15:26:36 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat(language-selector): integrate icons for languages in language selector

Browse Source
This commit is contained in:
cfngc4594 2025-03-16 13:33:16 +08:00
parent 02f4fc1c3f
commit b0e00e7d69
1 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/features/playground/workspace/editor/components/language-selector.tsx
View File

@ -13,9 +13,11 @@ import { Skeleton } from "@/components/ui/skeleton";
import LanguageServerConfig from "@/config/language-server";
import { EditorLanguageConfig } from "@/config/editor-language";
import { useCodeEditorStore } from "@/store/useCodeEditorStore";
import { EditorLanguageIcons } from "@/config/editor-language-icons";
export default function LanguageSelector() {
const { hydrated, language, setLanguage, setPath, setLspConfig } = useCodeEditorStore();
const { hydrated, language, setLanguage, setPath, setLspConfig } =
useCodeEditorStore();
if (!hydrated) {
return <Skeleton className="h-6 w-16 rounded-2xl" />;
@ -33,14 +35,17 @@ export default function LanguageSelector() {
<SelectValue placeholder="Select language" />
</SelectTrigger>
<SelectContent className="[&_*[role=option]>span>svg]:shrink-0 [&_*[role=option]>span>svg]:text-muted-foreground/80 [&_*[role=option]>span]:end-2 [&_*[role=option]>span]:start-auto [&_*[role=option]>span]:flex [&_*[role=option]>span]:items-center [&_*[role=option]>span]:gap-2 [&_*[role=option]]:pe-8 [&_*[role=option]]:ps-2">
{Object.values(EditorLanguageConfig).map((langConfig) => (
<SelectItem key={langConfig.id} value={langConfig.id}>
<langConfig.icon size={16} aria-hidden="true" />
<span className="truncate text-sm font-semibold mr-2">
{langConfig.label}
</span>
</SelectItem>
))}
{Object.values(EditorLanguageConfig).map((langConfig) => {
const Icon = EditorLanguageIcons[langConfig.id];
return (
<SelectItem key={langConfig.id} value={langConfig.id}>
<Icon size={16} aria-hidden="true" />
<span className="truncate text-sm font-semibold mr-2">
{langConfig.label}
</span>
</SelectItem>
);
})}
</SelectContent>
</Select>
);