import React, { useState } from "react";
import { TokenContext } from "./tokenStorage";

export const Login: React.FC = () => {

    const [inputState, setInputState] = useState("");
    const tokenStorage = React.useContext(TokenContext);

    return <>
        <h1>
            gib token
        </h1>
        <form onSubmit={(e) => {
            e.preventDefault();
            tokenStorage.set(inputState);
        }}>
            <label htmlFor="token">Token: </label>
            <input
                type="text"
                id="token"
                placeholder="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9..."
                value={inputState}
                onChange={(e) => setInputState(e.target.value)}>
            </input>
            <button type="submit"> Submit </button>
        </form>
        <p>
            The token will be put into your local storage.
        </p>
    </>
}

export default Login;