scroll to the top of the page in react/js

I have a page diveded in 3 components 1)sidebar 2)content wrapper which containts the 1)LoggedIn div and 2)main content after the submition of the form a modal is shown and after that i want the main content to scroll up in the original position (like refreshing the page)

This is the code for the MainPage component

<div className="main-container">
            <Sidebar />
            <div className="content-wrapper">
                <div className="LoggedIn">
                    <p className="LoggedInAs">
                        Συνδεδεμένος ως {user} 
                    </p>
                </div>
                <div className="content">
                    {children}
                </div>
            </div>
        </div>

and then this is the code for the Employee component

function handleSubmit(event) {
        event.preventDefault();
        if (name && epitheto && code) {
            handleAddYpallilos();
            setName("");
            setEpitheto("");
            setCode("");
            setShowModal2(true);
            const cont = document.querySelector(".content");
            cont.scrollTo({
                top: 0,
                behavior: 'smooth'
            })
        } else {
            console.log("ERROR");
        }
    }
return(<div className="content">...<div/>)

the problem is that i dont get the error from the consolelog so that means the code is performing but it doesnt work??