use new Hooks in ReferenceManyFieldCOntroller

marmelab · May 23, 2019 · 6ecc5b2 · 6ecc5b2
1 parent f526de9
commit 6ecc5b2
Show file tree

Hide file tree

Showing 5 changed files with 70 additions and 14 deletions.
diff --git a/packages/ra-core/src/controller/field/ReferenceManyFieldController.tsx b/packages/ra-core/src/controller/field/ReferenceManyFieldController.tsx
@@ -91,7 +91,7 @@ export const ReferenceManyFieldController: FunctionComponent<Props> = ({
     sort: initialSort,
     children,
 }) => {
-    const { sort, sortBy } = useSort(initialSort);
+    const { sort, setSort } = useSort(initialSort);
     const { page, perPage, setPage, setPerPage } = usePagination(
         initialPerPage
     );
@@ -124,7 +124,7 @@ export const ReferenceManyFieldController: FunctionComponent<Props> = ({
         referenceBasePath,
         setPage,
         setPerPage,
-        setSort: sortBy,
+        setSort,
         total,
     });
 };

diff --git a/packages/ra-core/src/controller/field/index.ts b/packages/ra-core/src/controller/field/index.ts
@@ -2,10 +2,12 @@ import ReferenceArrayFieldController from './ReferenceArrayFieldController';
 import ReferenceFieldController from './ReferenceFieldController';
 import ReferenceManyFieldController from './ReferenceManyFieldController';
 import useReference from './useReference';
+import useReferenceMany from './useReferenceMany';
 
 export {
     ReferenceArrayFieldController,
     ReferenceFieldController,
     useReference,
+    useReferenceMany,
     ReferenceManyFieldController,
 };
diff --git a/packages/ra-core/src/controller/index.ts b/packages/ra-core/src/controller/index.ts
@@ -8,6 +8,8 @@ import ListController from './ListController';
 import ShowController from './ShowController';
 import useRecordSelection from './useRecordSelection';
 import useVersion from './useVersion';
+import useSort from './useSort';
+import usePagination from './usePagination';
 export {
     getListControllerProps,
     sanitizeListRestProps,
@@ -17,6 +19,8 @@ export {
     ShowController,
     useRecordSelection,
     useVersion,
+    useSort,
+    usePagination,
 };
 
 export * from './field';

diff --git a/packages/ra-core/src/controller/useSort.ts b/packages/ra-core/src/controller/useSort.ts
@@ -6,6 +6,11 @@ import {
 } from '../reducer/admin/resource/list/queryReducer';
 import { Sort } from '../types';
 
+interface SortProps {
+    setSort: (field: string) => void;
+    sort: Sort;
+}
+
 const sortReducer = (state: Sort, field: string | Sort): Sort => {
     if (typeof field !== 'string') {
         return field;
@@ -17,15 +22,17 @@ const sortReducer = (state: Sort, field: string | Sort): Sort => {
     return { field, order };
 };
 
-export default (initialSort: Sort = { field: 'id', order: 'DESC' }) => {
+export default (
+    initialSort: Sort = { field: 'id', order: 'DESC' }
+): SortProps => {
     const [sort, dispatch] = useReducer(sortReducer, initialSort);
     useEffect(() => dispatch(initialSort), [
         initialSort.field,
         initialSort.order,
     ]);
 
     return {
-        sortBy: (field: string) => dispatch(field),
+        setSort: (field: string) => dispatch(field),
         sort,
     };
 };
diff --git a/packages/ra-ui-materialui/src/field/ReferenceManyField.js b/packages/ra-ui-materialui/src/field/ReferenceManyField.js
@@ -1,6 +1,6 @@
 import React, { Fragment, cloneElement, Children } from 'react';
 import PropTypes from 'prop-types';
-import { ReferenceManyFieldController, ComponentPropType } from 'ra-core';
+import { useSort, usePagination, useReferenceMany, ComponentPropType } from 'ra-core';
 
 export const ReferenceManyFieldView = ({
     children,
@@ -106,22 +106,65 @@ ReferenceManyFieldView.propTypes = {
  *    ...
  * </ReferenceManyField>
  */
-export const ReferenceManyField = ({ children, ...props }) => {
+export const ReferenceManyField = ({
+    children,
+    sort: initialSort,
+    perPage: initialPerPage,
+    resource,
+    reference,
+    record,
+    target,
+    filter,
+    source,
+    basePath,
+    ...props
+}) => {
     if (React.Children.count(children) !== 1) {
         throw new Error(
             '<ReferenceManyField> only accepts a single child (like <Datagrid>)'
         );
     }
+    const { sort, setSort } = useSort(initialSort);
+    const { page, perPage, setPage, setPerPage } = usePagination(initialPerPage);
+
+    const {
+        data,
+        ids,
+        loadedOnce,
+        referenceBasePath,
+        total,
+    } = useReferenceMany({
+        resource,
+        reference,
+        record,
+        target,
+        filter,
+        source,
+        basePath,
+        page,
+        perPage,
+        sort,
+    });
 
     return (
-        <ReferenceManyFieldController {...props}>
-            {controllerProps => (
-                <ReferenceManyFieldView
-                    {...props}
-                    {...{ children, ...controllerProps }}
-                />
-            )}
-        </ReferenceManyFieldController>
+        <ReferenceManyFieldView
+            {...props}
+            {...{
+                children,
+                currentSort: sort,
+                data,
+                ids,
+                loadedOnce,
+                page,
+                perPage,
+                reference,
+                setPage,
+                setPerPage,
+                referenceBasePath,
+                total,
+                setSort
+            }}
+        />
     );
 };