score:2

Accepted answer

dialogcontent does not have a prop display. that is why you see both, because it is just ignored. you should change displaysignin and displaysignup to be a boolean and use a ternary operator like this:

{displaysignin && <dialogcontent component="div">
    <dialogcontenttext>
      sign in
      <button color="inherit" onclick={togglesignup}>sign up</button>
    </dialogcontenttext>
  </dialogcontent>}
  {displaysignup && <dialogcontent component="div">
    <dialogcontenttext>
      sign up
      <button color="inherit" onclick={togglesignin}>sign in</button>
    </dialogcontenttext>
  </dialogcontent>}

to toggle between these two states.


Related Query

More Query from same tag