From 3daf4968a11720d2e2c02ccbaea5caaa0f3f0434 Mon Sep 17 00:00:00 2001 From: fzaninotto Date: Mon, 15 Mar 2021 16:39:59 +0100 Subject: [PATCH 1/5] Remove the need to pass basePath in buttons --- .../button/useDeleteWithConfirmController.tsx | 2 +- .../button/useDeleteWithUndoController.tsx | 2 +- .../src/button/CloneButton.tsx | 49 +++++++++++-------- .../src/button/CreateButton.tsx | 7 +-- .../src/button/EditButton.tsx | 41 +++++++++------- .../src/button/ListButton.tsx | 19 +++++-- .../src/button/ShowButton.tsx | 46 +++++++++-------- 7 files changed, 97 insertions(+), 69 deletions(-) diff --git a/packages/ra-core/src/controller/button/useDeleteWithConfirmController.tsx b/packages/ra-core/src/controller/button/useDeleteWithConfirmController.tsx index 04565fda04c..1e5c6345982 100644 --- a/packages/ra-core/src/controller/button/useDeleteWithConfirmController.tsx +++ b/packages/ra-core/src/controller/button/useDeleteWithConfirmController.tsx @@ -90,7 +90,7 @@ const useDeleteWithConfirmController = ( setOpen(false); if (onSuccess === undefined) { notify('ra.notification.deleted', 'info', { smart_count: 1 }); - redirect(redirectTo, basePath); + redirect(redirectTo, basePath || `/${resource}`); refresh(); } else { onSuccess(response); diff --git a/packages/ra-core/src/controller/button/useDeleteWithUndoController.tsx b/packages/ra-core/src/controller/button/useDeleteWithUndoController.tsx index 5a17d40f930..b684a13a6e5 100644 --- a/packages/ra-core/src/controller/button/useDeleteWithUndoController.tsx +++ b/packages/ra-core/src/controller/button/useDeleteWithUndoController.tsx @@ -75,7 +75,7 @@ const useDeleteWithUndoController = ( { smart_count: 1 }, true ); - redirect(redirectTo, basePath); + redirect(redirectTo, basePath || `/${resource}`); refresh(); }, onFailure: diff --git a/packages/ra-ui-materialui/src/button/CloneButton.tsx b/packages/ra-ui-materialui/src/button/CloneButton.tsx index e1cc510f557..4c136f735aa 100644 --- a/packages/ra-ui-materialui/src/button/CloneButton.tsx +++ b/packages/ra-ui-materialui/src/button/CloneButton.tsx @@ -4,36 +4,42 @@ import PropTypes from 'prop-types'; import Queue from '@material-ui/icons/Queue'; import { Link } from 'react-router-dom'; import { stringify } from 'query-string'; -import { Record } from 'ra-core'; +import { Record, useResourceContext } from 'ra-core'; import Button, { ButtonProps } from './Button'; export const CloneButton: FC = ({ basePath = '', label = 'ra.action.clone', + scrollToTop = true, record, icon = defaultIcon, ...rest -}) => ( - -); +}) => { + const resource = useResourceContext(); + const pathname = basePath ? `${basePath}/create` : `/${resource}/create`; + return ( + + ); +}; const defaultIcon = ; @@ -46,6 +52,7 @@ interface Props { basePath?: string; record?: Record; icon?: ReactElement; + scrollToTop?: boolean; } export type CloneButtonProps = Props & ButtonProps; diff --git a/packages/ra-ui-materialui/src/button/CreateButton.tsx b/packages/ra-ui-materialui/src/button/CreateButton.tsx index da819b6b67a..750e071c7a6 100644 --- a/packages/ra-ui-materialui/src/button/CreateButton.tsx +++ b/packages/ra-ui-materialui/src/button/CreateButton.tsx @@ -6,7 +6,7 @@ import { makeStyles } from '@material-ui/core/styles'; import ContentAdd from '@material-ui/icons/Add'; import classnames from 'classnames'; import { Link } from 'react-router-dom'; -import { useTranslate } from 'ra-core'; +import { useTranslate, useResourceContext } from 'ra-core'; import Button, { ButtonProps, sanitizeButtonRestProps } from './Button'; @@ -39,12 +39,13 @@ const CreateButton: FC = props => { const isSmall = useMediaQuery((theme: Theme) => theme.breakpoints.down('sm') ); + const resource = useResourceContext(); const location = useMemo( () => ({ - pathname: `${basePath}/create`, + pathname: basePath ? `${basePath}/create` : `/${resource}/create`, state: { _scrollToTop: scrollToTop }, }), - [basePath, scrollToTop] + [basePath, resource, scrollToTop] ); return isSmall ? ( = ({ record, scrollToTop = true, ...rest -}) => ( - -); +}) => { + const resource = useResourceContext(); + return ( + + ); +}; const defaultIcon = ; diff --git a/packages/ra-ui-materialui/src/button/ListButton.tsx b/packages/ra-ui-materialui/src/button/ListButton.tsx index adde6f35544..0d6848b5c72 100644 --- a/packages/ra-ui-materialui/src/button/ListButton.tsx +++ b/packages/ra-ui-materialui/src/button/ListButton.tsx @@ -3,6 +3,7 @@ import { FC, ReactElement } from 'react'; import PropTypes from 'prop-types'; import ActionList from '@material-ui/icons/List'; import { Link } from 'react-router-dom'; +import { useResourceContext } from 'ra-core'; import Button, { ButtonProps } from './Button'; @@ -37,11 +38,19 @@ const ListButton: FC = ({ icon = defaultIcon, label = 'ra.action.list', ...rest -}) => ( - -); +}) => { + const resource = useResourceContext(); + return ( + + ); +}; const defaultIcon = ; diff --git a/packages/ra-ui-materialui/src/button/ShowButton.tsx b/packages/ra-ui-materialui/src/button/ShowButton.tsx index 50ed458a567..3df0cfb786e 100644 --- a/packages/ra-ui-materialui/src/button/ShowButton.tsx +++ b/packages/ra-ui-materialui/src/button/ShowButton.tsx @@ -3,7 +3,7 @@ import { FC, memo, useMemo, ReactElement } from 'react'; import PropTypes from 'prop-types'; import ImageEye from '@material-ui/icons/RemoveRedEye'; import { Link } from 'react-router-dom'; -import { linkToRecord, Record } from 'ra-core'; +import { linkToRecord, Record, useResourceContext } from 'ra-core'; import Button, { ButtonProps } from './Button'; @@ -24,25 +24,31 @@ const ShowButton: FC = ({ record, scrollToTop = true, ...rest -}) => ( - -); +}) => { + const resource = useResourceContext(); + return ( + + ); +}; const defaultIcon = ; From 8f7847fb148a8167cdfccdc557be1969eaf52a1e Mon Sep 17 00:00:00 2001 From: fzaninotto Date: Mon, 15 Mar 2021 16:40:50 +0100 Subject: [PATCH 2/5] Remove the need to pass resource in ReferenceField --- examples/simple/src/comments/CommentList.tsx | 13 ++----------- .../src/controller/field/getResourceLinkPath.ts | 6 ++++-- 2 files changed, 6 insertions(+), 13 deletions(-) diff --git a/examples/simple/src/comments/CommentList.tsx b/examples/simple/src/comments/CommentList.tsx index 2ff2894a68c..795c174e9d8 100644 --- a/examples/simple/src/comments/CommentList.tsx +++ b/examples/simple/src/comments/CommentList.tsx @@ -165,7 +165,6 @@ const CommentGrid = () => { {translate('comment.list.about')}  { - - + + diff --git a/packages/ra-core/src/controller/field/getResourceLinkPath.ts b/packages/ra-core/src/controller/field/getResourceLinkPath.ts index dc41f78c04b..268d56e4f0e 100644 --- a/packages/ra-core/src/controller/field/getResourceLinkPath.ts +++ b/packages/ra-core/src/controller/field/getResourceLinkPath.ts @@ -53,7 +53,7 @@ const getResourceLinkPath = ({ reference, link = 'edit', record = { id: '' }, - basePath = `/${resource}`, + basePath = '', linkType, }: Option): string | false => { if (linkType !== undefined) { @@ -62,7 +62,9 @@ const getResourceLinkPath = ({ ); } const sourceId = get(record, source); - const rootPath = basePath.replace(resource, reference); + const rootPath = basePath + ? basePath.replace(resource, reference) + : `/${reference}`; const linkTo: LinkToType = linkType !== undefined ? linkType : link; // Backward compatibility: keep linkType but with warning From ece61883b88d8ec20dcbc9b53206b4e611615a57 Mon Sep 17 00:00:00 2001 From: fzaninotto Date: Mon, 15 Mar 2021 16:41:01 +0100 Subject: [PATCH 3/5] Fix typo in jsDoc --- packages/ra-core/src/core/useResourceContext.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/ra-core/src/core/useResourceContext.ts b/packages/ra-core/src/core/useResourceContext.ts index 38c1f3e1ba2..34323c0b1be 100644 --- a/packages/ra-core/src/core/useResourceContext.ts +++ b/packages/ra-core/src/core/useResourceContext.ts @@ -10,7 +10,7 @@ import { ResourceContext, ResourceContextValue } from './ResourceContext'; * @example * * const ResourceName = (props) => { - * const { resource } = useResourceContext(props); + * const resource = useResourceContext(props); * const resourceName = translate(`resources.${resource}.name`, { * smart_count: 1, * _: inflection.humanize(inflection.singularize(resource)), From ad8743eeeb98417b6f9d3d2394a05b398c7c4b27 Mon Sep 17 00:00:00 2001 From: fzaninotto Date: Mon, 15 Mar 2021 17:00:02 +0100 Subject: [PATCH 4/5] Fix tests --- .../ra-ui-materialui/src/button/CloneButton.spec.tsx | 11 +++++++---- 1 file changed, 7 insertions(+), 4 deletions(-) diff --git a/packages/ra-ui-materialui/src/button/CloneButton.spec.tsx b/packages/ra-ui-materialui/src/button/CloneButton.spec.tsx index 40850a5586d..bd124cda7d5 100644 --- a/packages/ra-ui-materialui/src/button/CloneButton.spec.tsx +++ b/packages/ra-ui-materialui/src/button/CloneButton.spec.tsx @@ -12,7 +12,7 @@ import { TestContext } from 'ra-test'; const theme = createMuiTheme(); const invalidButtonDomProps = { - basePath: '', + basePath: '/posts', handleSubmit: jest.fn(), handleSubmitWithRedirect: jest.fn(), invalid: false, @@ -32,14 +32,17 @@ describe('', () => { const { getByRole } = render( - + ); const button = getByRole('button'); expect(button.getAttribute('href')).toEqual( - '/create?source=%7B%22foo%22%3A%22bar%22%7D' + '/posts/create?source=%7B%22foo%22%3A%22bar%22%7D' ); }); @@ -56,7 +59,7 @@ describe('', () => { expect(spy).not.toHaveBeenCalled(); expect(getByRole('button').getAttribute('href')).toEqual( - '/create?source=%7B%22foo%22%3A%22bar%22%7D' + '/posts/create?source=%7B%22foo%22%3A%22bar%22%7D' ); spy.mockRestore(); From 80b6161506dad0d1e41ee33208a227ff7af0bdcf Mon Sep 17 00:00:00 2001 From: fzaninotto Date: Tue, 16 Mar 2021 12:03:09 +0100 Subject: [PATCH 5/5] Fix warning --- examples/simple/src/comments/CommentList.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/simple/src/comments/CommentList.tsx b/examples/simple/src/comments/CommentList.tsx index 795c174e9d8..1a0716f0fc8 100644 --- a/examples/simple/src/comments/CommentList.tsx +++ b/examples/simple/src/comments/CommentList.tsx @@ -128,7 +128,7 @@ const useListStyles = makeStyles(theme => ({ })); const CommentGrid = () => { - const { ids, data, basePath } = useListContext(); + const { ids, data } = useListContext(); const translate = useTranslate(); const classes = useListStyles();