remix-demo

react router (remix) demo

git clone https://9o.is/git/remix-demo.git

login.tsx

(1223B)

      1 import type { ActionArgs, LoaderArgs } from "@remix-run/server-runtime";
      2 import { json, redirect } from "@remix-run/server-runtime";
      3 import PrimaryButton from "~/components/forms/PrimaryButton";
      4 import Form from "~/components/forms/Form";
      5 import Input from "~/components/forms/Input";
      6 import CenteredLayout from "~/components/layouts/CenteredLayout";
      7 import { getUserId } from "~/session.server";
      8 import Heading from "~/components/Heading";
      9 import { loginValidator } from "~/schemas/login";
     10 import { logIn } from "~/controllers/login.server";
     11 
     12 export async function action({ request }: ActionArgs) {
     13   return logIn(request);
     14 }
     15 
     16 export async function loader({ request }: LoaderArgs) {
     17   const userId = await getUserId(request);
     18   if (userId) return redirect("/");
     19   return json({});
     20 }
     21 
     22 export default function Login() {
     23   return (
     24     <section>
     25       <CenteredLayout>
     26         <Heading>Log In to Account</Heading>
     27         <Form autoComplete="off" method="post" validator={loginValidator}>
     28           <Input required name="email" label="Email" type="email" />
     29           <PrimaryButton type="submit" className="w-full">
     30             Log In
     31           </PrimaryButton>
     32         </Form>
     33       </CenteredLayout>
     34     </section>
     35   );
     36 }