import { CssBaseline, Box, Typography, TextField, FormControlLabel, Checkbox, Container, Button } from "@mui/material"; import React, { FormEventHandler, useContext } from "react"; import { Navigate } from "react-router-dom"; import { api, apiAuthenticatedContext } from "./common"; export const fetchToken = async (username: string, password: string, remember: boolean) => { try { const response = await api.post('/auth/signin', { username: username, password: password, remember: remember, }, { withCredentials: true }); return response.data; } catch (error) { console.error('Error fetching token:', error); throw error; } }; export function LoginPage(props: {}) { const [apiAuthenticated, setApiAuthenticated] = useContext(apiAuthenticatedContext) if (apiAuthenticated) { return } const handleSubmit: FormEventHandler = (event) => { event.preventDefault(); const data = new FormData(event.currentTarget); const usernameFormData: FormDataEntryValue | null = data.get('username'); const passwordFormData: FormDataEntryValue | null = data.get('password'); if (usernameFormData === null || passwordFormData === null){ return } const username: string = usernameFormData.toString(); const password: string = passwordFormData.toString(); fetchToken(username, password, Boolean(data.get('remember'))).then( (token) => { setApiAuthenticated(true) }, (error) => { return Promise.reject(error); } ) } return ( Sign in } label="Remember me" /> ) }