Merge branch 'main' into mm-009-style-form

src/Home/Home.tsx

@@ -3,14 +3,13 @@ import { useNavigate } from "react-router-dom";
 import DisplayBackgroundImage from '../images/DisplayBackgroundImage';
 import './Home.scss'
 
-interface getUserProp{
+interface HomeProps{
     username:string;
     setUsername:(uname:string)=>void;
 }
 
-function Home(props:getUserProp) {
+function Home(props:HomeProps) {
 
-    //const [username, setUsername] = useState("");
     const [submitStatus, setSubmitStatus] = useState(false);
 
     const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
@@ -29,24 +28,20 @@ function Home(props:getUserProp) {
     return (
         <>
             <main className="home-content" style={{ backgroundImage: `url(${homeBackgroundImage})` }}>
-
                 {/* Other components and content */}
                 <form className="form" onSubmit={handleSubmit}>
                     <label>Enter name:
                         <input type="text"
                             value={props.username}
-                            //onChange={username => setUsername(username.target.value)}
                             onChange={(username) => {props.setUsername(username.target.value)}}
                         />
                     </label>
                     <button type="submit">Submit</button>
                     {submitStatus ? <p>Welcome {props.username}!</p> : null}
                 </form>
-
                 <button className="startQuizButton" onClick={routeChange}>
                      Start quiz 
                 </button>
-
             </main>
         </>
     )

src/Menu/MenuItems.tsx

@@ -2,5 +2,5 @@
 // list of the menu options that will be displayed when clicking on hamburger button
 export const menuItems = [
   { label: 'Home', link: '/' },
-  { label: 'Quiz', link: '' },
+  { label: 'Quiz', link: '/quiz' },
 ];

src/Quiz/Quiz.tsx

@@ -1,10 +1,10 @@
 import { QuestionDisplay } from "../QuestionDisplay/QuestionDisplay"
 
-interface getUserProp{
+interface QuizProps{
     username:string;
 }
 
-export function Quiz (props:getUserProp) {
+export function Quiz (props:QuizProps) {
     return (
         <div>
             User : {props.username}