From aa255fc2e14534544d03379f86a35c6c9202beb3 Mon Sep 17 00:00:00 2001 From: cfngc4594 Date: Mon, 3 Mar 2025 14:20:25 +0800 Subject: [PATCH] refactor(store): rename useCodeEditorState to useCodeEditorStore in imports --- .../@editor/components/copy-button.tsx | 4 ++-- .../@workspace/@editor/components/footer.tsx | 4 ++-- .../@editor/components/format-button.tsx | 4 ++-- .../@editor/components/language-selector.tsx | 6 +++--- .../@editor/components/redo-button.tsx | 4 ++-- .../@editor/components/reset-button.tsx | 4 ++-- .../@editor/components/undo-button.tsx | 5 +++-- src/components/code-editor.tsx | 19 ++++++------------- src/components/run-code.tsx | 4 ++-- 9 files changed, 24 insertions(+), 30 deletions(-) diff --git a/src/app/(app)/playground/@workspace/@editor/components/copy-button.tsx b/src/app/(app)/playground/@workspace/@editor/components/copy-button.tsx index 984ca04..375c21c 100644 --- a/src/app/(app)/playground/@workspace/@editor/components/copy-button.tsx +++ b/src/app/(app)/playground/@workspace/@editor/components/copy-button.tsx @@ -10,11 +10,11 @@ import { cn } from "@/lib/utils"; import { useState } from "react"; import { Check, Copy } from "lucide-react"; import { Button } from "@/components/ui/button"; -import { useCodeEditorState } from "@/store/useCodeEditor"; +import { useCodeEditorStore } from "@/store/useCodeEditorStore"; export default function CopyButton() { const [copied, setCopied] = useState(false); - const { editor } = useCodeEditorState(); + const { editor } = useCodeEditorStore(); const handleCopy = async () => { try { diff --git a/src/app/(app)/playground/@workspace/@editor/components/footer.tsx b/src/app/(app)/playground/@workspace/@editor/components/footer.tsx index e69ff4b..65bb5b3 100644 --- a/src/app/(app)/playground/@workspace/@editor/components/footer.tsx +++ b/src/app/(app)/playground/@workspace/@editor/components/footer.tsx @@ -2,7 +2,7 @@ import { cn } from "@/lib/utils"; import { useEffect, useState } from "react"; -import { useCodeEditorState } from "@/store/useCodeEditor"; +import { useCodeEditorStore } from "@/store/useCodeEditorStore"; interface WorkspaceEditorFooterProps { className?: string; @@ -12,7 +12,7 @@ export default function WorkspaceEditorFooter({ className, ...props }: WorkspaceEditorFooterProps) { - const { editor } = useCodeEditorState(); + const { editor } = useCodeEditorStore(); const [position, setPosition] = useState<{ lineNumber: number; column: number } | null>(null); useEffect(() => { diff --git a/src/app/(app)/playground/@workspace/@editor/components/format-button.tsx b/src/app/(app)/playground/@workspace/@editor/components/format-button.tsx index 3dacb06..8179069 100644 --- a/src/app/(app)/playground/@workspace/@editor/components/format-button.tsx +++ b/src/app/(app)/playground/@workspace/@editor/components/format-button.tsx @@ -8,10 +8,10 @@ import { } from "@/components/ui/tooltip"; import { Paintbrush } from "lucide-react"; import { Button } from "@/components/ui/button"; -import { useCodeEditorState } from "@/store/useCodeEditor"; +import { useCodeEditorStore } from "@/store/useCodeEditorStore"; export default function FormatButton() { - const { editor } = useCodeEditorState(); + const { editor } = useCodeEditorStore(); return ( diff --git a/src/app/(app)/playground/@workspace/@editor/components/language-selector.tsx b/src/app/(app)/playground/@workspace/@editor/components/language-selector.tsx index 8a638eb..fe9d6b8 100644 --- a/src/app/(app)/playground/@workspace/@editor/components/language-selector.tsx +++ b/src/app/(app)/playground/@workspace/@editor/components/language-selector.tsx @@ -8,13 +8,13 @@ import { SelectValue, } from "@/components/ui/select"; import { Skeleton } from "@/components/ui/skeleton"; -import { useCodeEditorState } from "@/store/useCodeEditor"; +import { useCodeEditorStore } from "@/store/useCodeEditorStore"; import { SUPPORTED_LANGUAGES } from "@/constants/language"; export default function LanguageSelector() { - const { loading, language, setLanguage } = useCodeEditorState(); + const { hydrated, language, setLanguage } = useCodeEditorStore(); - if (loading) { + if (!hydrated) { return ; } diff --git a/src/app/(app)/playground/@workspace/@editor/components/redo-button.tsx b/src/app/(app)/playground/@workspace/@editor/components/redo-button.tsx index 3b1453f..ba28031 100644 --- a/src/app/(app)/playground/@workspace/@editor/components/redo-button.tsx +++ b/src/app/(app)/playground/@workspace/@editor/components/redo-button.tsx @@ -8,10 +8,10 @@ import { } from "@/components/ui/tooltip"; import { Redo2 } from "lucide-react"; import { Button } from "@/components/ui/button"; -import { useCodeEditorState } from "@/store/useCodeEditor"; +import { useCodeEditorStore } from "@/store/useCodeEditorStore"; export default function RedoButton() { - const { editor } = useCodeEditorState(); + const { editor } = useCodeEditorStore(); return ( diff --git a/src/app/(app)/playground/@workspace/@editor/components/reset-button.tsx b/src/app/(app)/playground/@workspace/@editor/components/reset-button.tsx index 95e6d88..5133e29 100644 --- a/src/app/(app)/playground/@workspace/@editor/components/reset-button.tsx +++ b/src/app/(app)/playground/@workspace/@editor/components/reset-button.tsx @@ -2,7 +2,7 @@ import { RotateCcw } from "lucide-react"; import { Button } from "@/components/ui/button"; -import { useCodeEditorState } from "@/store/useCodeEditor"; +import { useCodeEditorStore } from "@/store/useCodeEditorStore"; import { Tooltip, TooltipContent, @@ -12,7 +12,7 @@ import { import { DEFAULT_EDITOR_VALUE } from "@/config/editor/value"; export default function ResetButton() { - const { editor, language } = useCodeEditorState(); + const { editor, language } = useCodeEditorStore(); return ( diff --git a/src/app/(app)/playground/@workspace/@editor/components/undo-button.tsx b/src/app/(app)/playground/@workspace/@editor/components/undo-button.tsx index cc54a59..21e607f 100644 --- a/src/app/(app)/playground/@workspace/@editor/components/undo-button.tsx +++ b/src/app/(app)/playground/@workspace/@editor/components/undo-button.tsx @@ -8,10 +8,11 @@ import { } from "@/components/ui/tooltip"; import { Undo2 } from "lucide-react"; import { Button } from "@/components/ui/button"; -import { useCodeEditorState } from "@/store/useCodeEditor"; +import { useCodeEditorStore } from "@/store/useCodeEditorStore"; export default function UndoButton() { - const { editor } = useCodeEditorState(); + const { editor } = useCodeEditorStore(); + return ( diff --git a/src/components/code-editor.tsx b/src/components/code-editor.tsx index f40aae3..58aa98e 100644 --- a/src/components/code-editor.tsx +++ b/src/components/code-editor.tsx @@ -17,7 +17,7 @@ import { DEFAULT_EDITOR_PATH } from "@/config/editor/path"; import { DEFAULT_EDITOR_VALUE } from "@/config/editor/value"; import type { MonacoLanguageClient } from "monaco-languageclient"; import { SUPPORTED_LANGUAGE_SERVERS } from "@/config/lsp/language-server"; -import { useCodeEditorOption, useCodeEditorState } from "@/store/useCodeEditor"; +import { useCodeEditorOptionStore, useCodeEditorStore } from "@/store/useCodeEditorStore"; const Editor = dynamic( async () => { @@ -52,8 +52,8 @@ export default function CodeEditor() { socket: null, controller: new AbortController(), }); - const { fontSize, lineHeight } = useCodeEditorOption(); - const { language, setEditor } = useCodeEditorState(); + const { fontSize, lineHeight } = useCodeEditorOptionStore(); + const { language, setEditor } = useCodeEditorStore(); useEffect(() => { const currentHandle: ConnectionHandle = { @@ -114,8 +114,7 @@ export default function CodeEditor() { if (!serverConfig || signal.aborted) return; // Create WebSocket connection - const lspUrl = `${serverConfig.protocol}://${serverConfig.hostname}${serverConfig.port ? `:${serverConfig.port}` : "" - }${serverConfig.path || ""}`; + const lspUrl = `${serverConfig.protocol}://${serverConfig.hostname}${serverConfig.port ? `:${serverConfig.port}` : ""}${serverConfig.path || ""}`; const webSocket = new WebSocket(normalizeUrl(lspUrl)); currentHandle.socket = webSocket; @@ -140,9 +139,7 @@ export default function CodeEditor() { // Initialize Language Client const { MonacoLanguageClient } = await import("monaco-languageclient"); - const { ErrorAction, CloseAction } = await import( - "vscode-languageclient" - ); + const { ErrorAction, CloseAction } = await import("vscode-languageclient"); const socket = toSocket(webSocket); const client = new MonacoLanguageClient({ @@ -213,11 +210,7 @@ export default function CodeEditor() { defaultLanguage={language} value={editorValue} path={DEFAULT_EDITOR_PATH[language]} - theme={ - resolvedTheme === "light" - ? "github-light-default" - : "github-dark-default" - } + theme={resolvedTheme === "light" ? "github-light-default" : "github-dark-default"} className="h-full" options={mergeOptions} beforeMount={(monaco) => { diff --git a/src/components/run-code.tsx b/src/components/run-code.tsx index 4b29e54..6a3a860 100644 --- a/src/components/run-code.tsx +++ b/src/components/run-code.tsx @@ -5,7 +5,7 @@ import { useState } from "react"; import { judge } from "@/app/actions/judge"; import { Button } from "@/components/ui/button"; import { LoaderCircleIcon, PlayIcon } from "lucide-react"; -import { useCodeEditorState } from "@/store/useCodeEditor"; +import { useCodeEditorStore } from "@/store/useCodeEditorStore"; interface RunCodeProps { className?: string; @@ -15,7 +15,7 @@ export default function RunCode({ className, ...props }: RunCodeProps) { - const { language, editor, setResult } = useCodeEditorState(); + const { language, editor, setResult } = useCodeEditorStore(); const [isLoading, setIsLoading] = useState(false); const handleJudge = async () => {