LoginPage.js

// LoginPage.js

import React from 'react';
import { LoginForm } from 'LoginForm';
import { useValue } from 'useValue';

export default function LoginPage() {

    const  { value, assignValue } = useValue(false); // Calling our custom hook; false is the initial value this time around

    function handleSubmit() {
        assignValue(true);
    }
    
    return (
        <div>
            <h3>Login Form</h3>

            {
                value ? 
                    <div data-testid="submitted-state">Submitted</div> :
                    <div data-testid="submitted-state">Not Submitted</div>
            }
            
            <LoginForm handleSubmit={(e) => handleSubmit(e)}/>
        </div>
    )

}