refactor(constants): move languages.ts and themes.ts to editor folder

refactor(imports): update SUPPORTED_LANGUAGES and SUPPORTED_THEMES import path to use editor folder

feat(constants): add MIN_FONT_SIZE、MAX_FONT_SIZE and DEFAULT_FONT_SIZE

feat(store): add font size management to code editor store
This commit is contained in:
ngc2207 2024-12-31 23:57:27 +08:00
parent 26efe14fc7
commit 0be9cf3baa
7 changed files with 16 additions and 5 deletions

View File

@ -5,8 +5,8 @@ import {
SelectContent,
SelectTrigger,
} from "@/components/ui/select";
import { SUPPORTED_LANGUAGES } from "@/constants/languages";
import { useCodeEditorStore } from "@/store/useCodeEditorStore";
import { SUPPORTED_LANGUAGES } from "@/constants/editor/languages";
export default function LanguageSelector() {
const { language, setLanguage } = useCodeEditorStore();

View File

@ -6,7 +6,7 @@ import {
SelectTrigger,
} from "@/components/ui/select";
import { Palette } from "lucide-react";
import { SUPPORTED_THEMES } from "@/constants/themes";
import { SUPPORTED_THEMES } from "@/constants/editor/themes";
import { useCodeEditorStore } from "@/store/useCodeEditorStore";
export default function ThemeSelector() {

View File

@ -0,0 +1,5 @@
export const MIN_FONT_SIZE = 8;
export const MAX_FONT_SIZE = 24;
export const DEFAULT_FONT_SIZE = 16;

View File

@ -1,16 +1,20 @@
import { create } from "zustand";
import { CodeEditorState } from "@/types";
import { DEFAULT_THEME } from "@/constants/themes";
import { DEFAULT_LANGUAGE } from "@/constants/languages";
import { DEFAULT_THEME } from "@/constants/editor/themes";
import { DEFAULT_LANGUAGE } from "@/constants/editor/languages";
import { persist, createJSONStorage } from "zustand/middleware";
import { DEFAULT_FONT_SIZE } from "@/constants/editor/options";
export const useCodeEditorStore = create<CodeEditorState>()(
persist(
(set, get) => ({
(set) => ({
language: DEFAULT_LANGUAGE,
theme: DEFAULT_THEME,
fontSize: DEFAULT_FONT_SIZE,
setLanguage: (language: string) => set({ language }),
setTheme: (theme: string) => set({ theme }),
setFontSize: (fontSize: number) => set({ fontSize }),
}),
{
name: "code-editor-storage",

View File

@ -1,7 +1,9 @@
export interface CodeEditorState {
language: string;
theme: string;
fontSize: number;
setLanguage: (language: string) => void;
setTheme: (theme: string) => void;
setFontSize: (fontSize: number) => void;
}