diff --git a/packages/ra-core/src/core/useResourceContext.ts b/packages/ra-core/src/core/useResourceContext.ts index 2cefc09516e..e0a7e570137 100644 --- a/packages/ra-core/src/core/useResourceContext.ts +++ b/packages/ra-core/src/core/useResourceContext.ts @@ -5,9 +5,36 @@ import { ResourceContext, ResourceContextValue } from './ResourceContext'; * Hook to read the resource from the ResourceContext. * * Must be used within a (e.g. as a descendent of - * or any reference related components). + * or any reference related components), or called with a resource prop. * - * @returns {ResourceContextValue} The resource + * @example + * + * const ResourceName = (props) => { + * const { resource } = useResourceContext(props); + * const resourceName = translate(`resources.${resource}.name`, { + * smart_count: 1, + * _: inflection.humanize(inflection.singularize(resource)), + * }); + * return <>{resourceName}; + * } + * + * // use it in a resource context + * const MyComponent = () => ( + * + * + * ... + * + * ); + * + * // override resource via props + * const MyComponent = () => ( + * <> + * + * ... + * + * ); + * + * @returns {ResourceContextValue} The resource name, e.g. 'posts' */ export const useResourceContext = < ResourceInformationsType extends Partial<{ resource: string }> @@ -15,22 +42,5 @@ export const useResourceContext = < props?: ResourceInformationsType ): ResourceContextValue => { const context = useContext(ResourceContext); - - if (!context) { - /** - * The element isn't inside a - * - * @deprecated - to be removed in 4.0 - */ - if (process.env.NODE_ENV !== 'production') { - // Restore this message when ResourceContext is actually used - // console.warn( - // "Any react-admin components must be used inside a . Relying on props rather than context to get the resource data is deprecated and won't be supported in the next major version of react-admin." - // ); - } - // Ignored because resource is often optional (as it is injected) in components which passes the props to this hook - return props && props.resource; - } - - return context; + return props.resource || context; }; diff --git a/packages/ra-ui-materialui/src/detail/Create.tsx b/packages/ra-ui-materialui/src/detail/Create.tsx index 8ca9f282010..12840e4bc30 100644 --- a/packages/ra-ui-materialui/src/detail/Create.tsx +++ b/packages/ra-ui-materialui/src/detail/Create.tsx @@ -3,6 +3,7 @@ import { ReactElement } from 'react'; import PropTypes from 'prop-types'; import { CreateContextProvider, + ResourceContextProvider, useCheckMinimumRequiredProps, useCreateController, } from 'ra-core'; @@ -58,11 +59,19 @@ export const Create = ( ): ReactElement => { useCheckMinimumRequiredProps('Create', ['children'], props); const controllerProps = useCreateController(props); - return ( + const body = ( ); + return props.resource ? ( + // support resource override via props + + {body} + + ) : ( + body + ); }; Create.propTypes = { @@ -74,7 +83,7 @@ Create.propTypes = { hasCreate: PropTypes.bool, hasEdit: PropTypes.bool, hasShow: PropTypes.bool, - resource: PropTypes.string.isRequired, + resource: PropTypes.string, title: PropTypes.node, record: PropTypes.object, hasList: PropTypes.bool, diff --git a/packages/ra-ui-materialui/src/detail/Edit.tsx b/packages/ra-ui-materialui/src/detail/Edit.tsx index e790b4e43bc..39c730db8b6 100644 --- a/packages/ra-ui-materialui/src/detail/Edit.tsx +++ b/packages/ra-ui-materialui/src/detail/Edit.tsx @@ -3,6 +3,7 @@ import { ReactElement } from 'react'; import PropTypes from 'prop-types'; import { EditContextProvider, + ResourceContextProvider, useCheckMinimumRequiredProps, useEditController, } from 'ra-core'; @@ -59,11 +60,19 @@ export const Edit = ( ): ReactElement => { useCheckMinimumRequiredProps('Edit', ['children'], props); const controllerProps = useEditController(props); - return ( + const body = ( ); + return props.resource ? ( + // support resource override via props + + {body} + + ) : ( + body + ); }; Edit.propTypes = { diff --git a/packages/ra-ui-materialui/src/detail/Show.tsx b/packages/ra-ui-materialui/src/detail/Show.tsx index 0c8c848f6ff..57d57146edd 100644 --- a/packages/ra-ui-materialui/src/detail/Show.tsx +++ b/packages/ra-ui-materialui/src/detail/Show.tsx @@ -3,6 +3,7 @@ import { ReactElement } from 'react'; import PropTypes from 'prop-types'; import { ShowContextProvider, + ResourceContextProvider, useCheckMinimumRequiredProps, useShowController, } from 'ra-core'; @@ -58,11 +59,19 @@ export const Show = ( ): ReactElement => { useCheckMinimumRequiredProps('Show', ['children'], props); const controllerProps = useShowController(props); - return ( + const body = ( ); + return props.resource ? ( + // support resource override via props + + {body} + + ) : ( + body + ); }; Show.propTypes = {