'How to hide Material UI Button?

I want to hide this material UI button if user is logged in but cant do conditional rendering because it will mess up the whole display flex items so i just want to do display none, is it possible to do display none conditionally?

        <Button
      variant="contained"
      color="primary"
      size="large"
      style={{ paddingLeft: "50px", paddingRight: "50px" }}
      className={classes.primaryAction}
    >
      {content["login"]}
    </Button>

reactjs material-ui

Solution 1:^[1]

yes it is possible, but I belive you will hit the very same issue, it it dissapears, it will break your flex anyways, but you can try this.

   <Button
      variant="contained"
      color="primary"
      size="large"
      style={{ paddingLeft: "50px", paddingRight: "50px", display: isLoggedIn ? "none" : "block" }}
      className={classes.primaryAction}
    >
      {content["login"]}
    </Button>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Lukáš Gibo Vaic

'How to hide Material UI Button?

Solution 1:[1]

Sources

Related Questions

Solution 1:^[1]