re-implemented JWT auth

app/client/pages/index.tsx

@@ -1,4 +1,4 @@
-import { Stack, Text } from '@chakra-ui/react';
+import { Box, Button, Stack, Text } from '@chakra-ui/react';
 import { createFileRoute } from '@tanstack/react-router';
 
 import { gql, useQuery } from '@apollo/client';
@@ -10,7 +10,7 @@ export const Route = createFileRoute('/')({
 });
 
 function Index() {
-  const { data } = useQuery<BooksManyQuery>(getBooksQuery);
+  const { data, refetch } = useQuery<BooksManyQuery>(getBooksQuery);
 
   return (
     <Stack>
@@ -27,6 +27,9 @@ function Index() {
             ))}
           </>
         )}
+        <Box>
+          <Button onClick={async () => refetch()}>Refetch</Button>
+        </Box>
       </Stack>
     </Stack>
   );

app/client/pages/login.tsx

@@ -1,17 +1,12 @@
-import { gql } from '@apollo/client';
 import { Heading, Input, Stack } from '@chakra-ui/react';
 import { Button } from '@client/components/ui/button';
 import { Field } from '@client/components/ui/field';
 import { valibotResolver } from '@hookform/resolvers/valibot';
 import { createFileRoute, useNavigate } from '@tanstack/react-router';
-import { Session } from 'inspector';
-import { useContext } from 'react';
 import { useForm } from 'react-hook-form';
 import * as v from 'valibot';
 import { PasswordInput } from '../components/ui/password-input';
-import { sessionFragment } from '../fragments';
-import { useToastMutation } from '../hooks/useToastMutation';
-import { AuthContext } from '../main';
+import { useAuth } from '../hooks/auth';
 
 export const Route = createFileRoute('/login')({
   component: LoginComponent
@@ -33,10 +28,6 @@ interface FormValues {
 
 function LoginForm() {
   const navigate = useNavigate();
-  const { update: login } = useToastMutation<{ login: Session }>({
-    mutation,
-    successMsg: 'Logged in successfully.'
-  });
 
   const schema = v.pipe(
     v.object({
@@ -51,24 +42,16 @@ function LoginForm() {
     formState: { errors }
   } = useForm<FormValues>({ resolver: valibotResolver(schema) });
 
-  const { header, setHeaders } = useContext(AuthContext);
-  if (header != null) navigate({ to: '/' });
+  const { login } = useAuth();
 
   return (
     <form
       onSubmit={handleSubmit(async values => {
-        const { data } = await login({
-          variables: {
-            input: {
-              email: values.email,
-              password: values.password
-            }
-          }
+        const session = await login({
+          email: values.email,
+          password: values.password
         });
-        if (data != null) {
-          setHeaders(data.login);
-          navigate({ to: '/' });
-        }
+        if (session != null) navigate({ to: '/' });
       })}
     >
       <Stack>
@@ -87,13 +70,3 @@ function LoginForm() {
     </form>
   );
 }
-
-const mutation = gql`
-  mutation AuthLogin($input: LoginInput!) {
-    login(input: $input) {
-      ...Session
-    }
-  }
-
-  ${sessionFragment}
-`;