@gadmin2n/schematics 0.0.139 → 0.0.141

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/resource/Components/modal.tsx

@@ -42,7 +42,7 @@ export const ResourceFormModal: React.FC<Props> = ({
   });
 
   // Fetch all resources for code duplication check
-  const { data: resourcesData } = useList<Resource>({
+  const { result: resourcesData } = useList<Resource>({
     resource: 'resource',
     pagination: {
       mode: 'off',

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/resource/list.tsx

@@ -1,6 +1,6 @@
 import React, { useState, useMemo } from 'react';
 import { useTable, FilterDropdown } from '@refinedev/antd';
-import { Table, Button, Space, Tooltip, Input, Typography } from 'antd';
+import { Table, Button, Card, Space, Tooltip, Input } from 'antd';
 import {
   EditOutlined,
   EyeOutlined,
@@ -17,6 +17,8 @@ import { EditModal } from './Components/EditModal';
 import { CreateModal } from './Components/CreateModal';
 import { ResourceDetailDrawer } from './Components/ResourceDetailDrawer';
 import { SqlModal, generateResourceSql } from '../../components/SqlModal';
+import { PageHeader } from 'components';
+import { PAGE_WRAPPER_STYLE } from 'constants/layout';
 
 // System resources that cannot be modified (use Set for O(1) lookup performance)
 // System resources that cannot be modified
@@ -31,11 +33,11 @@ export const PROTECTED_RESOURCES = [
 
 export const ResourceManagementListPage: React.FC = () => {
   const { data: identity } = useGetIdentity<any>();
-  const { tableProps, filters, tableQueryResult } = useTable<
-    Resource,
-    HttpError,
-    Partial<Resource>
-  >({
+  const {
+    tableProps,
+    filters,
+    tableQuery: tableQueryResult,
+  } = useTable<Resource, HttpError, Partial<Resource>>({
     resource: 'resource',
     syncWithLocation: false, // Disable URL sync to keep URL clean
     pagination: {
@@ -116,119 +118,114 @@ export const ResourceManagementListPage: React.FC = () => {
   };
 
   return (
-    <div>
-      <div
-        style={{
-          display: 'flex',
-          justifyContent: 'space-between',
-          alignItems: 'center',
-          marginBottom: 16,
-        }}
-      >
-        <Typography.Title level={4} style={{ margin: 0 }}>
-          Resource mgnts
-        </Typography.Title>
-        <Button
-          type="primary"
-          onClick={() =>
-            setShowModal({
-              type: 'create',
-              id: null,
-            })
-          }
-        >
-          Create Resource
-        </Button>
-      </div>
-      <Table {...tableProps} rowKey="id">
-        <Table.Column
-          dataIndex="code"
-          title="Code"
-          sorter={(a: Resource, b: Resource) => a.code.localeCompare(b.code)}
-          defaultFilteredValue={getDefaultFilter('code', filters, 'contains')}
-          filterDropdown={(props) => (
-            <FilterDropdown
-              {...props}
-              clearFilters={() => {
-                props.setSelectedKeys([]);
-                props.confirm?.();
-              }}
-            >
-              <Input placeholder="Search Code" />
-            </FilterDropdown>
-          )}
-          filterIcon={<SearchOutlined />}
-        />
-        <Table.Column
-          dataIndex="name"
-          title="Name"
-          sorter={(a: Resource, b: Resource) => a.name.localeCompare(b.name)}
-          defaultFilteredValue={getDefaultFilter('name', filters, 'contains')}
-          filterDropdown={(props) => (
-            <FilterDropdown
-              {...props}
-              clearFilters={() => {
-                props.setSelectedKeys([]);
-                props.confirm?.();
-              }}
-            >
-              <Input placeholder="Search Name" />
-            </FilterDropdown>
-          )}
-          filterIcon={<SearchOutlined />}
-        />
-        <Table.Column dataIndex="description" title="Description" />
-        <Table.Column
-          dataIndex="creator"
-          title="Creator"
-          sorter={(a: Resource, b: Resource) =>
-            (a.creator || '').localeCompare(b.creator || '')
-          }
-        />
-        <Table.Column
-          title="Actions"
-          render={(_, record: Resource) => {
-            const isProtected = protectedResourcesMap.get(record.id) || false;
-            return (
-              <Space>
-                <Tooltip title="View details">
-                  <Button
-                    type="default"
-                    size="small"
-                    icon={<EyeOutlined />}
-                    onClick={() => setDrawerResource(record)}
-                  />
-                </Tooltip>
-                <Tooltip
-                  title={
-                    isProtected
-                      ? 'This is a system resource and cannot be modified'
-                      : 'Edit'
-                  }
-                >
-                  <Button
-                    type="default"
-                    size="small"
-                    icon={<EditOutlined />}
-                    disabled={isProtected}
-                    onClick={() =>
-                      setShowModal({ type: 'edit', id: record.id })
+    <div style={PAGE_WRAPPER_STYLE}>
+      <PageHeader
+        title="Resource mgnts"
+        extra={
+          <Button
+            type="primary"
+            onClick={() =>
+              setShowModal({
+                type: 'create',
+                id: null,
+              })
+            }
+          >
+            Create Resource
+          </Button>
+        }
+      />
+      <Card className="card-table">
+        <Table {...tableProps} rowKey="id">
+          <Table.Column
+            dataIndex="code"
+            title="Code"
+            sorter={(a: Resource, b: Resource) => a.code.localeCompare(b.code)}
+            defaultFilteredValue={getDefaultFilter('code', filters, 'contains')}
+            filterDropdown={(props) => (
+              <FilterDropdown
+                {...props}
+                clearFilters={() => {
+                  props.setSelectedKeys([]);
+                  props.confirm?.();
+                }}
+              >
+                <Input placeholder="Search Code" />
+              </FilterDropdown>
+            )}
+            filterIcon={<SearchOutlined />}
+          />
+          <Table.Column
+            dataIndex="name"
+            title="Name"
+            sorter={(a: Resource, b: Resource) => a.name.localeCompare(b.name)}
+            defaultFilteredValue={getDefaultFilter('name', filters, 'contains')}
+            filterDropdown={(props) => (
+              <FilterDropdown
+                {...props}
+                clearFilters={() => {
+                  props.setSelectedKeys([]);
+                  props.confirm?.();
+                }}
+              >
+                <Input placeholder="Search Name" />
+              </FilterDropdown>
+            )}
+            filterIcon={<SearchOutlined />}
+          />
+          <Table.Column dataIndex="description" title="Description" />
+          <Table.Column
+            dataIndex="creator"
+            title="Creator"
+            sorter={(a: Resource, b: Resource) =>
+              (a.creator || '').localeCompare(b.creator || '')
+            }
+          />
+          <Table.Column
+            title="Actions"
+            render={(_, record: Resource) => {
+              const isProtected = protectedResourcesMap.get(record.id) || false;
+              return (
+                <Space>
+                  <Tooltip title="View details">
+                    <Button
+                      type="default"
+                      size="small"
+                      icon={<EyeOutlined />}
+                      onClick={() => setDrawerResource(record)}
+                    />
+                  </Tooltip>
+                  <Tooltip
+                    title={
+                      isProtected
+                        ? 'This is a system resource and cannot be modified'
+                        : 'Edit'
                     }
-                  />
-                </Tooltip>
-                <Tooltip title="Generate SQL">
-                  <Button
-                    type="default"
-                    size="small"
-                    icon={<CodeOutlined />}
-                    onClick={() => handleShowSql(record)}
-                  />
-                </Tooltip>
-              </Space>
-            );
-          }}
-        />
-      </Table>
+                  >
+                    <Button
+                      type="default"
+                      size="small"
+                      icon={<EditOutlined />}
+                      disabled={isProtected}
+                      onClick={() =>
+                        setShowModal({ type: 'edit', id: record.id })
+                      }
+                    />
+                  </Tooltip>
+                  <Tooltip title="Generate SQL">
+                    <Button
+                      type="default"
+                      size="small"
+                      icon={<CodeOutlined />}
+                      onClick={() => handleShowSql(record)}
+                    />
+                  </Tooltip>
+                </Space>
+              );
+            }}
+          />
+        </Table>
+      </Card>
       {showModal.type === 'edit' && showModal.id && (
         <EditModal
           id={showModal.id}

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/role/Components/modal.tsx

@@ -98,7 +98,7 @@ export const RoleFormModal: React.FC<Props> = ({
   });
 
   // Fetch all roles for name duplication check
-  const { data: rolesData } = useList<Role>({
+  const { result: rolesData } = useList<Role>({
     resource: 'role',
     pagination: {
       mode: 'off',

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/role/list.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useMemo, useState } from 'react';
 import { useTable } from '@refinedev/antd';
 import { useGetLocale, useGetIdentity } from '@refinedev/core';
-import { Table, Button, Space, Tooltip, message, Typography } from 'antd';
+import { Table, Button, Card, Space, Tooltip, message } from 'antd';
 
 import { EditModal } from './Components/EditModal';
 import { CreateModal } from './Components/CreateModal';
@@ -12,6 +12,8 @@ import { RoleDetailDrawer } from './Components/RoleDetailDrawer';
 import { SqlModal, generateRoleSql } from '../../components/SqlModal';
 import { customRequest } from '@/helpers/http';
 import { buildPageTree } from '@/helpers/page-tree';
+import { PageHeader } from 'components';
+import { PAGE_WRAPPER_STYLE } from 'constants/layout';
 
 type RolePageInfo = {
   id: number;
@@ -27,8 +29,6 @@ type RolePermissionSummary = {
   actions: string[];
 };
 
-const PAGE_NAME_DISPLAY_LIMIT = 40;
-
 const normalizeToNumber = (value: unknown): number | null => {
   if (typeof value === 'number' && !Number.isNaN(value)) {
     return value;
@@ -302,7 +302,7 @@ export const RoleManagementListPage: React.FC = () => {
       });
       setSqlModal({ open: true, title: `SQL — Role: ${record.name}`, sql });
     },
-    [rolePermissionSummary],
+    [rolePermissionSummary, identity],
   );
 
   const refreshRoleRelatedData = useCallback(() => {
@@ -320,66 +320,63 @@ export const RoleManagementListPage: React.FC = () => {
   }, [refreshRoleRelatedData, handleModalClose]);
 
   return (
-    <div>
-      <div
-        style={{
-          display: 'flex',
-          justifyContent: 'space-between',
-          alignItems: 'center',
-          marginBottom: 16,
-        }}
-      >
-        <Typography.Title level={4} style={{ margin: 0 }}>
-          Role mgnts
-        </Typography.Title>
-        <Button
-          type="primary"
-          onClick={() =>
-            setShowModal({
-              type: 'create',
-              id: null,
-            })
-          }
-        >
-          Create Role
-        </Button>
-      </div>
-      <Table {...tableProps} rowKey="id">
-        <Table.Column dataIndex="name" title="Name" />
-        <Table.Column dataIndex="description" title="Description" />
-        <Table.Column dataIndex="creator" title="Creator" />
-        <Table.Column
-          title="Actions"
-          render={(_, record: any) => (
-            <Space>
-              <Tooltip title="View details">
-                <Button
-                  type="default"
-                  size="small"
-                  icon={<EyeOutlined />}
-                  onClick={() => setDrawerRole(record)}
-                />
-              </Tooltip>
-              <Tooltip title="Edit">
-                <Button
-                  type="default"
-                  size="small"
-                  icon={<EditOutlined />}
-                  onClick={() => setShowModal({ type: 'edit', id: record.id })}
-                />
-              </Tooltip>
-              <Tooltip title="Generate SQL">
-                <Button
-                  type="default"
-                  size="small"
-                  icon={<CodeOutlined />}
-                  onClick={() => handleShowSql(record)}
-                />
-              </Tooltip>
-            </Space>
-          )}
-        />
-      </Table>
+    <div style={PAGE_WRAPPER_STYLE}>
+      <PageHeader
+        title="Role mgnts"
+        extra={
+          <Button
+            type="primary"
+            onClick={() =>
+              setShowModal({
+                type: 'create',
+                id: null,
+              })
+            }
+          >
+            Create Role
+          </Button>
+        }
+      />
+      <Card className="card-table">
+        <Table {...tableProps} rowKey="id">
+          <Table.Column dataIndex="name" title="Name" />
+          <Table.Column dataIndex="description" title="Description" />
+          <Table.Column dataIndex="creator" title="Creator" />
+          <Table.Column
+            title="Actions"
+            render={(_, record: any) => (
+              <Space>
+                <Tooltip title="View details">
+                  <Button
+                    type="default"
+                    size="small"
+                    icon={<EyeOutlined />}
+                    onClick={() => setDrawerRole(record)}
+                  />
+                </Tooltip>
+                <Tooltip title="Edit">
+                  <Button
+                    type="default"
+                    size="small"
+                    icon={<EditOutlined />}
+                    onClick={() =>
+                      setShowModal({ type: 'edit', id: record.id })
+                    }
+                  />
+                </Tooltip>
+                <Tooltip title="Generate SQL">
+                  <Button
+                    type="default"
+                    size="small"
+                    icon={<CodeOutlined />}
+                    onClick={() => handleShowSql(record)}
+                  />
+                </Tooltip>
+              </Space>
+            )}
+          />
+        </Table>
+      </Card>
       {drawerRole && (
         <RoleDetailDrawer
           role={drawerRole}

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/user/components/show-drawer.tsx

@@ -56,7 +56,7 @@ export const ShowDrawer: React.FC<ShowDrawerProps> = ({ id, onClose }) => {
       loading={isLoading}
       width={756}
       styles={{
-        body: { background: '#f5f5f5', padding: 0 },
+        body: { background: 'var(--ant-color-bg-layout)', padding: 0 },
         header: { display: 'none' },
       }}
     >