@gadmin2n/schematics 0.0.64 → 0.0.65

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/App.tsx

@@ -1,185 +1,111 @@
-import React from "react";
-import { Refine, ResourceProps } from "@refinedev/core";
-import {
-  notificationProvider,
-  ErrorComponent,
-  ThemedLayoutV2,
-} from "@refinedev/antd";
-import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar";
-import routerProvider, {
-  NavigateToResource,
-  UnsavedChangesNotifier,
-} from "@refinedev/react-router-v6";
-import { BrowserRouter, Outlet, Route, Routes } from "react-router-dom";
-import { useTranslation } from "react-i18next";
-import resources from "generated/resources";
-import { OffLayoutArea } from "components/offLayoutArea";
-import { Header } from "components/layout";
-import { CustomSider } from "./components/layout";
-import { ColorModeContextProvider } from "components/contexts/color-mode";
-import { BusinessContextProvider } from "components/contexts/business";
-import { authProvider } from "authProvider";
-import produce from "immer";
-import Index from "pages/index";
-import "@refinedev/antd/dist/reset.css";
-import { auditLogProvider } from "auditLogProvider";
-import {
-  DashboardOutlined,
-  SettingOutlined,
-} from "@ant-design/icons";
-import { gadminCrudProvider as dataProvider } from "./helpers/login";
-
-const SYSTEM_MENU_NAME = "system";
-const newResources: ResourceProps[] = produce(resources, (draft) => {
-  draft.forEach((resource) => {
-    if (
-      resource.meta &&
-      ["game", "studio", "role", "log"].includes(resource.name)
-    ) {
-      resource.meta.parent = SYSTEM_MENU_NAME;
-      resource.list = `/${SYSTEM_MENU_NAME}${resource.list}`;
-      resource.create = `/${SYSTEM_MENU_NAME}${resource.create}`;
-      resource.edit = `/${SYSTEM_MENU_NAME}${resource.edit}`;
-      resource.clone = `/${SYSTEM_MENU_NAME}${resource.clone}`;
-      resource.show = `/${SYSTEM_MENU_NAME}${resource.show}`;
-    }
-  });
-  draft.splice(0, 0, {
-    name: "index",
-    list: "/index",
-    meta: { icon: <DashboardOutlined /> },
-  });
-  draft.push({
-    name: SYSTEM_MENU_NAME,
-    list: `/${SYSTEM_MENU_NAME}`,
-    meta: { icon: <SettingOutlined /> },
-  });
-});
-
-function App() {
-  const { t, i18n } = useTranslation();
-
-  const i18nProvider = {
-    translate: (key: string, defaultMessage?: string) => t(key, defaultMessage),
-    changeLocale: (lang: string) => i18n.changeLanguage(lang),
-    getLocale: () => i18n.language,
-  };
-
-  return (
-    <BrowserRouter>
-      <RefineKbarProvider>
-        <BusinessContextProvider>
-          <ColorModeContextProvider>
-            <Refine
-              resources={newResources}
-              notificationProvider={notificationProvider}
-              routerProvider={routerProvider}
-              i18nProvider={i18nProvider}
-              authProvider={authProvider}
-              auditLogProvider={auditLogProvider(dataProvider)}
-              dataProvider={{
-                default: dataProvider,
-              }}
-              options={{
-                syncWithLocation: true,
-                warnWhenUnsavedChanges: true,
-              }}
-            >
-              <Routes>
-                <Route
-                  path="/"
-                  element={
-                    <ThemedLayoutV2
-                      Sider={CustomSider}
-                      Title={() => null}
-                      Header={Header}
-                      OffLayoutArea={OffLayoutArea}
-                    >
-                      <Outlet />
-                    </ThemedLayoutV2>
-                  }
-                >
-                  <Route
-                    index
-                    element={<NavigateToResource resource="index" />}
-                  />
-                  <Route path="index" element={<Index />} />
-                  {newResources
-                    .filter((resource) => !resource?.meta?.parent)
-                    .map((resource) => {
-                      const {
-                        list: List,
-                        create: Create,
-                        edit: Edit,
-                        show: Show,
-                      } = resource?.meta?.components || {};
-                      return (
-                        <Route
-                          key={`/${resource.name}`}
-                          path={`/${resource.name}`}
-                        >
-                          {List ? <Route index element={<List />} /> : null}
-                          {Create ? (
-                            <Route path="create" element={<Create />} />
-                          ) : null}
-                          {Edit ? (
-                            <Route path="edit/:id" element={<Edit />} />
-                          ) : null}
-                          {Show ? (
-                            <Route path="show/:id" element={<Show />} />
-                          ) : null}
-                          {Edit ? (
-                            <Route path="clone/:id" element={<Edit />} />
-                          ) : null}
-                        </Route>
-                      );
-                    })}
-                  {[SYSTEM_MENU_NAME].map((name) => (
-                    <Route path={name}>
-                      {newResources
-                        .filter((resource) => resource?.meta?.parent === name)
-                        .map((resource) => {
-                          const {
-                            list: List,
-                            create: Create,
-                            edit: Edit,
-                            show: Show,
-                          } = resource?.meta?.components || {};
-
-                          return (
-                            <Route
-                              key={`${resource.name}`}
-                              path={`${resource.name}`}
-                            >
-                              {List ? <Route index element={<List />} /> : null}
-                              {Create ? (
-                                <Route path="create" element={<Create />} />
-                              ) : null}
-                              {Edit ? (
-                                <Route path="edit/:id" element={<Edit />} />
-                              ) : null}
-                              {Show ? (
-                                <Route path="show/:id" element={<Show />} />
-                              ) : null}
-                              {Edit ? (
-                                <Route path="clone/:id" element={<Edit />} />
-                              ) : null}
-                            </Route>
-                          );
-                        })}
-                    </Route>
-                  ))}
-                  <Route path="*" element={<ErrorComponent />} />
-                </Route>
-              </Routes>
-              <RefineKbar />
-              <UnsavedChangesNotifier />
-            </Refine>
-          </ColorModeContextProvider>
-        </BusinessContextProvider>
-      </RefineKbarProvider>
-    </BrowserRouter>
-  );
-}
-
-export default App;
+import React from "react";
+import { Refine } from "@refinedev/core";
+import {
+  notificationProvider,
+  ErrorComponent,
+} from "@refinedev/antd";
+import { RefineKbar, RefineKbarProvider } from "@refinedev/kbar";
+import routerProvider, {
+  NavigateToResource,
+  UnsavedChangesNotifier,
+} from "@refinedev/react-router-v6";
+import { BrowserRouter, Outlet, Route, Routes } from "react-router-dom";
+import { useTranslation } from "react-i18next";
+import { useMemo } from "react";
+import { Spin } from "antd";
+import { Layout } from "components/layout";
+import { ColorModeContextProvider } from "components/contexts/color-mode";
+import { BusinessContextProvider } from "components/contexts/business";
+import { AgentProvider, AgentPanel } from "components/agentPanel";
+import { authProvider } from "authProvider";
+import "@refinedev/antd/dist/reset.css";
+import "./styles/antd.css";
+import "./styles/fc.css";
+import "./styles/index.css";
+import { auditLogProvider } from "auditLogProvider";
+import { gadminCrudProvider as dataProvider } from "./helpers/login";
+import { useDynamicResources } from "hooks/useDynamicResources";
+import { renderRoutes } from "config/routeRegistry";
+
+const isDev = import.meta.env.DEV;
+
+// Wrapper component that only renders AgentProvider in development
+const DevAgentWrapper: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+  if (!isDev) return <>{children}</>;
+  return (
+    <AgentProvider>
+      {children}
+      <AgentPanel />
+    </AgentProvider>
+  );
+};
+
+function App() {
+  const { i18n } = useTranslation();
+
+  // Stable reference — i18n object identity never changes, so this memo runs once.
+  // i18n.t / i18n.language are called at invocation time, always returning fresh values.
+  const i18nProvider = useMemo(() => ({
+    translate: (key: string, defaultMessage?: string) => i18n.t(key, defaultMessage ?? ""),
+    changeLocale: (lang: string) => i18n.changeLanguage(lang),
+    getLocale: () => i18n.language,
+  }), [i18n]);
+
+  const resources = useDynamicResources();
+
+  return (
+    <BrowserRouter>
+      <RefineKbarProvider>
+        <BusinessContextProvider>
+          <ColorModeContextProvider>
+            <DevAgentWrapper>
+            <Refine
+              resources={resources}
+              notificationProvider={notificationProvider}
+              routerProvider={routerProvider}
+              i18nProvider={i18nProvider}
+              authProvider={authProvider}
+              auditLogProvider={auditLogProvider(dataProvider)}
+              dataProvider={{
+                default: dataProvider,
+              }}
+              options={{
+                syncWithLocation: true,
+                warnWhenUnsavedChanges: true,
+              }}
+            >
+              {resources.length === 0 ? (
+                <div style={{ display: "flex", justifyContent: "center", alignItems: "center", height: "100vh" }}>
+                  <Spin size="large" />
+                </div>
+              ) : (
+                <Routes>
+                  <Route
+                    path="/"
+                    element={
+                      <Layout>
+                        <Outlet />
+                      </Layout>
+                    }
+                  >
+                    <Route
+                      index
+                      element={<NavigateToResource resource={resources[0]?.name} />}
+                    />
+                    {renderRoutes()}
+                    <Route path="*" element={<ErrorComponent />} />
+                  </Route>
+                </Routes>
+              )}
+              <RefineKbar />
+              <UnsavedChangesNotifier />
+            </Refine>
+            </DevAgentWrapper>
+          </ColorModeContextProvider>
+        </BusinessContextProvider>
+      </RefineKbarProvider>
+    </BrowserRouter>
+  );
+}
+
+export default App;

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/auditLogProvider.ts

@@ -10,7 +10,7 @@ export function auditLogProvider(
   return {
     get: async ({ resource, meta, }) => {
       const { data } = await dataProvider.getList({
-        resource: "log",
+        resource: "audit",
         filters: [
           {
             field: "resource",
@@ -34,7 +34,7 @@ export function auditLogProvider(
           params.data.length === params?.meta?.ids.length
         ) {
           return dataProvider.createMany({
-            resource: "log",
+            resource: "audit",
             variables: params.data.map((item: any, index: number) => ({
               action: params.action,
               resource: params.resource,
@@ -49,7 +49,7 @@ export function auditLogProvider(
           });
         } else {
           return dataProvider.createMany({
-            resource: "log",
+            resource: "audit",
             variables: params.meta.ids.map((id: any) => ({
               action: params.action,
               resource: params.resource,
@@ -63,7 +63,7 @@ export function auditLogProvider(
         }
       }
       return dataProvider.create({
-        resource: "log",
+        resource: "audit",
         variables: {
           action: params.action,
           resource: params.resource,
@@ -77,7 +77,7 @@ export function auditLogProvider(
     },
     update: async ({ id, name }) => {
       const { data } = await dataProvider.update({
-        resource: "log",
+        resource: "audit",
         id,
         variables: { name },
       });

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/components/contexts/color-mode/index.tsx

@@ -1,60 +1,58 @@
 import { RefineThemes } from "@refinedev/antd";
-import { ConfigProvider, theme } from "antd";
-import { PropsWithChildren, createContext, useEffect, useState } from "react";
-
-type ColorModeContextType = {
-  mode: string;
-  setMode: (mode: string) => void;
+import { ConfigProvider } from "antd";
+import type { ThemeConfig } from "antd";
+import { PropsWithChildren } from "react";
+
+const themeConfig: ThemeConfig = {
+  ...RefineThemes.Blue,
+  token: {
+    ...RefineThemes.Blue.token,
+    colorPrimary: "#1677FF",
+    colorError: "#fa541c",
+    colorPrimaryText: "rgba(0, 0, 0, 0.85)",
+    colorTextSecondary: "rgba(0, 0, 0, 0.65)",
+    colorTextTertiary: "rgba(0, 0, 0, 0.45)",
+    colorBgContainer: "#F7F8F9",
+    colorBgLayout: "#F0F2F5",
+    colorBorderBg: "#E8E9EA",
+    borderRadius: 6,
+    fontFamily:
+      "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'",
+  },
+  components: {
+    Typography: {
+      colorText: "rgba(0, 0, 0, 0.85)",
+      colorTextDescription: "rgba(0, 0, 0, 0.65)",
+      colorTextDisabled: "rgba(0, 0, 0, 0.45)",
+    },
+    Card: {
+      colorBgContainer: "#FFFFFF",
+      headerBg: "#FAFAFA",
+    },
+    Table: {
+      colorBgContainer: "#fff",
+    },
+    Input: {
+      colorBgContainer: "#fff",
+    },
+    InputNumber: {
+      colorBgContainer: "#fff",
+    },
+    Select: {
+      colorBgContainer: "#fff",
+    },
+    Form: {
+      labelFontSize: 14,
+    },
+  },
 };
 
-export const ColorModeContext = createContext<ColorModeContextType>(
-  {} as ColorModeContextType
-);
-
 export const ColorModeContextProvider: React.FC<PropsWithChildren> = ({
   children,
 }) => {
-  // 优先默认使用light模式
-  const colorModeFromLocalStorage = localStorage.getItem("colorMode") || "light";
-  const isSystemPreferenceDark = window?.matchMedia(
-    "(prefers-color-scheme: dark)"
-  ).matches;
-
-  const systemPreference = isSystemPreferenceDark ? "dark" : "light";
-  const [mode, setMode] = useState(
-    colorModeFromLocalStorage || systemPreference
-  );
-
-  useEffect(() => {
-    window.localStorage.setItem("colorMode", mode);
-  }, [mode]);
-
-  const setColorMode = () => {
-    if (mode === "light") {
-      setMode("dark");
-    } else {
-      setMode("light");
-    }
-  };
-
-  const { darkAlgorithm, defaultAlgorithm } = theme;
-
   return (
-    <ColorModeContext.Provider
-      value={{
-        setMode: setColorMode,
-        mode,
-      }}
-    >
-      <ConfigProvider
-        // you can change the theme colors here. example: ...RefineThemes.Magenta,
-        theme={{
-          ...RefineThemes.Blue,
-          algorithm: mode === "light" ? defaultAlgorithm : darkAlgorithm,
-        }}
-      >
-        {children}
-      </ConfigProvider>
-    </ColorModeContext.Provider>
+    <ConfigProvider theme={themeConfig}>
+      {children}
+    </ConfigProvider>
   );
 };

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/components/custom-avatar.tsx

@@ -0,0 +1,38 @@
+import React, { memo } from "react";
+
+import type { AvatarProps } from "antd";
+import { Avatar as AntdAvatar } from "antd";
+
+import { getNameInitials, getRandomColorFromString } from "utilities";
+
+type Props = AvatarProps & {
+  name?: string;
+};
+
+const CustomAvatarComponent: React.FC<Props> = ({ name = "", style, ...rest }) => {
+  return (
+    <AntdAvatar
+      alt={name}
+      size="small"
+      style={{
+        backgroundColor: rest?.src
+          ? "transparent"
+          : getRandomColorFromString(name),
+        display: "flex",
+        alignItems: "center",
+        border: "none",
+        ...style,
+      }}
+      {...rest}
+    >
+      {getNameInitials(name)}
+    </AntdAvatar>
+  );
+};
+
+export const CustomAvatar = memo(
+  CustomAvatarComponent,
+  (prevProps, nextProps) => {
+    return prevProps.name === nextProps.name && prevProps.src === nextProps.src;
+  },
+);

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/components/index.ts

@@ -2,3 +2,7 @@ export * from './SearchBar';
 export * from './BulkActions';
 export * from './RowActions';
 export * from './ListPageHeader';
+export * from "./custom-avatar";
+export * from "./pagination-total";
+export * from "./tags";
+export * from "./text";

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/components/layout/{header/index.tsx → header.tsx}

@@ -1,20 +1,18 @@
 import { useGetLocale, useSetLocale, useGetIdentity } from "@refinedev/core";
 import {
-  Layout as AntdLayout,
+  Layout,
   Space,
   Button,
   Dropdown,
   Avatar,
   Typography,
   theme,
-  Switch,
   Select,
   Tooltip,
 } from "antd";
-import * as Icons from "@ant-design/icons";
+import { DownOutlined, RobotOutlined } from "@ant-design/icons";
 import { useTranslation } from "react-i18next";
 import { useContext } from "react";
-import { ColorModeContext } from "components/contexts/color-mode";
 import { BusinessContext } from "components/contexts/business";
 import { useAgent } from "components/agentPanel";
 import type { MenuProps } from "antd";
@@ -25,11 +23,10 @@ type IUser = {
   avatar: string;
 };
 
-const { DownOutlined, RobotOutlined } = Icons;
 const { Text } = Typography;
 const { useToken } = theme;
 
-const isDev = process.env.NODE_ENV === "development";
+const isDev = import.meta.env.DEV;
 
 export const Header: React.FC = () => {
   const { i18n } = useTranslation();
@@ -37,7 +34,6 @@ export const Header: React.FC = () => {
   const changeLanguage = useSetLocale();
   const { token } = useToken();
   const { data: user } = useGetIdentity<IUser>();
-  const { mode, setMode } = useContext(ColorModeContext);
   const { business, setBusiness, businessList } = useContext(BusinessContext);
   const agent = useAgent();
   const openAgentPanel = agent?.open;
@@ -58,17 +54,20 @@ export const Header: React.FC = () => {
     onClick: ({ key: lang }) => changeLanguage(lang),
   };
 
+  const headerStyles: React.CSSProperties = {
+    backgroundColor: token.colorBgElevated,
+    display: "flex",
+    justifyContent: "flex-end",
+    alignItems: "center",
+    padding: "0px 24px",
+    height: "64px",
+    position: "sticky",
+    top: 0,
+    zIndex: 999,
+  };
+
   return (
-    <AntdLayout.Header
-      style={{
-        backgroundColor: token.colorBgElevated,
-        display: "flex",
-        justifyContent: "flex-end",
-        alignItems: "center",
-        padding: "0px 24px",
-        height: "64px",
-      }}
-    >
+    <Layout.Header style={headerStyles}>
       {isDev && (
         <Tooltip title="AI Agent (Dev Only)">
           <Button
@@ -83,7 +82,7 @@ export const Header: React.FC = () => {
         showSearch
         defaultValue={business.gameId}
         style={{ width: 160 }}
-        bordered={false}
+        variant="borderless"
         options={[
           ...businessList.map((item) => ({
             label: item.gameName,
@@ -94,7 +93,7 @@ export const Header: React.FC = () => {
             options: [{ value: "-1", label: "All games" }],
           },
         ]}
-        optionFilterProp="label" // or "value"
+        optionFilterProp="label"
         onChange={(gameId) => {
           const gameInfo =
             gameId === "-1"
@@ -113,18 +112,10 @@ export const Header: React.FC = () => {
           </Space>
         </Button>
       </Dropdown>
-      <Space>
-        <Switch
-          checkedChildren="🌛"
-          unCheckedChildren="🔆"
-          onChange={() => setMode(mode === "light" ? "dark" : "light")}
-          defaultChecked={mode === "dark"}
-        />
-        <Space style={{ marginLeft: "8px" }} size="middle">
-          {user?.name && <Text strong>{user.name}</Text>}
-          {user?.avatar && <Avatar src={user?.avatar} alt={user?.name} />}
-        </Space>
+      <Space style={{ marginLeft: "8px" }} size="middle">
+        {user?.name && <Text strong>{user.name}</Text>}
+        {user?.avatar && <Avatar src={user?.avatar} alt={user?.name} />}
       </Space>
-    </AntdLayout.Header>
+    </Layout.Header>
   );
 };

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/components/layout/index.ts

@@ -1,2 +1,4 @@
 export { Header } from "./header";
-export { CustomSider } from "./sider";
+export { Sider } from "./sider";
+export { Layout } from "./layout";
+export { Title } from "./title";

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/components/layout/layout.tsx

@@ -0,0 +1,32 @@
+import React from "react";
+import { ThemedLayoutContextProvider } from "@refinedev/antd";
+import { Grid, Layout as AntdLayout } from "antd";
+import { Header } from "./header";
+import { Sider } from "./sider";
+import { OffLayoutArea } from "components/offLayoutArea";
+
+export const Layout: React.FC<React.PropsWithChildren> = ({ children }) => {
+  const breakpoint = Grid.useBreakpoint();
+  const isSmall = typeof breakpoint.sm === "undefined" ? true : breakpoint.sm;
+
+  return (
+    <ThemedLayoutContextProvider>
+      <AntdLayout hasSider style={{ minHeight: "100vh" }}>
+        <Sider />
+        <AntdLayout>
+          <Header />
+          <AntdLayout.Content
+            style={{
+              padding: isSmall ? 32 : 16,
+              height: "calc(100vh - 64px)",
+              overflowY: "auto",
+            }}
+          >
+            {children}
+          </AntdLayout.Content>
+        </AntdLayout>
+      </AntdLayout>
+      <OffLayoutArea />
+    </ThemedLayoutContextProvider>
+  );
+};