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

refactor(store): rename useCodeEditorState to useCodeEditorStore in imports

Browse Source
This commit is contained in:
cfngc4594 2025-03-03 14:20:25 +08:00
parent 64655d8118
commit aa255fc2e1
9 changed files with 24 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/(app)/playground/@workspace/@editor/components/copy-button.tsx
View File

@ -10,11 +10,11 @@ import { cn } from "@/lib/utils";
import { useState } from "react"; import { useState } from "react";
import { Check, Copy } from "lucide-react"; import { Check, Copy } from "lucide-react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { useCodeEditorState } from "@/store/useCodeEditor"; import { useCodeEditorStore } from "@/store/useCodeEditorStore";
export default function CopyButton() { export default function CopyButton() {
const [copied, setCopied] = useState(false); const [copied, setCopied] = useState(false);
const { editor } = useCodeEditorState(); const { editor } = useCodeEditorStore();
const handleCopy = async () => { const handleCopy = async () => {
try { try {

4
src/app/(app)/playground/@workspace/@editor/components/footer.tsx
View File

@ -2,7 +2,7 @@
import { cn } from "@/lib/utils"; import { cn } from "@/lib/utils";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { useCodeEditorState } from "@/store/useCodeEditor"; import { useCodeEditorStore } from "@/store/useCodeEditorStore";
interface WorkspaceEditorFooterProps { interface WorkspaceEditorFooterProps {
className?: string; className?: string;
@ -12,7 +12,7 @@ export default function WorkspaceEditorFooter({
className, className,
...props ...props
}: WorkspaceEditorFooterProps) { }: WorkspaceEditorFooterProps) {
const { editor } = useCodeEditorState(); const { editor } = useCodeEditorStore();
const [position, setPosition] = useState<{ lineNumber: number; column: number } | null>(null); const [position, setPosition] = useState<{ lineNumber: number; column: number } | null>(null);
useEffect(() => { useEffect(() => {

4
src/app/(app)/playground/@workspace/@editor/components/format-button.tsx
View File

@ -8,10 +8,10 @@ import {
} from "@/components/ui/tooltip"; } from "@/components/ui/tooltip";
import { Paintbrush } from "lucide-react"; import { Paintbrush } from "lucide-react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { useCodeEditorState } from "@/store/useCodeEditor"; import { useCodeEditorStore } from "@/store/useCodeEditorStore";
export default function FormatButton() { export default function FormatButton() {
const { editor } = useCodeEditorState(); const { editor } = useCodeEditorStore();
return ( return (
<TooltipProvider delayDuration={0}> <TooltipProvider delayDuration={0}>

6
src/app/(app)/playground/@workspace/@editor/components/language-selector.tsx
View File

@ -8,13 +8,13 @@ import {
SelectValue, SelectValue,
} from "@/components/ui/select"; } from "@/components/ui/select";
import { Skeleton } from "@/components/ui/skeleton"; import { Skeleton } from "@/components/ui/skeleton";
import { useCodeEditorState } from "@/store/useCodeEditor"; import { useCodeEditorStore } from "@/store/useCodeEditorStore";
import { SUPPORTED_LANGUAGES } from "@/constants/language"; import { SUPPORTED_LANGUAGES } from "@/constants/language";
export default function LanguageSelector() { export default function LanguageSelector() {
const { loading, language, setLanguage } = useCodeEditorState(); const { hydrated, language, setLanguage } = useCodeEditorStore();
if (loading) { if (!hydrated) {
return <Skeleton className="h-6 w-16 rounded-2xl" />; return <Skeleton className="h-6 w-16 rounded-2xl" />;
} }

4
src/app/(app)/playground/@workspace/@editor/components/redo-button.tsx
View File

@ -8,10 +8,10 @@ import {
} from "@/components/ui/tooltip"; } from "@/components/ui/tooltip";
import { Redo2 } from "lucide-react"; import { Redo2 } from "lucide-react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { useCodeEditorState } from "@/store/useCodeEditor"; import { useCodeEditorStore } from "@/store/useCodeEditorStore";
export default function RedoButton() { export default function RedoButton() {
const { editor } = useCodeEditorState(); const { editor } = useCodeEditorStore();
return ( return (
<TooltipProvider delayDuration={0}> <TooltipProvider delayDuration={0}>

4
src/app/(app)/playground/@workspace/@editor/components/reset-button.tsx
View File

@ -2,7 +2,7 @@
import { RotateCcw } from "lucide-react"; import { RotateCcw } from "lucide-react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { useCodeEditorState } from "@/store/useCodeEditor"; import { useCodeEditorStore } from "@/store/useCodeEditorStore";
import { import {
Tooltip, Tooltip,
TooltipContent, TooltipContent,
@ -12,7 +12,7 @@ import {
import { DEFAULT_EDITOR_VALUE } from "@/config/editor/value"; import { DEFAULT_EDITOR_VALUE } from "@/config/editor/value";
export default function ResetButton() { export default function ResetButton() {
const { editor, language } = useCodeEditorState(); const { editor, language } = useCodeEditorStore();
return ( return (
<TooltipProvider delayDuration={0}> <TooltipProvider delayDuration={0}>

5
src/app/(app)/playground/@workspace/@editor/components/undo-button.tsx
View File

@ -8,10 +8,11 @@ import {
} from "@/components/ui/tooltip"; } from "@/components/ui/tooltip";
import { Undo2 } from "lucide-react"; import { Undo2 } from "lucide-react";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { useCodeEditorState } from "@/store/useCodeEditor"; import { useCodeEditorStore } from "@/store/useCodeEditorStore";
export default function UndoButton() { export default function UndoButton() {
const { editor } = useCodeEditorState(); const { editor } = useCodeEditorStore();
return ( return (
<TooltipProvider delayDuration={0}> <TooltipProvider delayDuration={0}>
<Tooltip> <Tooltip>

19
src/components/code-editor.tsx
View File

@ -17,7 +17,7 @@ import { DEFAULT_EDITOR_PATH } from "@/config/editor/path";
import { DEFAULT_EDITOR_VALUE } from "@/config/editor/value"; import { DEFAULT_EDITOR_VALUE } from "@/config/editor/value";
import type { MonacoLanguageClient } from "monaco-languageclient"; import type { MonacoLanguageClient } from "monaco-languageclient";
import { SUPPORTED_LANGUAGE_SERVERS } from "@/config/lsp/language-server"; import { SUPPORTED_LANGUAGE_SERVERS } from "@/config/lsp/language-server";
import { useCodeEditorOption, useCodeEditorState } from "@/store/useCodeEditor"; import { useCodeEditorOptionStore, useCodeEditorStore } from "@/store/useCodeEditorStore";
const Editor = dynamic( const Editor = dynamic(
async () => { async () => {
@ -52,8 +52,8 @@ export default function CodeEditor() {
socket: null, socket: null,
controller: new AbortController(), controller: new AbortController(),
}); });
const { fontSize, lineHeight } = useCodeEditorOption(); const { fontSize, lineHeight } = useCodeEditorOptionStore();
const { language, setEditor } = useCodeEditorState(); const { language, setEditor } = useCodeEditorStore();
useEffect(() => { useEffect(() => {
const currentHandle: ConnectionHandle = { const currentHandle: ConnectionHandle = {
@ -114,8 +114,7 @@ export default function CodeEditor() {
if (!serverConfig || signal.aborted) return; if (!serverConfig || signal.aborted) return;
// Create WebSocket connection // Create WebSocket connection
const lspUrl = `${serverConfig.protocol}://${serverConfig.hostname}${serverConfig.port ? `:${serverConfig.port}` : "" const lspUrl = `${serverConfig.protocol}://${serverConfig.hostname}${serverConfig.port ? `:${serverConfig.port}` : ""}${serverConfig.path || ""}`;
}${serverConfig.path || ""}`;
const webSocket = new WebSocket(normalizeUrl(lspUrl)); const webSocket = new WebSocket(normalizeUrl(lspUrl));
currentHandle.socket = webSocket; currentHandle.socket = webSocket;
@ -140,9 +139,7 @@ export default function CodeEditor() {
// Initialize Language Client // Initialize Language Client
const { MonacoLanguageClient } = await import("monaco-languageclient"); const { MonacoLanguageClient } = await import("monaco-languageclient");
const { ErrorAction, CloseAction } = await import( const { ErrorAction, CloseAction } = await import("vscode-languageclient");
"vscode-languageclient"
);
const socket = toSocket(webSocket); const socket = toSocket(webSocket);
const client = new MonacoLanguageClient({ const client = new MonacoLanguageClient({
@ -213,11 +210,7 @@ export default function CodeEditor() {
defaultLanguage={language} defaultLanguage={language}
value={editorValue} value={editorValue}
path={DEFAULT_EDITOR_PATH[language]} path={DEFAULT_EDITOR_PATH[language]}
theme={ theme={resolvedTheme === "light" ? "github-light-default" : "github-dark-default"}
resolvedTheme === "light"
? "github-light-default"
: "github-dark-default"
}
className="h-full" className="h-full"
options={mergeOptions} options={mergeOptions}
beforeMount={(monaco) => { beforeMount={(monaco) => {

4
src/components/run-code.tsx
View File

@ -5,7 +5,7 @@ import { useState } from "react";
import { judge } from "@/app/actions/judge"; import { judge } from "@/app/actions/judge";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { LoaderCircleIcon, PlayIcon } from "lucide-react"; import { LoaderCircleIcon, PlayIcon } from "lucide-react";
import { useCodeEditorState } from "@/store/useCodeEditor"; import { useCodeEditorStore } from "@/store/useCodeEditorStore";
interface RunCodeProps { interface RunCodeProps {
className?: string; className?: string;
@ -15,7 +15,7 @@ export default function RunCode({
className, className,
...props ...props
}: RunCodeProps) { }: RunCodeProps) {
const { language, editor, setResult } = useCodeEditorState(); const { language, editor, setResult } = useCodeEditorStore();
const [isLoading, setIsLoading] = useState<boolean>(false); const [isLoading, setIsLoading] = useState<boolean>(false);
const handleJudge = async () => { const handleJudge = async () => {