Massbug/judge4c
2
0
Fork 0
mirror of https://github.com/massbug/judge4c.git synced 2025-05-18 07:16:34 +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 LanguageServerConfig from "@/config/language-server";
import { EditorLanguageConfig } from "@/config/editor-language"; import { EditorLanguageConfig } from "@/config/editor-language";
import { useCodeEditorStore } from "@/store/useCodeEditorStore"; import { useCodeEditorStore } from "@/store/useCodeEditorStore";
import { EditorLanguageIcons } from "@/config/editor-language-icons";
export default function LanguageSelector() { export default function LanguageSelector() {
const { hydrated, language, setLanguage, setPath, setLspConfig } = useCodeEditorStore(); const { hydrated, language, setLanguage, setPath, setLspConfig } =
useCodeEditorStore();
if (!hydrated) { if (!hydrated) {
return <Skeleton className="h-6 w-16 rounded-2xl" />; return <Skeleton className="h-6 w-16 rounded-2xl" />;
@ -33,14 +35,17 @@ export default function LanguageSelector() {
<SelectValue placeholder="Select language" /> <SelectValue placeholder="Select language" />
</SelectTrigger> </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"> <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) => ( {Object.values(EditorLanguageConfig).map((langConfig) => {
<SelectItem key={langConfig.id} value={langConfig.id}> const Icon = EditorLanguageIcons[langConfig.id];
<langConfig.icon size={16} aria-hidden="true" /> return (
<span className="truncate text-sm font-semibold mr-2"> <SelectItem key={langConfig.id} value={langConfig.id}>
{langConfig.label} <Icon size={16} aria-hidden="true" />
</span> <span className="truncate text-sm font-semibold mr-2">
</SelectItem> {langConfig.label}
))} </span>
</SelectItem>
);
})}
</SelectContent> </SelectContent>
</Select> </Select>
); );