muffin-admin 2.5.3 → 2.6.0

package/dist/types.d.ts

@@ -25,6 +25,7 @@ export type AdminShowProps = {
     actions: AdminAction[];
     fields: AdminField[];
     links: [string, AdminShowLink][];
+    edit?: boolean;
 };
 export type AdminResourceProps = {
     name: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "muffin-admin",
-  "version": "2.5.3",
+  "version": "2.6.0",
   "description": "NPM package for https://github.com/klen/muffin-admin",
   "files": [
     "src",

package/src/MuffinResourceEdit.tsx

@@ -30,14 +30,22 @@ export function MuffinResourceEdit(props: AdminResourceProps["edit"]) {
       mutationMode={mutationMode || "optimistic"}
       {...opts}
     >
-      <SimpleForm toolbar={
-        <Toolbar>
-          <SaveButton />
-          {remove && <DeleteButton sx={{
-            marginLeft: "auto",
-          }} />}
-        </Toolbar>
-      }>{buildAdmin(["edit-inputs", resourceName], inputs)}</SimpleForm>
+      <SimpleForm
+        toolbar={
+          <Toolbar>
+            <SaveButton />
+            {remove && (
+              <DeleteButton
+                sx={{
+                  marginLeft: "auto",
+                }}
+              />
+            )}
+          </Toolbar>
+        }
+      >
+        {buildAdmin(["edit-inputs", resourceName], inputs)}
+      </SimpleForm>
     </Edit>
   )
 }

package/src/MuffinResourceShow.tsx

@@ -9,7 +9,7 @@ import {
 import { LinkAction } from "./actions"
 import { buildRA } from "./buildRA"
 import { ActionButton } from "./buttons"
-import { AdminShowProps } from "./types"
+import { AdminAction, AdminShowProps } from "./types"
 import { buildAdmin, setupAdmin } from "./utils"
 
 export function MuffinResourceShow(props: AdminShowProps) {
@@ -23,17 +23,21 @@ export function MuffinResourceShow(props: AdminShowProps) {
 
 setupAdmin(["show"], (props) => <MuffinResourceShow {...props} />)
 setupAdmin(["show-fields"], ({ fields }) => buildRA(fields))
-setupAdmin(["show-actions"], ({ actions, links, edit }) => (
-  <TopToolbar>
-    <div style={{ marginRight: "auto" }}>
-      {links.map(([key, props]) => (
-        <LinkAction key={key} resource={key} {...props} />
-      ))}
-    </div>
-    {actions.map((props, idx) => (
-      <ActionButton key={idx} {...props} />
-    ))}
-    <ListButton />
-    {edit && <EditButton />}
-  </TopToolbar>
-))
+setupAdmin(["record-actions"], (actions: AdminAction[]) =>
+  actions.map((props, idx) => <ActionButton key={idx} {...props} />)
+)
+setupAdmin(["show-actions"], ({ actions, links, edit }: AdminShowProps) => {
+  const resourceName = useResourceContext()
+  return (
+    <TopToolbar>
+      <div style={{ marginRight: "auto" }}>
+        {links.map(([key, props]) => (
+          <LinkAction key={key} resource={key} {...props} />
+        ))}
+      </div>
+      {buildAdmin(["record-actions", resourceName], actions)}
+      <ListButton />
+      {edit && <EditButton />}
+    </TopToolbar>
+  )
+})

package/src/buttons/ActionButton.tsx

@@ -10,14 +10,15 @@ import {
 
 import { useState } from "react"
 import { useAction } from "../hooks/useAction"
+import { AdminAction } from "../types"
 import { buildIcon, findBuilder } from "../utils"
 
-export function BulkActionButton({ label, icon, title, action }) {
+export function BulkActionButton({ label, icon, title, action }: AdminAction) {
   const resource = useResourceContext()
   const { selectedIds } = useListContext()
   const [payloadActive, setPayloadActive] = useState(false)
 
-  const PayloadBuilder = findBuilder(["action", "payload", action])
+  const PayloadBuilder = findBuilder(["action", "payload", label])
 
   const refresh = useRefresh(),
     unselectAll = useUnselectAll(resource),
@@ -25,7 +26,7 @@ export function BulkActionButton({ label, icon, title, action }) {
 
   const { mutate, isLoading } = useAction(action)
 
-  const process = (payload) =>
+  const process = (payload?) =>
     mutate(
       { ids: selectedIds, payload },
       {
@@ -48,7 +49,7 @@ export function BulkActionButton({ label, icon, title, action }) {
       <Button
         label={label}
         title={title}
-        onClick={PayloadBuilder ? () => setPayloadActive(true) : process}
+        onClick={() => (PayloadBuilder ? setPayloadActive(true) : process())}
         disabled={isLoading}
       >
         {buildIcon(icon)}
@@ -64,18 +65,18 @@ export function BulkActionButton({ label, icon, title, action }) {
   )
 }
 
-export function ActionButton({ icon, label, title, action }) {
+export function ActionButton({ icon, label, title, action }: AdminAction) {
   const [payloadActive, setPayloadActive] = useState(false)
 
   const record = useRecordContext()
   const { mutate, isLoading } = useAction(action)
 
-  const PayloadBuilder = findBuilder(["action", "payload", action])
+  const PayloadBuilder = findBuilder(["action", "payload", label])
 
   const refresh = useRefresh(),
     notify = useNotify()
 
-  const process = (payload) =>
+  const process = (payload?) =>
     mutate(
       { record, payload },
       {
@@ -95,7 +96,7 @@ export function ActionButton({ icon, label, title, action }) {
       <Button
         label={label}
         title={title}
-        onClick={PayloadBuilder ? () => setPayloadActive(true) : process}
+        onClick={() => (PayloadBuilder ? setPayloadActive(true) : process())}
         disabled={isLoading}
       >
         {buildIcon(icon)}

package/src/types.ts

@@ -23,6 +23,7 @@ export type AdminShowProps = {
   actions: AdminAction[]
   fields: AdminField[]
   links: [string, AdminShowLink][]
+  edit?: boolean
 }
 
 export type AdminResourceProps = {
@@ -31,12 +32,12 @@ export type AdminResourceProps = {
   label: string
   create: AdminInput[] | false
   edit:
-  | {
-    actions: AdminAction[]
-    inputs: AdminInput[]
-    remove?: boolean
-  }
-  | false
+    | {
+        actions: AdminAction[]
+        inputs: AdminInput[]
+        remove?: boolean
+      }
+    | false
   list: {
     limit: number
     limitMax: number