refactor(hooks): remove theme config and simplify theme hook

- Delete src/config/monaco-theme.ts and src/types/monaco-theme.ts
- Simplify useMonacoTheme hook to directly return theme strings
- Format use-mobile.ts with consistent semicolons and quotes
This commit is contained in:
cfngc4594 2025-05-12 21:19:05 +08:00
parent 01b72209ae
commit 2e2e0315a8
4 changed files with 18 additions and 46 deletions

View File

@ -1,19 +0,0 @@
import { MonacoTheme } from "@/types/monaco-theme";
// Define theme configurations
const MonacoThemeConfig = {
[MonacoTheme.GitHubLightDefault]: {
id: MonacoTheme.GitHubLightDefault,
label: "Github Light Default",
},
[MonacoTheme.GitHubDarkDefault]: {
id: MonacoTheme.GitHubDarkDefault,
label: "Github Dark Default",
},
};
// Default Light and Dark theme configurations
const DefaultLightThemeConfig = MonacoThemeConfig[MonacoTheme.GitHubLightDefault];
const DefaultDarkThemeConfig = MonacoThemeConfig[MonacoTheme.GitHubDarkDefault];
export { MonacoThemeConfig, DefaultLightThemeConfig, DefaultDarkThemeConfig };

View File

@ -1,19 +1,21 @@
import * as React from "react"
import * as React from "react";
const MOBILE_BREAKPOINT = 768
const MOBILE_BREAKPOINT = 768;
export function useIsMobile() {
const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined)
const [isMobile, setIsMobile] = React.useState<boolean | undefined>(
undefined
);
React.useEffect(() => {
const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`)
const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
const onChange = () => {
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)
}
mql.addEventListener("change", onChange)
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)
return () => mql.removeEventListener("change", onChange)
}, [])
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
};
mql.addEventListener("change", onChange);
setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
return () => mql.removeEventListener("change", onChange);
}, []);
return !!isMobile
return !!isMobile;
}

View File

@ -1,12 +1,10 @@
import { useTheme } from "next-themes";
import { DefaultLightThemeConfig, DefaultDarkThemeConfig } from "@/config/monaco-theme";
export function useMonacoTheme() {
export const useMonacoTheme = () => {
const { resolvedTheme } = useTheme();
const currentTheme = resolvedTheme === "light" ? DefaultLightThemeConfig.id : DefaultDarkThemeConfig.id;
const theme =
resolvedTheme === "light" ? "github-light-default" : "github-dark-default";
return {
currentTheme,
};
}
return { theme };
};

View File

@ -1,9 +0,0 @@
export enum MonacoTheme {
GitHubLightDefault = "github-light-default",
GitHubDarkDefault = "github-dark-default",
}
export type MonacoThemeMetadata = {
id: MonacoTheme;
label: string;
};