Where to render modals in ReactJS?

Question

React

Where is the best place to render modal windows in reactjs vitual dom?
Is it worth using portals for modal windows in react and is it possible to use this approach of declaring windows inside a component where they are used?

const [visibleModal, setVisibleModal] = React.useState<'signIn' | 'signUp' | undefined>()

  const handleClickOpenSignIn = (): void => {
    setVisibleModal('signIn')
  }

  const handleClickOpenSignUp = (): void => {
    setVisibleModal('signUp')
  }

  const handleCloseModal = (): void => {
    setVisibleModal(undefined)
  }

    <Grid container wrap='wrap-reverse' className={classes.wrapper}>
      <Grid item container xs={12} sm={12} md={5} lg={6} className={classes.leftSide}>
        <div className={classes.previewPhoto}>
          <TwitterIcon className={classes.largeLogo} />
        </div>
      </Grid>
      <Grid
        item
        container
        justify='center'
        direction='column'
        xs={12}
        sm={12}
        md={7}
        lg={6}
        className={classes.rightSide}
      >
        <div className={classes.loginSizeWrapper}>
          <TwitterIcon className={classes.smallLogo} color='primary' />

          <Typography className={classes.loginTitle} variant='h2'>
            Happening now
          </Typography>
          <Typography className={classes.loginSubtitle} variant='h3'>
            Join Twitter today.
          </Typography>
          <div className={classes.btnWrapper}>
            <Button onClick={handleClickOpenSignUp} className={classes.loginBtn} variant='contained' color='primary'>
              Sign up
            </Button>
            <Button className={classes.loginBtn} onClick={handleClickOpenSignIn} variant='outlined' color='primary'>
              Log in
            </Button>

            <LoginModal open={visibleModal === 'signIn'} onClose={handleCloseModal} />
            <RegisterModal open={visibleModal === 'signUp'} onClose={handleCloseModal} />
          </div>
        </div>
      </Grid>
    </Grid>