muffin-admin 3.2.1 → 3.3.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "muffin-admin",
-  "version": "3.2.1",
+  "version": "3.3.12",
   "description": "NPM package for https://github.com/klen/muffin-admin",
   "files": [
     "src",
@@ -25,7 +25,7 @@
   "dependencies": {
     "js-cookie": "^3.0.5",
     "react": "^18.3.1",
-    "react-admin": "^4.16.18",
+    "react-admin": "^5.0.3",
     "react-dom": "^18.3.1",
     "validator": "^13.12.0"
   },

package/src/MuffinResourceList.tsx

@@ -2,6 +2,7 @@ import sortBy from "lodash/sortBy"
 import uniq from "lodash/uniq"
 import {
   BulkDeleteButton,
+  BulkExportButton,
   CreateButton,
   DatagridConfigurable,
   EditButton,
@@ -23,7 +24,6 @@ export function MuffinList() {
 
   const DataGrid = findBuilder(["list-grid", name])
   const Toolbar = findBuilder(["list-toolbar", name])
-  const BulkActions = findBuilder(["list-bulk-actions", name])
 
   return (
     <List
@@ -31,7 +31,6 @@ export function MuffinList() {
       perPage={limit}
       actions={<Toolbar />}
       filters={buildAdmin(["list-filters", name], filters)}
-      bulkActionButtons={<BulkActions />}
       pagination={
         <Pagination rowsPerPageOptions={sortBy(uniq([10, 25, 50, 100, limit, limitMax]))} />
       }
@@ -48,8 +47,12 @@ setupAdmin(["list-filters"], buildRA)
 function MuffinListDatagrid() {
   const { name, list } = useMuffinResourceOpts()
   const { fields, edit, show } = list
+  const BulkActions = findBuilder(["list-bulk-actions", name])
   return (
-    <DatagridConfigurable rowClick={show ? "show" : edit ? "edit" : false}>
+    <DatagridConfigurable
+      rowClick={show ? "show" : edit ? "edit" : false}
+      bulkActionButtons={<BulkActions />}
+    >
       {buildAdmin(["list-fields", name], fields)}
       {buildAdmin(["list-grid-buttons", name])}
     </DatagridConfigurable>
@@ -91,6 +94,7 @@ function MuffinListBulkActions() {
       {actions.map((props) => (
         <BulkActionButton key={props.id} {...props} />
       ))}
+      <BulkExportButton />
       {remove && <BulkDeleteButton />}
     </>
   )

package/src/buttons/ActionButton.tsx

@@ -1,4 +1,4 @@
-import { Button, useListContext, useRecordContext } from "react-admin"
+import { Button, useListContext, useRecordContext, useResourceContext } from "react-admin"
 
 import { useState } from "react"
 import { useAction } from "../hooks/useAction"
@@ -8,9 +8,10 @@ import { buildIcon, findBuilder } from "../utils"
 export function ActionButton({ icon, label, title, action, id }: AdminAction) {
   const [payloadActive, setPayloadActive] = useState(false)
   const record = useRecordContext()
-  const { mutate, isLoading } = useAction(action, {})
+  const resource = useResourceContext()
+  const { mutate, isPending } = useAction(action, {})
 
-  const PayloadBuilder = findBuilder(["action", "payload", id])
+  const PayloadBuilder = findBuilder(["action", "payload", id, resource])
 
   return (
     <>
@@ -18,7 +19,7 @@ export function ActionButton({ icon, label, title, action, id }: AdminAction) {
         label={label}
         title={title}
         onClick={() => (PayloadBuilder ? setPayloadActive(true) : mutate({ record }))}
-        disabled={isLoading}
+        disabled={isPending}
       >
         {buildIcon(icon)}
       </Button>
@@ -35,10 +36,11 @@ export function ActionButton({ icon, label, title, action, id }: AdminAction) {
 
 export function BulkActionButton({ label, icon, title, action, id }: AdminAction) {
   const { selectedIds } = useListContext()
-  const { mutate, isLoading } = useAction(action)
+  const { mutate, isPending } = useAction(action)
+  const resource = useResourceContext()
   const [payloadActive, setPayloadActive] = useState(false)
 
-  const PayloadBuilder = findBuilder(["action", "payload", id])
+  const PayloadBuilder = findBuilder(["action", "payload", id, resource])
 
   return (
     <>
@@ -46,7 +48,7 @@ export function BulkActionButton({ label, icon, title, action, id }: AdminAction
         label={label}
         title={title}
         onClick={() => (PayloadBuilder ? setPayloadActive(true) : mutate({ ids: selectedIds }))}
-        disabled={isLoading}
+        disabled={isPending}
       >
         {buildIcon(icon)}
       </Button>

package/src/hooks/useAction.ts

@@ -1,3 +1,4 @@
+import { UseMutationOptions, useMutation } from "@tanstack/react-query"
 import {
   useDataProvider,
   useNotify,
@@ -5,7 +6,6 @@ import {
   useResourceContext,
   useUnselectAll,
 } from "react-admin"
-import { UseMutationOptions, useMutation } from "react-query"
 import { MuffinDataprovider, TActionProps } from "../dataprovider"
 
 export function useAction(
@@ -17,7 +17,9 @@ export function useAction(
   const resource = useResourceContext()
   const unselectAll = useUnselectAll(resource)
   const dataProvider = useDataProvider() as ReturnType<typeof MuffinDataprovider>
-  return useMutation((params: TActionProps) => dataProvider.runAction(resource, action, params), {
+
+  return useMutation({
+    mutationFn: (params: TActionProps) => dataProvider.runAction(resource, action, params),
     onSuccess: ({ data }) => {
       if (data && data.message) notify(data.message, { type: "success" })
       if (data && data.redirectTo) window.location = data.redirectTo