added api, validation and protected routing

src/components/MyInput.jsx

@@ -4,7 +4,13 @@ import classes from "../assets/styles/components/myInput.module.scss"
 const MyInput = (props) => {
     return (
         <div className={classes.main} style={{...props.otherMainStyle}}>
-            <input type={props.type} placeholder={props.placeholder} style={{...props.otherInputStyle}} onChange={(e) => props.change(e.target.value)} value={props.value}/>
+            <input 
+                type={props.type} 
+                placeholder={props.placeholder} 
+                style={{...props.otherInputStyle}} 
+                onChange={(e) => props.change(e.target.value)} 
+                value={props.value}
+            />
         </div>
     )
 }

src/components/NavBar.jsx

@@ -6,12 +6,12 @@ const NavBar = ({navigate, auth, setAuth}) => {
         <div className={classes.main}>
             <div className={classes.wrapper}>
                 <div className={classes.menu}>
-                    {auth ? 
                     <div className={classes.menu__authorized}>
                         <span onClick={() => navigate("/")}>Главная</span>
-                        <span onClick={() => navigate("/forms")}>Мои формы</span>
-                    </div> : 
-                    <div></div>}                    
+                        {auth ? 
+                        <span onClick={() => navigate("/forms")}>Мои формы</span> :
+                        <span></span>}
+                    </div>                   
                 </div>
                 <div className={classes.profile}>
                     {auth ?