Merge pull request #5489 from marmelab/resource-context-scalar

Update the ResourceContext to store a scalar instead of an object

Author: djhi

packages/ra-core/src/controller/button/useDeleteWithConfirmController.tsx

@@ -79,7 +79,7 @@ const useDeleteWithConfirmController = (
         onSuccess,
         onFailure,
     } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const [open, setOpen] = useState(false);
     const notify = useNotify();
     const redirect = useRedirect();

packages/ra-core/src/controller/button/useDeleteWithUndoController.tsx

@@ -59,7 +59,7 @@ const useDeleteWithUndoController = (
         onSuccess,
         onFailure,
     } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const notify = useNotify();
     const redirect = useRedirect();
     const refresh = useRefresh();

packages/ra-core/src/controller/details/useCreateController.ts

@@ -111,7 +111,7 @@ export const useCreateController = <
         transform,
     } = props;
 
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const location = useLocation();
     const translate = useTranslate();
     const notify = useNotify();

packages/ra-core/src/controller/details/useEditController.ts

@@ -105,7 +105,7 @@ export const useEditController = <RecordType extends Record = Record>(
         onFailure,
         transform,
     } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const translate = useTranslate();
     const notify = useNotify();
     const redirect = useRedirect();

packages/ra-core/src/controller/details/useShowController.ts

@@ -59,7 +59,7 @@ export const useShowController = <RecordType extends Record = Record>(
 ): ShowControllerProps<RecordType> => {
     useCheckMinimumRequiredProps('Show', ['basePath', 'resource'], props);
     const { basePath, hasCreate, hasEdit, hasList, hasShow, id } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const translate = useTranslate();
     const notify = useNotify();
     const redirect = useRedirect();

packages/ra-core/src/controller/field/useReferenceArrayFieldController.ts

@@ -63,7 +63,7 @@ const useReferenceArrayFieldController = (
         sort: initialSort = defaultSort,
         source,
     } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const notify = useNotify();
     const ids = get(record, source) || [];
     const { data, error, loading, loaded } = useGetMany(reference, ids, {

packages/ra-core/src/controller/field/useReferenceManyFieldController.ts

@@ -80,7 +80,7 @@ const useReferenceManyFieldController = (
         perPage: initialPerPage,
         sort: initialSort = { field: 'id', order: 'DESC' },
     } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const notify = useNotify();
 
     // pagination logic

packages/ra-core/src/controller/input/useGetMatchingReferences.ts

@@ -48,7 +48,7 @@ export default (
         sort,
         id,
     } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const dispatch = useDispatch();
 
     useDeepCompareEffect(() => {

packages/ra-core/src/controller/input/useReferenceArrayInputController.ts

@@ -50,7 +50,7 @@ const useReferenceArrayInputController = (
         reference,
         source,
     } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const translate = useTranslate();
 
     // We store the current input value in a ref so that we are able to fetch

packages/ra-core/src/controller/input/useReferenceInputController.ts

@@ -76,7 +76,7 @@ export const useReferenceInputController = (
         sort: sortOverride,
         source,
     } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const translate = useTranslate();
 
     // pagination logic

packages/ra-core/src/controller/useListController.ts

@@ -118,7 +118,7 @@ const useListController = <RecordType extends Record = Record>(
         filter,
         debounce = 500,
     } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
 
     if (filter && isValidElement(filter)) {
         throw new Error(

packages/ra-core/src/core/Resource.tsx

@@ -71,7 +71,7 @@ const ResourceRoutes: FunctionComponent<ResourceProps> = ({
         }
 
         return (
-            <ResourceContextProvider value={resourceData}>
+            <ResourceContextProvider value={name}>
                 <Switch>
                     {create && (
                         <Route

packages/ra-core/src/core/ResourceContext.ts

@@ -10,7 +10,7 @@ import { createContext } from 'react';
  * import { useResource, useTranslate } from 'ra-core';
  *
  * const MyCustomEditTitle = props => {
- *     const { name } = useResource(props);
+ *     const name = useResource(props);
  *
  *     return (
  *         <h1>{translate(`${name}.name`)}</h1>
@@ -19,10 +19,4 @@ import { createContext } from 'react';
  */
 export const ResourceContext = createContext<ResourceContextValue>(undefined);
 
-export interface ResourceContextValue {
-    resource: string;
-    hasList: boolean;
-    hasEdit: boolean;
-    hasShow: boolean;
-    hasCreate: boolean;
-}
+export type ResourceContextValue = string;

packages/ra-core/src/core/useResourceContext.ts

@@ -10,15 +10,13 @@ import { ResourceContext, ResourceContextValue } from './ResourceContext';
  * @returns {ResourceContextValue} The resource
  */
 export const useResourceContext = <
-    ResourceInformationsType extends Partial<
-        ResourceContextValue
-    > = ResourceContextValue
+    ResourceInformationsType extends Partial<{ resource: string }>
 >(
     props: ResourceInformationsType
 ): ResourceContextValue => {
     const context = useContext(ResourceContext);
 
-    if (!context || !context.resource) {
+    if (!context) {
         /**
          * The element isn't inside a <ResourceContextProvider>
          *
@@ -30,8 +28,7 @@ export const useResourceContext = <
             );
         }
         // Ignored because resource is often optional (as it is injected) in components which passes the props to this hook
-        // @ts-ignore
-        return props;
+        return props.resource;
     }
 
     return context;

packages/ra-core/src/core/useResourceDefinition.ts

@@ -7,7 +7,7 @@ import { useResourceContext } from './useResourceContext';
  * Hook which returns the definition of the requested resource
  */
 export const useResourceDefinition = (props): ResourceDefinition => {
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const resources = useSelector(getResources);
 
     return resources.find(r => r?.name === resource) || props;

packages/ra-ui-materialui/src/button/BulkDeleteWithConfirmButton.tsx

@@ -55,7 +55,7 @@ const BulkDeleteWithConfirmButton: FC<BulkDeleteWithConfirmButtonProps> = props
     const unselectAll = useUnselectAll();
     const refresh = useRefresh();
     const translate = useTranslate();
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const [deleteMany, { loading }] = useDeleteMany(resource, selectedIds, {
         action: CRUD_DELETE_MANY,
         onSuccess: () => {

packages/ra-ui-materialui/src/button/BulkDeleteWithUndoButton.tsx

@@ -46,7 +46,7 @@ const BulkDeleteWithUndoButton: FC<BulkDeleteWithUndoButtonProps> = props => {
     const notify = useNotify();
     const unselectAll = useUnselectAll();
     const refresh = useRefresh();
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const [deleteMany, { loading }] = useDeleteMany(resource, selectedIds, {
         action: CRUD_DELETE_MANY,
         onSuccess: () => {

packages/ra-ui-materialui/src/button/DeleteWithConfirmButton.tsx

@@ -56,7 +56,7 @@ const DeleteWithConfirmButton: FC<DeleteWithConfirmButtonProps> = props => {
         onSuccess,
         onFailure,
     });
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
 
     return (
         <Fragment>

packages/ra-ui-materialui/src/button/DeleteWithUndoButton.tsx

@@ -31,7 +31,7 @@ const DeleteWithUndoButton: FC<DeleteWithUndoButtonProps> = props => {
         ...rest
     } = props;
     const classes = useStyles(props);
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const { loading, handleDelete } = useDeleteWithUndoController({
         record,
         resource,

packages/ra-ui-materialui/src/button/ExportButton.tsx

@@ -30,7 +30,7 @@ const ExportButton: FunctionComponent<ExportButtonProps> = props => {
         exporter: exporterFromContext,
         total,
     } = useListContext(props);
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const exporter = customExporter || exporterFromContext;
     const dataProvider = useDataProvider();
     const notify = useNotify();

packages/ra-ui-materialui/src/detail/ShowView.tsx

@@ -8,7 +8,6 @@ import {
     ShowControllerProps,
     useResourceDefinition,
     useShowContext,
-    useResourceContext,
 } from 'ra-core';
 
 import DefaultActions from './ShowActions';

packages/ra-ui-materialui/src/list/BulkDeleteAction.tsx

@@ -8,7 +8,7 @@ import { crudDeleteMany, startUndoable, useResourceContext } from 'ra-core';
  */
 const BulkDeleteAction = props => {
     const dispatch = useDispatch();
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
 
     useEffect(() => {
         if (process.env.NODE_ENV !== 'production') {

packages/ra-ui-materialui/src/list/Empty.tsx

@@ -34,7 +34,7 @@ const useStyles = makeStyles(
 
 const Empty: FC<EmptyProps> = props => {
     const { basePath } = useListContext(props);
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const classes = useStyles(props);
     const translate = useTranslate();
 

packages/ra-ui-materialui/src/list/ListActions.tsx

@@ -26,7 +26,7 @@ const ListActions: FC<ListActionsProps> = props => {
         showFilter,
         total,
     } = useListContext(props);
-    const { resource } = useResourceContext(rest);
+    const resource = useResourceContext(rest);
     const { hasCreate } = useResourceDefinition(rest);
     return useMemo(
         () => (

packages/ra-ui-materialui/src/list/ListGuesser.tsx

@@ -44,7 +44,7 @@ const ListGuesser: FC<ListProps> = props => {
 
 const ListViewGuesser: FC<ListViewProps> = props => {
     const { ids, data } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const [inferredChild, setInferredChild] = useState(null);
     useEffect(() => {
         if (ids.length > 0 && data && !inferredChild) {

packages/ra-ui-materialui/src/list/SingleFieldList.tsx

@@ -76,7 +76,7 @@ const SingleFieldList: FC<SingleFieldListProps> = props => {
         ...rest
     } = props;
     const { ids, data, loaded, basePath } = useListContext(props);
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
 
     const classes = useStyles(props);
 

packages/ra-ui-materialui/src/list/datagrid/DatagridHeaderCell.tsx

@@ -41,7 +41,7 @@ export const DatagridHeaderCell = (
         isSorting,
         ...rest
     } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const classes = useStyles(props);
     const translate = useTranslate();
 

packages/ra-ui-materialui/src/list/datagrid/DatagridRow.tsx

@@ -59,7 +59,7 @@ const DatagridRow: FC<DatagridRowProps> = React.forwardRef((props, ref) => {
         selectable,
         ...rest
     } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const [expanded, toggleExpanded] = useExpanded(resource, id);
     const [nbColumns, setNbColumns] = useState(
         computeNbColumns(expand, children, hasBulkActions)

packages/ra-ui-materialui/src/list/filter/FilterButtonMenuItem.tsx

@@ -7,7 +7,7 @@ import { FieldTitle, useResourceContext } from 'ra-core';
 const FilterButtonMenuItem = forwardRef<any, FilterButtonMenuItemProps>(
     (props, ref) => {
         const { filter, onShow } = props;
-        const { resource } = useResourceContext(props);
+        const resource = useResourceContext(props);
         const handleShow = useCallback(() => {
             onShow({
                 source: filter.props.source,

packages/ra-ui-materialui/src/list/filter/FilterFormInput.tsx

@@ -23,7 +23,7 @@ const useStyles = makeStyles(
 
 const FilterFormInput = props => {
     const { filterElement, handleHide, variant, margin } = props;
-    const { resource } = useResourceContext(props);
+    const resource = useResourceContext(props);
     const translate = useTranslate();
     const classes = useStyles(props);
     return (