feat(client): magic link sign-in

Signed-off-by: Noa Virellia <noa@requiem.garden>

client/src/routes/login.tsx

@@ -1,15 +1,34 @@
-import { createFileRoute } from '@tanstack/react-router';
+import { createFileRoute, Navigate } from '@tanstack/react-router';
+import { zodValidator } from '@tanstack/zod-adapter';
+import z from 'zod';
 import { LoginForm } from '@/components/login-form';
+import { useValidateMagicLink } from '@/hooks/data/useValidateMagicLink';
+import { setToken } from '@/lib/token';
+
+const loginMagicLinkReceiverSchema = z.object({
+  ticket: z.string().optional(),
+});
 
 export const Route = createFileRoute('/login')({
   component: RouteComponent,
+  validateSearch: zodValidator(loginMagicLinkReceiverSchema),
 });
 
+function ReceiveMagicLinkComponent() {
+  const { ticket } = Route.useSearch();
+  const { data } = useValidateMagicLink(ticket!);
+
+  setToken(data.data.jwt_token);
+
+  return <Navigate to="/" />;
+}
+
 function RouteComponent() {
+  const { ticket } = Route.useSearch();
   return (
     <div className="bg-background flex min-h-svh flex-col items-center justify-center gap-6 p-6 md:p-10">
       <div className="w-full max-w-sm">
-        <LoginForm />
+        {ticket === undefined ? <LoginForm /> : <ReceiveMagicLinkComponent />}
       </div>
     </div>
   );