mirror of
https://github.com/massbug/judge4c.git
synced 2025-05-18 15:26:33 +00:00
refactor(code-editor-store): rename and add hydration state, update storage handling
This commit is contained in:
parent
8bf109679d
commit
64655d8118
@ -1,66 +1,58 @@
|
|||||||
import { create } from "zustand";
|
import { create } from "zustand";
|
||||||
import { type editor } from "monaco-editor";
|
import { type editor } from "monaco-editor";
|
||||||
|
import { persist } from "zustand/middleware";
|
||||||
import { JudgeResult } from "@/config/judge";
|
import { JudgeResult } from "@/config/judge";
|
||||||
import { CODE_EDITOR_OPTIONS } from "@/constants/option";
|
import { CODE_EDITOR_OPTIONS } from "@/constants/option";
|
||||||
import { SupportedLanguage } from "@/constants/language";
|
import { SupportedLanguage } from "@/constants/language";
|
||||||
import { MonacoLanguageClient } from "monaco-languageclient";
|
import { MonacoLanguageClient } from "monaco-languageclient";
|
||||||
import { persist, createJSONStorage } from "zustand/middleware";
|
|
||||||
import { DEFAULT_EDITOR_LANGUAGE } from "@/config/editor/language";
|
import { DEFAULT_EDITOR_LANGUAGE } from "@/config/editor/language";
|
||||||
|
|
||||||
interface CodeEditorState {
|
interface CodeEditorState {
|
||||||
editor: editor.IStandaloneCodeEditor | null;
|
editor: editor.IStandaloneCodeEditor | null;
|
||||||
language: SupportedLanguage;
|
language: SupportedLanguage;
|
||||||
languageClient: MonacoLanguageClient | null;
|
languageClient: MonacoLanguageClient | null;
|
||||||
loading: boolean;
|
hydrated: boolean;
|
||||||
result: JudgeResult | null;
|
result: JudgeResult | null;
|
||||||
setEditor: (editor: editor.IStandaloneCodeEditor | null) => void;
|
setEditor: (editor: editor.IStandaloneCodeEditor | null) => void;
|
||||||
setLanguage: (language: SupportedLanguage) => void;
|
setLanguage: (language: SupportedLanguage) => void;
|
||||||
setLanguageClient: (languageClient: MonacoLanguageClient | null) => void;
|
setLanguageClient: (languageClient: MonacoLanguageClient | null) => void;
|
||||||
setLoading: (loading: boolean) => void;
|
setHydrated: (value: boolean) => void;
|
||||||
setResult: (result: JudgeResult) => void;
|
setResult: (result: JudgeResult) => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const useCodeEditorState = create<CodeEditorState>()(
|
export const useCodeEditorStore = create<CodeEditorState>()(
|
||||||
persist(
|
persist(
|
||||||
(set) => ({
|
(set) => ({
|
||||||
editor: null,
|
editor: null,
|
||||||
language: DEFAULT_EDITOR_LANGUAGE,
|
language: DEFAULT_EDITOR_LANGUAGE,
|
||||||
languageClient: null,
|
languageClient: null,
|
||||||
loading: true,
|
hydrated: false,
|
||||||
result: null,
|
result: null,
|
||||||
setEditor: (editor) => set({ editor }),
|
setEditor: (editor) => set({ editor }),
|
||||||
setLanguage: (language) => set({ language }),
|
setLanguage: (language) => set({ language }),
|
||||||
setLanguageClient: (languageClient) => set({ languageClient }),
|
setLanguageClient: (languageClient) => set({ languageClient }),
|
||||||
setLoading: (loading) => set({ loading }),
|
setHydrated: (value) => set({ hydrated: value }),
|
||||||
setResult: (result) => set({ result }),
|
setResult: (result) => set({ result }),
|
||||||
}),
|
}),
|
||||||
{
|
{
|
||||||
name: "code-editor-language",
|
name: "code-editor-language",
|
||||||
storage: createJSONStorage(() => {
|
partialize: (state) => ({
|
||||||
if (typeof window !== "undefined") {
|
language: state.language,
|
||||||
return localStorage;
|
|
||||||
} else {
|
|
||||||
return {
|
|
||||||
getItem: () => null,
|
|
||||||
setItem: () => { },
|
|
||||||
removeItem: () => { },
|
|
||||||
};
|
|
||||||
}
|
|
||||||
}),
|
}),
|
||||||
partialize: (state) => ({ language: state.language }),
|
onRehydrateStorage: () => (state, error) => {
|
||||||
|
if (error) {
|
||||||
|
console.error("hydrate error", error);
|
||||||
|
} else if (state) {
|
||||||
|
state.setHydrated(true);
|
||||||
|
}
|
||||||
|
},
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
|
|
||||||
export const useCodeEditorOption = create<editor.IEditorConstructionOptions>((set) => ({
|
export const useCodeEditorOptionStore = create<editor.IEditorConstructionOptions>((set) => ({
|
||||||
fontSize: CODE_EDITOR_OPTIONS.fontSize,
|
fontSize: CODE_EDITOR_OPTIONS.fontSize,
|
||||||
lineHeight: CODE_EDITOR_OPTIONS.lineHeight,
|
lineHeight: CODE_EDITOR_OPTIONS.lineHeight,
|
||||||
setFontSize: (fontSize: number) => set({ fontSize }),
|
setFontSize: (fontSize: number) => set({ fontSize }),
|
||||||
setLineHeight: (lineHeight: number) => set({ lineHeight }),
|
setLineHeight: (lineHeight: number) => set({ lineHeight }),
|
||||||
}));
|
}));
|
||||||
|
|
||||||
async function initializeEditor() {
|
|
||||||
useCodeEditorState.getState().setLoading(false);
|
|
||||||
}
|
|
||||||
|
|
||||||
initializeEditor();
|
|
Loading…
Reference in New Issue
Block a user