Using react how do I create different login forms for student and admin?

Question

I'm new to react and I need to create a form that has two tabs for student and admin. The problem I have run into is that student login only needs a username to login whereas admin needs both a username and password to login. I have a form that has both username and password but it shows up on both tabs. How do I make this form only work for Admin. Here is the form I already have

    <form>
                
          <Stack
          spacing={4}
          p="1rem"
          >
          <FormControl>
              <InputGroup>
              <InputLeftElement pointerEvents="none"/>
              <Input type="username" placeholder="Enter ID or Last Name"/>
              </InputGroup>
          </FormControl>

          <FormControl>
              <InputGroup>
              <InputLeftElement
                  pointerEvents="none"
                  color="gray.300"
              />
              <Input
                  type={showPassword ? "text" : "password"}
                  placeholder="Password"
                  
              />
              <InputRightElement width="4.5rem">
                  <Button h="1.75rem" size="sm" onClick={handleShowClick}>
                  {showPassword ? "Hide" : "Show"}
                  </Button>
              </InputRightElement>
              </InputGroup>
          </FormControl>

          <Link {... isStudent ? {href: "/student"} : {href: "/admin"}}>
              <Button
                  borderRadius={0}
                  type="submit"
                  variant="solid"
                  colorScheme="red"
                  width="full"
              >
                  Login
              </Button>
          </Link>
          </Stack>
      </form>