remix-demo

react router (remix) demo

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

index.tsx

(1481B)

      1 import type { ActionArgs, LoaderArgs, MetaFunction } from "@remix-run/server-runtime";
      2 import { json, redirect } from "@remix-run/server-runtime";
      3 import Form from "~/components/forms/Form";
      4 import Input from "~/components/forms/Input";
      5 import PrimaryButton from "~/components/forms/PrimaryButton";
      6 import Heading from "~/components/Heading";
      7 import CenteredLayout from "~/components/layouts/CenteredLayout";
      8 import { inviteUser } from "~/controllers/userInvite.server";
      9 import { userInviteValidator } from "~/schemas/userInvite";
     10 import { requireUserId } from "~/session.server";
     11 
     12 export const meta: MetaFunction = () => ({
     13   title: "User Invite | Calories Counter",
     14 });
     15 
     16 export async function action({ request }: ActionArgs) {
     17   const response = await inviteUser(request);
     18   if (response.ok) return redirect("/invite/success");
     19   else return response;
     20 }
     21 
     22 export async function loader({ request }: LoaderArgs) {
     23   await requireUserId(request);
     24   return json({});
     25 }
     26 
     27 export default function InviteIndex() {
     28   return (
     29     <section>
     30       <CenteredLayout>
     31         <Heading>Invite User</Heading>
     32         <Form method="post" validator={userInviteValidator} autoComplete="off">
     33           <Input required name="name" label="Name" type="text" />
     34           <Input required name="email" label="Email" type="email" />
     35           <PrimaryButton type="submit" className="w-full">
     36             Invite User
     37           </PrimaryButton>
     38         </Form>
     39       </CenteredLayout>
     40     </section>
     41   );
     42 }