diff --git a/app/api/authentication.tsx b/app/api/authentication.tsx new file mode 100644 index 0000000..4393b98 --- /dev/null +++ b/app/api/authentication.tsx @@ -0,0 +1,15 @@ +import { getCsrfToken } from '@/app/lib/utils'; + +export function login({ email, password, onLogin }: { email: string, password: string, onLogin: () => void }) { + console.log(email, password); + return fetch("/api/default/users/sign_in", { + method: 'POST', + body: JSON.stringify({ user: { email, password } }), + headers: { + 'Content-Type': 'application/json', + 'X-CSRF-TOKEN': getCsrfToken(), + } + }) + .then(onLogin) + .catch((error) => console.error(error)); +} \ No newline at end of file diff --git a/app/page.tsx b/app/page.tsx index 95ca011..1d01aee 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -2,11 +2,26 @@ import Link from 'next/link'; import styles from '@/app/ui/home.module.css'; +import LoginForm from '@/app/ui/components/login-form'; + + export default function Page() { return (
- +
+
+ + Already have an account? Sign in + + +
+ +
+ Don't have an account? Register now! +
+
+
); } diff --git a/app/ui/components/login-form.tsx b/app/ui/components/login-form.tsx new file mode 100644 index 0000000..4ae32da --- /dev/null +++ b/app/ui/components/login-form.tsx @@ -0,0 +1,34 @@ +'use client'; + +import { FloatLabel } from 'primereact/floatlabel'; +import { InputText } from 'primereact/inputtext'; +import { login } from '../../api/authentication'; +import { useState } from 'react'; +import { classNames } from './button'; +import { useRouter } from 'next/navigation' + +export default function LoginForm() { + const [email, setEmail] = useState(""); + const [password, setPassword] = useState(""); + + const router = useRouter() + + return ( +
+ + setEmail(e.target.value)} /> + + + + setPassword(e.target.value)} /> + + + +
+ ) +} \ No newline at end of file