react-toolkits 0.0.5 → 0.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-toolkits",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "sideEffects": [
     "**/*.css"
   ],

package/src/components/QueryList/index.tsx

@@ -1,72 +1,79 @@
 import { useHttpClient, usePermission } from '@/hooks'
-import { useQueryTriggerStore } from '@/stores'
+import { useQueryListStore } from '@/stores'
 import type { ListResponse, PaginationParams } from '@/types'
 import type { FormInstance, FormProps } from 'antd'
 import { Form, Result, Table } from 'antd'
 import type { TableProps } from 'antd/es/table'
 import type { AxiosRequestConfig } from 'axios'
 import type { ReactNode } from 'react'
-import { useCallback, useEffect, useState } from 'react'
+import { useCallback, useEffect } from 'react'
 import useSWRMutation from 'swr/mutation'
 import FilterForm from '../FilterForm'
 
 export type QueryListKey = Omit<AxiosRequestConfig, 'data' | 'params'>
 
-export interface QueryListProps<Item, Values>
+export interface QueryListProps<Item, Values, Response>
   extends Pick<TableProps<Item>, 'columns' | 'rowKey' | 'tableLayout' | 'expandable' | 'rowSelection' | 'bordered'>,
     Pick<FormProps<Values>, 'initialValues' | 'labelCol'> {
-  // 由于表单的值和分页数据是封装在组件内部的，不便于在组件外部构造 swr key，所以组件内部的 useSWRMutation hook 使用的 key 是排除了 arg 字段的。
-  // 因此 swr 的缓存并未发挥作用，同一个 key 的所有页面共享缓存。
+  // 由于表单的值和分页数据是封装在组件内部的，不便于在组件外部构造 swr key，
+  // 所以组件内部的 useSWRMutation hook 使用的 key 是不包含表单值和分页参数的。
+  // 因此 swr 并未按照分页缓存数据。
   swrKey: QueryListKey
   confirmText?: ReactNode
   code?: string
   renderForm?: (form: FormInstance<Values>) => ReactNode
   // 把表单的值和分页数据转换成请求参数
   transformArg?: (arg: Values & PaginationParams) => unknown
+  // 当请求的返回值不满足时进行转换
+  transformResponse?: (response: Response) => ListResponse<Item>
 }
 
-const QueryList = <Item extends object, Values = NonNullable<unknown>>(props: QueryListProps<Item, Values>) => {
-  const { code, confirmText, labelCol, swrKey, renderForm, transformArg, initialValues, ...tableProps } = props
+const QueryList = <Item extends object, Values = NonNullable<unknown>, Response = ListResponse<Item>>(
+  props: QueryListProps<Item, Values, Response>,
+) => {
+  const {
+    code,
+    confirmText,
+    labelCol,
+    swrKey,
+    initialValues,
+    renderForm,
+    transformArg,
+    transformResponse,
+    ...tableProps
+  } = props
   const { accessible } = usePermission(code ?? '')
   const [form] = Form.useForm<Values>()
-  const setTrigger = useQueryTriggerStore(state => state.setTrigger)
-
-  const [paginationData, setPaginationData] = useState<PaginationParams>({
-    page: 1,
-    perPage: 10,
-  })
+  const setRefresh = useQueryListStore(state => state.setRefresh)
+  const getPaginationData = useQueryListStore(state => state.getPaginationData)
+  const setPaginationData = useQueryListStore(state => state.setPaginationData)
+  const paginationData = getPaginationData(swrKey)
 
   const httpClient = useHttpClient()
 
   const { data, isMutating, trigger } = useSWRMutation(
     swrKey,
-    async (
-      key,
-      {
-        arg,
-      }: {
-        arg?: Partial<PaginationParams>
-      },
-    ) => {
+    async (key, { arg }: { arg?: Partial<PaginationParams> }) => {
       const newPaginationData = {
-        page: arg?.page ?? paginationData.page ?? 1,
-        perPage: arg?.perPage ?? paginationData.perPage ?? 10,
+        page: arg?.page ?? paginationData.page,
+        size: arg?.size ?? paginationData.size,
       }
 
-      setPaginationData(newPaginationData)
+      setPaginationData(swrKey, arg)
 
       const values = form.getFieldsValue()
 
-      const fetcherArg = {
+      const _arg = {
         ...values,
         ...newPaginationData,
       }
 
-      return httpClient.request<ListResponse<Item>>({
-        ...key,
-        [key.method === 'POST' ? 'data' : 'params']:
-          typeof transformArg === 'function' ? transformArg(fetcherArg) : fetcherArg,
-      })
+      return httpClient
+        .request<Response>({
+          ...key,
+          [key.method === 'POST' ? 'data' : 'params']: transformArg?.(_arg) ?? _arg,
+        })
+        .then(response => transformResponse?.(response) ?? (response as ListResponse<Item>))
     },
   )
 
@@ -88,15 +95,15 @@ const QueryList = <Item extends object, Values = NonNullable<unknown>>(props: Qu
     async (currentPage: number, currentSize: number) => {
       await trigger({
         page: currentPage,
-        perPage: currentSize,
+        size: currentSize,
       })
     },
     [trigger],
   )
 
   useEffect(() => {
-    setTrigger(swrKey, trigger)
-  }, [swrKey, trigger, setTrigger])
+    setRefresh(swrKey, trigger)
+  }, [swrKey, trigger, setRefresh])
 
   useEffect(() => {
     ;(async () => {
@@ -133,7 +140,7 @@ const QueryList = <Item extends object, Values = NonNullable<unknown>>(props: Qu
           showSizeChanger: true,
           showQuickJumper: true,
           current: paginationData.page,
-          pageSize: paginationData.perPage,
+          pageSize: paginationData.size,
           total: data?.Total,
           onChange: onPaginationChange,
         }}

package/src/features/permission/components/{PermissionList.tsx → PermissionList/index.tsx}

@@ -2,7 +2,7 @@ import { Checkbox, Collapse, Skeleton, Typography } from 'antd'
 import type { CheckboxChangeEvent } from 'antd/es/checkbox'
 import type { CheckboxValueType } from 'antd/es/checkbox/Group'
 import { useEffect, useState } from 'react'
-import { useAllPermissions } from '../hooks'
+import { useAllPermissions } from '../../hooks'
 
 const { Text } = Typography
 

package/src/pages/permission/{RoleList.tsx → RoleList/index.tsx}

@@ -3,12 +3,13 @@ import { useFormModal } from '@/components/FormModal/hooks'
 import type { Role, RoleListItem } from '@/features/permission'
 import { PermissionList, useCreateRole, useRemoveRole, useUpdateRole } from '@/features/permission'
 import { useHttpClient, usePermission } from '@/hooks'
-import { useQueryTriggerStore } from '@/stores'
+import { useQueryListStore } from '@/stores'
 import { UsergroupAddOutlined } from '@ant-design/icons'
 import type { TableColumnsType } from 'antd'
 import { App, Card, Form, Input, Space } from 'antd'
 import { useMemo } from 'react'
 import { Link } from 'react-router-dom'
+import type { ListResponse } from '@/types'
 
 export const swrKey = {
   url: '/api/usystem/role/list',
@@ -21,7 +22,7 @@ const RoleList = () => {
   const create = useCreateRole()
   const remove = useRemoveRole()
   const update = useUpdateRole()
-  const trigger = useQueryTriggerStore(state => state.trigger)
+  const refresh = useQueryListStore(state => state.refresh)
 
   const { showModal: showCreateModal, Modal: CreateModal } = useFormModal<{
     name: string
@@ -49,7 +50,7 @@ const RoleList = () => {
         {
           async onSuccess() {
             await message.success('角色创建成功')
-            trigger(swrKey)
+            refresh(swrKey, { page: 1 })
           },
         },
       )
@@ -87,7 +88,7 @@ const RoleList = () => {
         {
           async onSuccess() {
             await message.success('角色更新成功')
-            trigger(swrKey)
+            refresh(swrKey, { page: 1 })
           },
         },
       )
@@ -167,7 +168,7 @@ const RoleList = () => {
                         {
                           async onSuccess() {
                             await message.success('角色删除成功')
-                            trigger(swrKey)
+                            refresh(swrKey, { page: 1 })
                           },
                         },
                       )
@@ -182,7 +183,7 @@ const RoleList = () => {
         },
       },
     ],
-    [trigger, viewable, httpClient, modal, message, remove, showUpdateModal],
+    [refresh, viewable, httpClient, modal, message, remove, showUpdateModal],
   )
 
   return (
@@ -202,18 +203,15 @@ const RoleList = () => {
           </PermissionButton>
         }
       >
-        <QueryList
+        <QueryList<RoleListItem, NonNullable<unknown>, ListResponse<RoleListItem>>
           rowKey="name"
           columns={columns}
           code="200001"
           swrKey={swrKey}
-          transformArg={arg => {
-            const { page, perPage, ...restValues } = arg
-            return {
-              ...restValues,
-              page,
-              size: perPage,
-            }
+          // NOTE: 后端接口返回的数据不满足时转换一下
+          transformResponse={response => {
+            const { List, Total } = response
+            return { List, Total }
           }}
         />
       </Card>

package/src/pages/permission/{UserList.tsx → UserList/index.tsx}

@@ -2,7 +2,7 @@ import { Highlight, PermissionButton, QueryList } from '@/components'
 import { useFormModal } from '@/components/FormModal/hooks'
 import type { UserListItem } from '@/features/permission'
 import { useAllRoles, useCreateUser, useRemoveUser, useUpdateUser } from '@/features/permission'
-import { useQueryTriggerStore } from '@/stores'
+import { useQueryListStore } from '@/stores'
 import { UserAddOutlined } from '@ant-design/icons'
 import type { TableColumnsType } from 'antd'
 import { App, Card, Col, Form, Input, Row, Select, Space, Tag } from 'antd'
@@ -20,7 +20,7 @@ function useCreatingUserModal() {
   const { message } = App.useApp()
   const create = useCreateUser()
   const { data: roles, isLoading } = useAllRoles()
-  const trigger = useQueryTriggerStore(state => state.trigger)
+  const refresh = useQueryListStore(state => state.refresh)
 
   return useFormModal<{ id: string; name: string; roles: string[] }>({
     title: '创建角色',
@@ -49,7 +49,7 @@ function useCreatingUserModal() {
       await create.trigger(values, {
         onSuccess() {
           message.success('用户创建成功')
-          trigger(swrKey)
+          refresh(swrKey, { page: 1 })
         },
       })
     },
@@ -60,7 +60,7 @@ function useUpdatingUserModal() {
   const { message } = App.useApp()
   const update = useUpdateUser()
   const { data: roles, isLoading } = useAllRoles()
-  const trigger = useQueryTriggerStore(state => state.trigger)
+  const refresh = useQueryListStore(state => state.refresh)
 
   return useFormModal<{ id: string; name: string; roles: string[] }>({
     title: '更新角色',
@@ -92,7 +92,7 @@ function useUpdatingUserModal() {
       await update.trigger(values, {
         onSuccess() {
           message.success('用户更新成功')
-          trigger(swrKey)
+          refresh(swrKey, { page: 1 })
         },
       })
     },
@@ -102,7 +102,7 @@ function useUpdatingUserModal() {
 const UserList: FC = () => {
   const { modal, message } = App.useApp()
   const remove = useRemoveUser()
-  const trigger = useQueryTriggerStore(state => state.trigger)
+  const refresh = useQueryListStore(state => state.refresh)
   const { showModal: showCreatingModal, Modal: CreatingModal } = useCreatingUserModal()
   const { showModal: showUpdatingModal, Modal: UpdatingModal } = useUpdatingUserModal()
 
@@ -176,11 +176,13 @@ const UserList: FC = () => {
               onClick={() => {
                 modal.confirm({
                   title: '删除用户',
-                  content: <Highlight texts={[value.name]}>
-                    确定要删除用户&nbsp;
-                    {value.name}
-&nbsp;吗？
-                  </Highlight>,
+                  content: (
+                    <Highlight texts={[value.name]}>
+                      确定要删除用户&nbsp;
+                      {value.name}
+                      &nbsp;吗？
+                    </Highlight>
+                  ),
                   async onOk() {
                     await remove.trigger(
                       {
@@ -190,7 +192,7 @@ const UserList: FC = () => {
                       {
                         async onSuccess() {
                           await message.success('用户删除成功')
-                          trigger(swrKey)
+                          refresh(swrKey, { page: 1 })
                         },
                       },
                     )
@@ -204,7 +206,7 @@ const UserList: FC = () => {
         ),
       },
     ]
-  }, [trigger, remove, message, modal, showUpdatingModal])
+  }, [refresh, remove, message, modal, showUpdatingModal])
 
   return (
     <>
@@ -223,21 +225,7 @@ const UserList: FC = () => {
           </PermissionButton>
         }
       >
-        <QueryList
-          code="100001"
-          swrKey={swrKey}
-          rowKey="id"
-          columns={columns}
-          transformArg={arg => {
-            const { page, perPage, ...restValues } = arg
-
-            return {
-              ...(restValues ?? {}),
-              page,
-              size: perPage,
-            }
-          }}
-        />
+        <QueryList code="100001" swrKey={swrKey} rowKey="id" columns={columns} />
       </Card>
       {CreatingModal}
       {UpdatingModal}

package/src/stores/index.ts

@@ -1,3 +1,3 @@
 export * from './menu'
 export * from './token'
-export * from './queryTrigger'
+export * from './query-list'

package/src/stores/query-list.ts

@@ -0,0 +1,61 @@
+import type { QueryListKey } from '@/components/QueryList'
+import type { PaginationParams } from '@/types'
+import { create } from 'zustand'
+
+type RefreshFunction = (arg?: Partial<PaginationParams>) => void
+
+export interface QueryListState {
+  data: Map<
+    QueryListKey,
+    {
+      pagination?: PaginationParams
+      refresh?: RefreshFunction
+    }
+  >
+  getPaginationData: (key: QueryListKey) => PaginationParams
+  setPaginationData: (key: QueryListKey, pagination?: Partial<PaginationParams>) => void
+  refresh: (key: QueryListKey, arg?: Partial<PaginationParams>) => void
+  setRefresh: (key: QueryListKey, trigger: RefreshFunction) => void
+}
+
+export const useQueryListStore = create<QueryListState>((set, get) => ({
+  data: new Map(),
+  getPaginationData: (key: QueryListKey) => {
+    const pagination = get().data.get(key)?.pagination
+    return {
+      page: pagination?.page ?? 1,
+      size: pagination?.size ?? 10,
+    }
+  },
+  setPaginationData: (key: QueryListKey, pagination?: Partial<PaginationParams>) => {
+    set({
+      data: new Map(get().data).set(key, {
+        ...get().data.get(key),
+        pagination: {
+          page: pagination?.page ?? get().getPaginationData(key).page,
+          size: pagination?.size ?? get().getPaginationData(key).size,
+        },
+      }),
+    })
+  },
+  refresh: (key: QueryListKey, pagination?: Partial<PaginationParams>) => {
+    const refresh = get().data.get(key)?.refresh
+
+    if (refresh) {
+      refresh({
+        page: pagination?.page ?? get().getPaginationData(key).page,
+        size: pagination?.size ?? get().getPaginationData(key).size,
+      })
+    }
+  },
+  setRefresh: (key: QueryListKey, refresh: RefreshFunction) => {
+    const data = get().data
+
+    set({
+      data: new Map(data).set(key, {
+        ...data.get(key),
+        refresh,
+      }),
+    })
+  },
+}))

package/src/types/index.ts

@@ -1,10 +1,10 @@
 export interface ListResponse<T> {
   List: T[]
-  Page: number
+  Page?: number
   Total: number
 }
 
 export type PaginationParams = {
   page: number
-  perPage: number
+  size: number
 }

package/tsup.config.ts

@@ -1,14 +1,15 @@
 import type { Options } from 'tsup'
 import { defineConfig } from 'tsup'
+import * as process from 'process'
 
 export default defineConfig((options: Options) => ({
   entry: ['src/index.ts'],
+  format: ['esm'],
+  sourcemap: process.env.NODE_ENV !== 'production',
+  minify: process.env.NODE_ENV === 'production',
   treeshake: true,
   splitting: false,
-  format: ['esm'],
-  sourcemap: true,
   dts: true,
-  minify: false,
   clean: true,
   shims: true,
   external: ['react', 'react-dom'],

package/dist/index.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/styles/index.css"],"sourcesContent":["@import \"antd/dist/reset.css\";\n\n*, ::before, ::after{\n\n    --tw-border-spacing-x: 0;\n\n    --tw-border-spacing-y: 0;\n\n    --tw-translate-x: 0;\n\n    --tw-translate-y: 0;\n\n    --tw-rotate: 0;\n\n    --tw-skew-x: 0;\n\n    --tw-skew-y: 0;\n\n    --tw-scale-x: 1;\n\n    --tw-scale-y: 1;\n\n    --tw-pan-x:  ;\n\n    --tw-pan-y:  ;\n\n    --tw-pinch-zoom:  ;\n\n    --tw-scroll-snap-strictness: proximity;\n\n    --tw-gradient-from-position:  ;\n\n    --tw-gradient-via-position:  ;\n\n    --tw-gradient-to-position:  ;\n\n    --tw-ordinal:  ;\n\n    --tw-slashed-zero:  ;\n\n    --tw-numeric-figure:  ;\n\n    --tw-numeric-spacing:  ;\n\n    --tw-numeric-fraction:  ;\n\n    --tw-ring-inset:  ;\n\n    --tw-ring-offset-width: 0px;\n\n    --tw-ring-offset-color: #fff;\n\n    --tw-ring-color: rgb(59 130 246 / 0.5);\n\n    --tw-ring-offset-shadow: 0 0 #0000;\n\n    --tw-ring-shadow: 0 0 #0000;\n\n    --tw-shadow: 0 0 #0000;\n\n    --tw-shadow-colored: 0 0 #0000;\n\n    --tw-blur:  ;\n\n    --tw-brightness:  ;\n\n    --tw-contrast:  ;\n\n    --tw-grayscale:  ;\n\n    --tw-hue-rotate:  ;\n\n    --tw-invert:  ;\n\n    --tw-saturate:  ;\n\n    --tw-sepia:  ;\n\n    --tw-drop-shadow:  ;\n\n    --tw-backdrop-blur:  ;\n\n    --tw-backdrop-brightness:  ;\n\n    --tw-backdrop-contrast:  ;\n\n    --tw-backdrop-grayscale:  ;\n\n    --tw-backdrop-hue-rotate:  ;\n\n    --tw-backdrop-invert:  ;\n\n    --tw-backdrop-opacity:  ;\n\n    --tw-backdrop-saturate:  ;\n\n    --tw-backdrop-sepia:  \n}\n\n::backdrop{\n\n    --tw-border-spacing-x: 0;\n\n    --tw-border-spacing-y: 0;\n\n    --tw-translate-x: 0;\n\n    --tw-translate-y: 0;\n\n    --tw-rotate: 0;\n\n    --tw-skew-x: 0;\n\n    --tw-skew-y: 0;\n\n    --tw-scale-x: 1;\n\n    --tw-scale-y: 1;\n\n    --tw-pan-x:  ;\n\n    --tw-pan-y:  ;\n\n    --tw-pinch-zoom:  ;\n\n    --tw-scroll-snap-strictness: proximity;\n\n    --tw-gradient-from-position:  ;\n\n    --tw-gradient-via-position:  ;\n\n    --tw-gradient-to-position:  ;\n\n    --tw-ordinal:  ;\n\n    --tw-slashed-zero:  ;\n\n    --tw-numeric-figure:  ;\n\n    --tw-numeric-spacing:  ;\n\n    --tw-numeric-fraction:  ;\n\n    --tw-ring-inset:  ;\n\n    --tw-ring-offset-width: 0px;\n\n    --tw-ring-offset-color: #fff;\n\n    --tw-ring-color: rgb(59 130 246 / 0.5);\n\n    --tw-ring-offset-shadow: 0 0 #0000;\n\n    --tw-ring-shadow: 0 0 #0000;\n\n    --tw-shadow: 0 0 #0000;\n\n    --tw-shadow-colored: 0 0 #0000;\n\n    --tw-blur:  ;\n\n    --tw-brightness:  ;\n\n    --tw-contrast:  ;\n\n    --tw-grayscale:  ;\n\n    --tw-hue-rotate:  ;\n\n    --tw-invert:  ;\n\n    --tw-saturate:  ;\n\n    --tw-sepia:  ;\n\n    --tw-drop-shadow:  ;\n\n    --tw-backdrop-blur:  ;\n\n    --tw-backdrop-brightness:  ;\n\n    --tw-backdrop-contrast:  ;\n\n    --tw-backdrop-grayscale:  ;\n\n    --tw-backdrop-hue-rotate:  ;\n\n    --tw-backdrop-invert:  ;\n\n    --tw-backdrop-opacity:  ;\n\n    --tw-backdrop-saturate:  ;\n\n    --tw-backdrop-sepia:  \n}\n.container{\n\n    width: 100%\n}\n@media (min-width: 640px){\n\n    .container{\n\n        max-width: 640px\n    }\n}\n@media (min-width: 768px){\n\n    .container{\n\n        max-width: 768px\n    }\n}\n@media (min-width: 1024px){\n\n    .container{\n\n        max-width: 1024px\n    }\n}\n@media (min-width: 1280px){\n\n    .container{\n\n        max-width: 1280px\n    }\n}\n@media (min-width: 1536px){\n\n    .container{\n\n        max-width: 1536px\n    }\n}\n.fixed{\n\n    position: fixed\n}\n.absolute{\n\n    position: absolute\n}\n.relative{\n\n    position: relative\n}\n.-top-12{\n\n    top: -3rem\n}\n.left-0{\n\n    left: 0px\n}\n.right-0{\n\n    right: 0px\n}\n.top-1\\/2{\n\n    top: 50%\n}\n.mb-6{\n\n    margin-bottom: 1.5rem\n}\n.ml-2{\n\n    margin-left: 0.5rem\n}\n.ml-64{\n\n    margin-left: 16rem\n}\n.inline{\n\n    display: inline\n}\n.flex{\n\n    display: flex\n}\n.hidden{\n\n    display: none\n}\n.h-8{\n\n    height: 2rem\n}\n.h-screen{\n\n    height: 100vh\n}\n.w-8{\n\n    width: 2rem\n}\n.w-full{\n\n    width: 100%\n}\n.-translate-y-1\\/2{\n\n    --tw-translate-y: -50%;\n\n    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))\n}\n.transform{\n\n    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))\n}\n.items-end{\n\n    align-items: flex-end\n}\n.items-center{\n\n    align-items: center\n}\n.justify-end{\n\n    justify-content: flex-end\n}\n.justify-center{\n\n    justify-content: center\n}\n.overflow-auto{\n\n    overflow: auto\n}\n.bg-gray-50{\n\n    --tw-bg-opacity: 1;\n\n    background-color: rgb(249 250 251 / var(--tw-bg-opacity))\n}\n.p-6{\n\n    padding: 1.5rem\n}\n.px-6{\n\n    padding-left: 1.5rem;\n\n    padding-right: 1.5rem\n}\n.py-4{\n\n    padding-top: 1rem;\n\n    padding-bottom: 1rem\n}\n.text-center{\n\n    text-align: center\n}\n.text-lg{\n\n    font-size: 1.125rem;\n\n    line-height: 1.75rem\n}\n.font-bold{\n\n    font-weight: 700\n}\n.filter{\n\n    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)\n}\n"],"mappings":"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","names":[]}