From a6be5a3b336233c9fd28d640402929fe4e309b26 Mon Sep 17 00:00:00 2001 From: Lucas Di Pentima Date: Thu, 16 Dec 2021 10:17:31 -0300 Subject: [PATCH] 18219: Disables custom props forwarding on MPV components by default. This is to avoid warning messages like: Warning: React does not recognize the `panelIlluminated` prop on a DOM element. Arvados-DCO-1.1-Signed-off-by: Lucas Di Pentima --- src/components/multi-panel-view/multi-panel-view.test.tsx | 2 +- src/components/multi-panel-view/multi-panel-view.tsx | 7 +++++-- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/src/components/multi-panel-view/multi-panel-view.test.tsx b/src/components/multi-panel-view/multi-panel-view.test.tsx index 6cf13d78..d690e82f 100644 --- a/src/components/multi-panel-view/multi-panel-view.test.tsx +++ b/src/components/multi-panel-view/multi-panel-view.test.tsx @@ -10,7 +10,7 @@ import { Button } from "@material-ui/core"; configure({ adapter: new Adapter() }); -const PanelMock = ({panelName, panelMaximized, doHidePanel, doMaximizePanel, children, ...rest}) => +const PanelMock = ({panelName, panelMaximized, doHidePanel, doMaximizePanel, panelIlluminated, panelRef, children, ...rest}) =>
{children}
; describe('', () => { diff --git a/src/components/multi-panel-view/multi-panel-view.tsx b/src/components/multi-panel-view/multi-panel-view.tsx index dbb37921..185c3b90 100644 --- a/src/components/multi-panel-view/multi-panel-view.tsx +++ b/src/components/multi-panel-view/multi-panel-view.tsx @@ -64,6 +64,7 @@ interface MPVPanelDataProps { panelMaximized?: boolean; panelIlluminated?: boolean; panelRef?: MutableRefObject; + forwardProps?: boolean; } interface MPVPanelActionProps { @@ -77,7 +78,7 @@ export type MPVPanelProps = MPVPanelDataProps & MPVPanelActionProps; type MPVPanelContentProps = {children: ReactElement} & MPVPanelProps & GridProps; // Grid item compatible component for layout and MPV props passing -export const MPVPanelContent = ({doHidePanel, doMaximizePanel, panelName, panelMaximized, panelIlluminated, panelRef, ...props}: MPVPanelContentProps) => { +export const MPVPanelContent = ({doHidePanel, doMaximizePanel, panelName, panelMaximized, panelIlluminated, panelRef, forwardProps, ...props}: MPVPanelContentProps) => { useEffect(() => { if (panelRef && panelRef.current) { panelRef.current.scrollIntoView({behavior: 'smooth'}); @@ -87,7 +88,9 @@ export const MPVPanelContent = ({doHidePanel, doMaximizePanel, panelName, panelM return {/* Element to scroll to when the panel is selected */} - {React.cloneElement(props.children, { doHidePanel, doMaximizePanel, panelName, panelMaximized })} + { forwardProps + ? React.cloneElement(props.children, { doHidePanel, doMaximizePanel, panelName, panelMaximized }) + : props.children } ; } -- 2.30.2