mirror of
https://github.com/woodchen-ink/certimate.git
synced 2025-07-18 09:21:56 +08:00
refactor: clean code
This commit is contained in:
parent
df71782719
commit
2374bb56fa
@ -1,6 +1,7 @@
|
||||
import { useEffect, useLayoutEffect, useState } from "react";
|
||||
import { RouterProvider } from "react-router-dom";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useCreation } from "ahooks";
|
||||
import { App, ConfigProvider, theme, type ThemeConfig } from "antd";
|
||||
import { type Locale } from "antd/es/locale";
|
||||
import AntdLocaleEnUs from "antd/locale/en_US";
|
||||
@ -9,30 +10,36 @@ import dayjs from "dayjs";
|
||||
import "dayjs/locale/zh-cn";
|
||||
|
||||
import { localeNames } from "./i18n";
|
||||
import { useTheme } from "./hooks";
|
||||
import { useBrowserTheme } from "./hooks";
|
||||
import { router } from "./router.tsx";
|
||||
|
||||
const RootApp = () => {
|
||||
const { i18n } = useTranslation();
|
||||
|
||||
const { theme: browserTheme } = useTheme();
|
||||
const { theme: browserTheme } = useBrowserTheme();
|
||||
|
||||
const antdLocalesMap: Record<string, Locale> = {
|
||||
[localeNames.ZH]: AntdLocaleZhCN,
|
||||
[localeNames.EN]: AntdLocaleEnUs,
|
||||
};
|
||||
const antdLocalesMap: Record<string, Locale> = useCreation(
|
||||
() => ({
|
||||
[localeNames.ZH]: AntdLocaleZhCN,
|
||||
[localeNames.EN]: AntdLocaleEnUs,
|
||||
}),
|
||||
[]
|
||||
);
|
||||
const [antdLocale, setAntdLocale] = useState(antdLocalesMap[i18n.language]);
|
||||
const handleLanguageChanged = () => {
|
||||
setAntdLocale(antdLocalesMap[i18n.language]);
|
||||
dayjs.locale(i18n.language);
|
||||
};
|
||||
i18n.on("languageChanged", handleLanguageChanged);
|
||||
useLayoutEffect(handleLanguageChanged, [i18n]);
|
||||
useLayoutEffect(handleLanguageChanged, [antdLocalesMap, i18n]);
|
||||
|
||||
const antdThemesMap: Record<string, ThemeConfig> = {
|
||||
["light"]: { algorithm: theme.defaultAlgorithm },
|
||||
["dark"]: { algorithm: theme.darkAlgorithm },
|
||||
};
|
||||
const antdThemesMap: Record<string, ThemeConfig> = useCreation(
|
||||
() => ({
|
||||
["light"]: { algorithm: theme.defaultAlgorithm },
|
||||
["dark"]: { algorithm: theme.darkAlgorithm },
|
||||
}),
|
||||
[]
|
||||
);
|
||||
const [antdTheme, setAntdTheme] = useState(antdThemesMap[browserTheme]);
|
||||
useEffect(() => {
|
||||
setAntdTheme(antdThemesMap[browserTheme]);
|
||||
@ -40,7 +47,7 @@ const RootApp = () => {
|
||||
const root = window.document.documentElement;
|
||||
root.classList.remove("light", "dark");
|
||||
root.classList.add(browserTheme);
|
||||
}, [browserTheme]);
|
||||
}, [antdThemesMap, browserTheme]);
|
||||
|
||||
return (
|
||||
<ConfigProvider
|
||||
|
@ -5,6 +5,7 @@ import { Modal, notification } from "antd";
|
||||
|
||||
import { type AccessModel } from "@/domain/access";
|
||||
import { useAccessStore } from "@/stores/access";
|
||||
import { getErrMsg } from "@/utils/error";
|
||||
import AccessEditForm, { type AccessEditFormInstance } from "./AccessEditForm";
|
||||
|
||||
export type AccessEditModalProps = {
|
||||
@ -72,7 +73,7 @@ const AccessEditModal = ({ data, loading, mode, trigger, ...props }: AccessEditM
|
||||
|
||||
setOpen(false);
|
||||
} catch (err) {
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{String(err)}</> });
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{getErrMsg(err)}</> });
|
||||
|
||||
throw err;
|
||||
} finally {
|
||||
|
@ -1,3 +1,3 @@
|
||||
import useTheme from "./useTheme";
|
||||
import useBrowserTheme from "./useBrowserTheme";
|
||||
|
||||
export { useTheme };
|
||||
export { useBrowserTheme };
|
||||
|
@ -16,7 +16,7 @@ import {
|
||||
} from "lucide-react";
|
||||
|
||||
import Version from "@/components/Version";
|
||||
import { useTheme } from "@/hooks";
|
||||
import { useBrowserTheme } from "@/hooks";
|
||||
import { getPocketBase } from "@/repository/pocketbase";
|
||||
|
||||
const ConsoleLayout = () => {
|
||||
@ -182,7 +182,7 @@ const SiderMenu = memo(({ onSelect }: { onSelect?: (key: string) => void }) => {
|
||||
const ThemeToggleButton = memo(({ size }: { size?: ButtonProps["size"] }) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const { theme, setThemeMode } = useTheme();
|
||||
const { theme, setThemeMode } = useBrowserTheme();
|
||||
|
||||
const items: Required<MenuProps>["items"] = [
|
||||
["light", t("common.theme.light")],
|
||||
|
@ -9,6 +9,7 @@ import { ClientResponseError } from "pocketbase";
|
||||
import AccessEditModal from "@/components/access/AccessEditModal";
|
||||
import { accessProvidersMap, type AccessModel } from "@/domain/access";
|
||||
import { useAccessStore } from "@/stores/access";
|
||||
import { getErrMsg } from "@/utils/error";
|
||||
|
||||
const AccessList = () => {
|
||||
const { t } = useTranslation();
|
||||
@ -119,7 +120,7 @@ const AccessList = () => {
|
||||
}
|
||||
|
||||
console.error(err);
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{String(err)}</> });
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{getErrMsg(err)}</> });
|
||||
});
|
||||
}, []);
|
||||
|
||||
@ -140,7 +141,7 @@ const AccessList = () => {
|
||||
}
|
||||
|
||||
console.error(err);
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{String(err)}</> });
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{getErrMsg(err)}</> });
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@ -160,7 +161,7 @@ const AccessList = () => {
|
||||
await deleteAccess(data);
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{String(err)}</> });
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{getErrMsg(err)}</> });
|
||||
}
|
||||
},
|
||||
});
|
||||
|
@ -10,6 +10,7 @@ import { ClientResponseError } from "pocketbase";
|
||||
import CertificateDetailDrawer from "@/components/certificate/CertificateDetailDrawer";
|
||||
import { CertificateModel } from "@/domain/certificate";
|
||||
import { list as listCertificate, type CertificateListReq } from "@/repository/certificate";
|
||||
import { getErrMsg } from "@/utils/error";
|
||||
|
||||
const CertificateList = () => {
|
||||
const navigate = useNavigate();
|
||||
@ -195,7 +196,7 @@ const CertificateList = () => {
|
||||
}
|
||||
|
||||
console.error(err);
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{String(err)}</> });
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{getErrMsg(err)}</> });
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
|
@ -14,6 +14,7 @@ import { ClientResponseError } from "pocketbase";
|
||||
|
||||
import { type Statistics } from "@/domain/statistics";
|
||||
import { get as getStatistics } from "@/api/statistics";
|
||||
import { getErrMsg } from "@/utils/error";
|
||||
|
||||
const Dashboard = () => {
|
||||
const navigate = useNavigate();
|
||||
@ -49,7 +50,7 @@ const Dashboard = () => {
|
||||
}
|
||||
|
||||
console.error(err);
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{String(err)}</> });
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{getErrMsg(err)}</> });
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
|
@ -6,6 +6,7 @@ import { createSchemaFieldRule } from "antd-zod";
|
||||
import { z } from "zod";
|
||||
|
||||
import { getPocketBase } from "@/repository/pocketbase";
|
||||
import { getErrMsg } from "@/utils/error";
|
||||
|
||||
const Login = () => {
|
||||
const navigage = useNavigate();
|
||||
@ -29,7 +30,7 @@ const Login = () => {
|
||||
await getPocketBase().admins.authWithPassword(fields.username, fields.password);
|
||||
navigage("/");
|
||||
} catch (err) {
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{String(err)}</> });
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{getErrMsg(err)}</> });
|
||||
} finally {
|
||||
setFormPending(false);
|
||||
}
|
||||
|
@ -25,6 +25,7 @@ import { ClientResponseError } from "pocketbase";
|
||||
|
||||
import { WorkflowModel } from "@/domain/workflow";
|
||||
import { list as listWorkflow, remove as removeWorkflow, save as saveWorkflow } from "@/repository/workflow";
|
||||
import { getErrMsg } from "@/utils/error";
|
||||
|
||||
const WorkflowList = () => {
|
||||
const navigate = useNavigate();
|
||||
@ -227,7 +228,7 @@ const WorkflowList = () => {
|
||||
}
|
||||
|
||||
console.error(err);
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{String(err)}</> });
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{getErrMsg(err)}</> });
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
@ -255,7 +256,7 @@ const WorkflowList = () => {
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{String(err)}</> });
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{getErrMsg(err)}</> });
|
||||
}
|
||||
};
|
||||
|
||||
@ -271,7 +272,7 @@ const WorkflowList = () => {
|
||||
}
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{String(err)}</> });
|
||||
notificationApi.error({ message: t("common.text.request_error"), description: <>{getErrMsg(err)}</> });
|
||||
}
|
||||
},
|
||||
});
|
||||
|
@ -11,5 +11,5 @@ export const getErrMsg = (error: unknown): string => {
|
||||
return error;
|
||||
}
|
||||
|
||||
return "Something went wrong";
|
||||
return String(error ?? "Unknown error");
|
||||
};
|
||||
|
Loading…
x
Reference in New Issue
Block a user