muffin-admin 2.0.0 → 2.2.0

package/package.json

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

package/src/buildRA.tsx

@@ -37,7 +37,7 @@ import {
 import { AvatarField, EditableBooleanField, FKField, JsonField } from "./fields"
 import { FKInput, JsonInput } from "./inputs"
 
-const UI = {
+export const UI = {
   // Fields
   BooleanField,
   ChipField,

package/src/dataprovider.ts

@@ -66,8 +66,10 @@ export function MuffinDataprovider({ apiUrl }: AdminOpts) {
       return { data: ids }
     },
 
-    getMany: (resource, { ids }) => {
-      return methods.getList(resource, { filter: { id: { $in: ids } } })
+    getMany: (resource, props) => {
+      const { ids, meta } = props
+      const key = meta?.key || "id"
+      return methods.getList(resource, { filter: { [key]: { $in: ids } } })
     },
 
     getManyReference: async (resource, { target, id, filter, ...opts }) => {

package/src/fields/FKField.tsx

@@ -1,12 +1,18 @@
 import { ReferenceField, TextField } from "react-admin"
 
-export function FKField({ refSource, refID, link, reference, source, ...props }) {
+export function FKField({ reference, refSource, refKey, link, source, ...props }) {
   return (
-    <ReferenceField link={link || "show"} reference={reference} source={source} {...props}>
+    <ReferenceField
+      link={link || "show"}
+      reference={reference}
+      source={source}
+      queryOptions={{ meta: { key: refKey } }}
+      {...props}
+    >
       <>
         <TextField source={refSource} />
         {" (#"}
-        <TextField source={refID || "id"} />
+        <TextField source={refKey || "id"} />
         {")"}
       </>
     </ReferenceField>

package/src/inputs/FKInput.tsx

@@ -1,27 +1,23 @@
 import { AutocompleteInput, ReferenceInput } from "react-admin"
 
-export function FKInput({ refProp, refSource, fullWidth, reference, source, ...props }) {
-  const filterToQuery = (search) => {
-    const filters = {}
-    filters[refProp] = search
-    return filters
-  }
-
-  refSource = refSource || "id"
+export function FKInput({ refKey, refSource, fullWidth, reference, source, ...props }) {
+  // Bind to AutoCompleteInput if we want to customize the search
+  // const filterToQuery = (search) => {
+  //   const filters = {}
+  //   filters[refKey] = search
+  //   return filters
+  // }
 
+  refKey = refKey || "id"
   const renderText = (record) => {
-    const pk = record[refSource]
-    return (pk && `${record[refProp]} (#${pk})`) || ""
+    const pk = record[refKey]
+    if (refKey == refSource) return `#${pk}`
+    return (pk && `${record[refSource]} (#${pk})`) || ""
   }
 
   return (
-    <ReferenceInput reference={reference} source={source} filterToQuery={filterToQuery} {...props}>
-      <AutocompleteInput
-        source={refSource}
-        optionText={renderText}
-        fullWidth={fullWidth}
-        {...props}
-      />
+    <ReferenceInput reference={reference} source={source} {...props}>
+      <AutocompleteInput source={refKey} optionText={renderText} fullWidth={fullWidth} {...props} />
     </ReferenceInput>
   )
 }