I'm trying to submit an email in the input form field and have it post to my Google sheet as the backend. I'm using sheetdb.io to handle this and have used their Javascript example in my react handleSubmit function. For some reason the email is not posting to google sheets.

Can someone let me know what I'm doing wrong?

import './Hero.css'
import prlearn_logo from '../assets/prlearn_logo.png'
import { useState } from 'react'


function Hero(){

    //managing state of input field
    const [input, setInput] = useState('')

    const handleSubmit = (e) => {
        e.preventDefault()

        fetch('https://sheetdb.io/api/v1/1k4utfd19hypz')
            .then(response => response.json())
            .then(data => {
                console.log(data);
            })
            .catch(error => {
                console.error(error);
            });
    }

    return (
        <div className="container">
            <div className="heading">
                <img className ="logo" src={prlearn_logo} alt="prlearn_logo" />
                <h1 className="h1">Learn Spanish from native speakers and support the local community.
                <br/> 
                <span>Feel at home by removing the language barrier.</span>
                </h1>
            </div>
            <div className="waitlist">
                <form onSubmit={handleSubmit}>
                    <input 
                        type="text"
                        className="input-field"
                        placeholder="Enter email address"
                        name="e-mail"
                        required
                        value={input}
                        //changes input in state function
                        onChange={(e) => setInput(e.target.value)}
                    />
                    <button type="submit" className="button">Join The Waitlist</button>
                </form>
            </div>  
        </div>
    )
}

export default Hero