import { FormEvent, useState } from 'react' import { Button, Card, Input, Text } from '@geist-ui/core' import styles from './auth.module.css' import { useRouter } from 'next/router' import Link from '../Link' const Auth = ({ page }: { page: "signup" | "signin" }) => { const router = useRouter(); const [username, setUsername] = useState(''); const [password, setPassword] = useState(''); const [error, setError] = useState(''); const signingIn = page === 'signin' const handleSubmit = async (e: FormEvent) => { const handleJson = (json: any) => { if (json.error) { setError(json.error.message) } else { localStorage.setItem('drift-token', json.token) localStorage.setItem('drift-userid', json.userId) router.push('/') } } const reqOpts = { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ username, password }) } e.preventDefault() if (signingIn) { try { const resp = await fetch('/server-api/auth/signin', reqOpts) const json = await resp.json() handleJson(json) } catch (err: any) { setError(err.message || "Something went wrong") } } else { try { const resp = await fetch('/server-api/auth/signup', reqOpts) const json = await resp.json() handleJson(json) } catch (err: any) { setError(err.message || "Something went wrong") } } } return (

{signingIn ? 'Sign In' : 'Sign Up'}

setUsername(event.target.value)} placeholder="Username" required label='Username' />
setPassword(event.target.value)} placeholder="Password" required label='Password' />
{signingIn && Don't have an account? Sign up} {!signingIn && Already have an account? Sign in}
{error && {error}}
) } export default Auth