diff --git a/src/components/features/playground/workspace/editor/components/language-selector.tsx b/src/components/features/playground/workspace/editor/components/language-selector.tsx
index 45288d5..5b37525 100644
--- a/src/components/features/playground/workspace/editor/components/language-selector.tsx
+++ b/src/components/features/playground/workspace/editor/components/language-selector.tsx
@@ -7,41 +7,14 @@ import {
   SelectTrigger,
   SelectValue,
 } from "@/components/ui/select";
-import { getPath } from "@/lib/utils";
-import { Skeleton } from "@/components/ui/skeleton";
-import { useCodeEditorStore } from "@/store/useCodeEditorStore";
+import { useProblemEditor } from "@/hooks/use-problem-editor";
 import { EditorLanguageIcons } from "@/config/editor-language-icons";
-import { EditorLanguage, EditorLanguageConfig, LanguageServerConfig } from "@prisma/client";
 
-interface LanguageSelectorProps {
-  editorLanguageConfigs: EditorLanguageConfig[];
-  languageServerConfigs: LanguageServerConfig[];
-}
-
-export default function LanguageSelector({
-  editorLanguageConfigs,
-  languageServerConfigs,
-}: LanguageSelectorProps) {
-  const { hydrated, language, setLanguage, setPath, setLspConfig } = useCodeEditorStore();
-
-  if (!hydrated) {
-    return <Skeleton className="h-6 w-16 rounded-2xl" />;
-  }
-
-  const handleValueChange = (lang: EditorLanguage) => {
-    setLanguage(lang);
-    const selectedEditorLanguageConfig = editorLanguageConfigs.find(
-      (config) => config.language === lang
-    );
-    const selectedLanguageServerConfig = languageServerConfigs.find(
-      (config) => config.language === lang
-    );
-    setPath(selectedEditorLanguageConfig ? getPath(selectedEditorLanguageConfig) : "");
-    setLspConfig(selectedLanguageServerConfig || null);
-  };
+export default function LanguageSelector() {
+  const { currentLang, changeLang, editorLanguageConfigs } = useProblemEditor();
 
   return (
-    <Select value={language} onValueChange={handleValueChange}>
+    <Select value={currentLang} onValueChange={changeLang}>
       <SelectTrigger className="h-6 px-1.5 py-0.5 border-none shadow-none focus:ring-0 hover:bg-muted [&>span]:flex [&>span]:items-center [&>span]:gap-2 [&>span_svg]:shrink-0 [&>span_svg]:text-muted-foreground/80">
         <SelectValue placeholder="Select language" />
       </SelectTrigger>