react-admin icon indicating copy to clipboard operation
react-admin copied to clipboard

Title component usage does not override existing title

Open panfiva opened this issue 4 years ago • 2 comments

Is your feature request related to a problem? Please describe. I have a page that conditionally renders child components. The page uses react-admin's Title component to set a title. In most cases, when child component is rendered, Title should stay the same as in parent component; however, in some conditions, we want to be able to override page's title from within child.

Today, if both parent and child component have Title rendered, react-admin will just append Title2 to Title1 (will show Title1Title2)

function ParentComponent = (props) => {
 const conditional = props.display? <ConditionalChild /> : null
 return (
   <Fragment>
     <Title title="Title1">
     Welcome to ParentComponent 
     {conditional}
  </Fragment>
  )
}


function ConditionalChild = () => {
 const status = fetch_status()
  if (status===0) 
    return (
     <Fragment>
       <Title title="Title2">
       Status 0
     </Fragment>
    )
  else 
    return (
     <Fragment>
       Other status
     </Fragment>
    )
}

Describe the solution you'd like if a component or its children have multiple Title calls, the last call should win (similar to what react-helmet does while setting page title)

Describe alternatives you've considered No clear solution found

Additional context none

panfiva avatar Dec 10 '21 16:12 panfiva

This is because react-admin's Title component uses React.createPortal with the AppBar as a container, and when you have multiple contents set in the same container, createPortal behaves this way. I agree this should be enhanced somehow.

WiXSL avatar Dec 13 '21 21:12 WiXSL

React-helmet has the ability to override previously-set values. Maybe the same approach could work.

https://github.com/nfl/react-helmet

panfiva avatar Jan 26 '22 18:01 panfiva