react-toolkits 2.9.18 → 2.9.20

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # react-toolkits
 
+## 2.9.20
+
+### Patch Changes
+
+- 544ddbc: feat: add 'menuCollapsible' prop
+
+## 2.9.19
+
+### Patch Changes
+
+- 921deca: fix: app-id header is not right
+
 ## 2.9.18
 
 ### Patch Changes

package/lib/index.d.ts

@@ -5,7 +5,7 @@ import { ParagraphProps } from 'antd/es/typography/Paragraph';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { FormInstance, MenuProps, ButtonProps, ModalProps, FormProps } from 'antd';
 import { TableProps } from 'antd/es/table';
-import { MenuDividerType, MenuItemType, SubMenuType, MenuItemGroupType } from 'antd/es/menu/interface';
+import { ItemType, SubMenuType, MenuItemGroupType, MenuItemType } from 'antd/es/menu/interface';
 import { Merge } from 'ts-essentials';
 import * as zustand_middleware from 'zustand/middleware';
 import { StateStorage } from 'zustand/middleware';
@@ -124,6 +124,7 @@ type Locale = {
 interface ContextProps {
     locale: Locale;
     usePermissionApiV2: boolean;
+    gameApiV2: boolean;
     interceptor?: {
         response?: (response: Response, opts: RequestOptions) => Promise<any>;
     };
@@ -196,7 +197,7 @@ type SubMenuType2 = Merge<SubMenuType, {
 type MenuItemGroupType2 = Merge<MenuItemGroupType, {
     children?: NavMenuItem[];
 }>;
-type NavMenuItem = MenuItemType2 | SubMenuType2 | MenuItemGroupType2 | MenuDividerType | null;
+type NavMenuItem = Exclude<ItemType, SubMenuType | MenuItemGroupType | MenuItemType> | MenuItemType2 | SubMenuType2 | MenuItemGroupType2;
 
 interface NavMenuProps {
     items?: NavMenuItem[];
@@ -223,7 +224,6 @@ interface Game {
 }
 
 interface GameSelectProps {
-    apiV2?: boolean;
     filter?: (game: Game) => boolean;
     onGameChange?: (game: Game) => void;
 }
@@ -233,7 +233,7 @@ type HeaderExtra = {
     children: ReactNode;
 };
 interface LayoutProps extends Pick<GameSelectProps, 'filter' | 'onGameChange'> {
-    gameApiV2?: boolean;
+    menuCollapsible?: boolean;
     title?: ReactNode;
     items?: NavMenuItem[];
     hideGameSelect?: boolean;

package/lib/index.js

@@ -137,8 +137,9 @@ var init_Provider = __esm({
     init_en_GB();
     createContextStore = (initProps) => {
       const DEFAULT_PROPS = {
+        locale: en_GB_default,
         usePermissionApiV2: false,
-        locale: en_GB_default
+        gameApiV2: false
       };
       return createStore()((set) => ({
         ...DEFAULT_PROPS,
@@ -340,24 +341,23 @@ function checkChildren(children, permissions) {
 }
 function transformItems(items, permissions) {
   const result = [];
-  for (let i = 0; i < items.length; i++) {
-    if (items[i] === null) {
-      result[i] = null;
-    } else if (items[i].type === "divider") {
-      result[i] = { ...items[i] };
-    } else {
-      if (items[i].children) {
-        const { children, ...restProps } = items[i];
-        result[i] = checkChildren(children ?? [], permissions) ? {
-          ...restProps,
-          children: transformItems(children ?? [], permissions)
+  if (items) {
+    for (let i = 0; i < items.length; i++) {
+      if (items[i] === null || items[i].type === "divider") {
+        result[i] = items[i];
+      } else if (items[i].children) {
+        const { children, ...rest } = items[i];
+        result[i] = checkChildren(children, permissions) ? {
+          ...rest,
+          children: transformItems(children, permissions)
         } : null;
       } else {
-        const { route: route3, label, code, ...restProps } = items[i];
+        const { route: route3, label, code, ...rest } = items[i];
         const isPass = !code || !permissions || permissions[code];
+        const labelNode = route3 ? /* @__PURE__ */ jsx(Link, { to: route3, children: label }) : label;
         result[i] = isPass ? {
-          ...restProps,
-          label: withLink(label, route3)
+          ...rest,
+          label: labelNode
         } : null;
       }
     }
@@ -376,15 +376,8 @@ function flatItems(items, result = [], keypath = []) {
   }
   return result;
 }
-var withLink;
 var init_utils = __esm({
   "src/components/navMenu/utils.tsx"() {
-    withLink = (label, route3) => {
-      if (route3) {
-        return /* @__PURE__ */ jsx(Link, { to: route3, children: label });
-      }
-      return label;
-    };
   }
 });
 var NavMenu, NavMenu_default;
@@ -617,6 +610,7 @@ var init_stores2 = __esm({
   "src/components/layout/stores.ts"() {
     init_request();
     init_storage();
+    init_contextProvider();
     useLayoutStore = create()(
       persist(
         (set) => ({
@@ -637,7 +631,7 @@ var init_stores2 = __esm({
           isLoading: false,
           game: null,
           games: [],
-          async fetchGames({ apiV2 = false, forceUpdate = false } = {}) {
+          async fetchGames({ apiV2 = contextStore.getState().gameApiV2, forceUpdate = false } = {}) {
             if (!forceUpdate && get2().initialized) {
               return get2().games;
             }
@@ -673,13 +667,15 @@ var init_stores2 = __esm({
 var Text, GameSelect, GameSelect_default;
 var init_GameSelect = __esm({
   "src/components/layout/GameSelect.tsx"() {
+    init_contextProvider();
     init_locale();
     init_stores2();
     ({ Text } = Typography);
     GameSelect = (props) => {
-      const { apiV2, filter, onGameChange } = props;
+      const { filter, onGameChange } = props;
       const { t } = useTranslation();
       const { game, games, isLoading, fetchGames } = useGameStore();
+      const apiV2 = useToolkitsContext((state) => state.gameApiV2);
       useEffect(() => {
         fetchGames({ apiV2 });
       }, []);
@@ -733,7 +729,7 @@ var init_Layout = __esm({
     ({ Header, Sider, Content } = Antd2.Layout);
     Layout2 = (props) => {
       const {
-        gameApiV2,
+        menuCollapsible,
         title,
         items,
         headerExtra,
@@ -771,7 +767,7 @@ var init_Layout = __esm({
             children: [
               /* @__PURE__ */ jsxs("div", { className: "flex gap-2 px-6 py-4 overflow-hidden", children: [
                 /* @__PURE__ */ jsx(Logo_default, { width: 32, height: 32 }),
-                !collapsed && /* @__PURE__ */ jsx("div", { className: "h-8 flex items-center expand", children: title })
+                (!menuCollapsible || !collapsed) && /* @__PURE__ */ jsx("div", { className: "h-8 flex items-center expand", children: title })
               ] }),
               /* @__PURE__ */ jsx(NavMenu_default, { items })
             ]
@@ -787,7 +783,7 @@ var init_Layout = __esm({
               },
               children: /* @__PURE__ */ jsxs("div", { className: "flex justify-between items-center h-full", children: [
                 /* @__PURE__ */ jsxs(Space, { size: "small", split: /* @__PURE__ */ jsx(Divider, { type: "vertical" }), className: "mr-6", children: [
-                  /* @__PURE__ */ jsx(
+                  menuCollapsible && /* @__PURE__ */ jsx(
                     Button,
                     {
                       type: "text",
@@ -796,7 +792,7 @@ var init_Layout = __esm({
                       onClick: onCollapse
                     }
                   ),
-                  usePermissionApiV2 && !hideGameSelect && /* @__PURE__ */ jsx(GameSelect_default, { apiV2: gameApiV2, filter, onGameChange }),
+                  usePermissionApiV2 && !hideGameSelect && /* @__PURE__ */ jsx(GameSelect_default, { filter, onGameChange }),
                   headerExtra?.left?.map((extra) => /* @__PURE__ */ jsx("span", { children: extra.children }, extra.key))
                 ] }),
                 /* @__PURE__ */ jsxs(Space, { size: "small", split: /* @__PURE__ */ jsx(Divider, { type: "vertical" }), children: [
@@ -874,7 +870,7 @@ async function request(url, opts = {}) {
   if (!headers.has(APP_ID_HEADER_NAME) && contextStore.getState().usePermissionApiV2) {
     const game = useGameStore.getState().game;
     if (game) {
-      headers.set(APP_ID_HEADER_NAME, String(game.game_id ?? game.id));
+      headers.set(APP_ID_HEADER_NAME, String(contextStore.getState().gameApiV2 ? game.game_id : game.id));
     }
   }
   if (responseType === "blob") {
@@ -1110,7 +1106,7 @@ var init_QueryList = __esm({
       });
       const action = useRef(3 /* Init */);
       const { game } = useGameStore();
-      const usePermissionApiV2 = useToolkitsContext((state) => state.usePermissionApiV2);
+      const { gameApiV2, usePermissionApiV2 } = useToolkitsContext((state) => state);
       const [isValid, setIsValid] = useState(false);
       const { keyMap, getPayload, refetch } = useQueryListStore();
       const { page, size = defaultSize, formValue } = getPayload(route3);
@@ -1134,7 +1130,7 @@ var init_QueryList = __esm({
           if (isGlobal) {
             newHeaders.set(APP_ID_HEADER_NAME, "global");
           } else if (game) {
-            newHeaders.set(APP_ID_HEADER_NAME, String(game.id));
+            newHeaders.set(APP_ID_HEADER_NAME, String(gameApiV2 ? game.game_id : game.id));
           }
         }
         return newHeaders;