Form automatically submitting, why is preventDefault() not working

I recently created a link shortening application in react. I have a problem with the form automatically submitting when I enter a link, I have preventDefault() as you can see in the code and onSubmit in the form element.

const onSubmit = (e) => {
    e.preventDefault();

    return false;
  }

  if (!text){

  } else {
    const shortenLink = async () => {
      const res = await fetch(`https://api.shrtco.de/v2/shorten?url=${text}`)
      const data = await res.json()

      console.log(data.result);

      setLinks(data.result)
      setText('')
    }

    shortenLink()
  }

  const copy = () => {
    navigator.clipboard.writeText(links.full_short_link)
    setButtonText('Copied!')
  }

  
  
  return (
    <>
    <Container>
        <StyledInput onSubmit={onSubmit}>
          <InputContainer>
              <Input type="url" value={text} onChange={(e) => setText(e.target.value)} placeholder="Shorten link here..." required />
              <ButtonTwo onClick={onSubmit} type="submit" bg="#666AF6" color="#fff">Shorten It!</ButtonTwo>
           </InputContainer>
         </StyledInput>