initial commit

apps/Frontend/src/hooks/use-auth.tsx

@@ -0,0 +1,156 @@
+import { createContext, ReactNode, useContext } from "react";
+import {
+  useQuery,
+  useMutation,
+  UseMutationResult,
+} from "@tanstack/react-query";
+import { UserUncheckedCreateInputObjectSchema } from "@repo/db/usedSchemas";
+import { z } from "zod";
+import { getQueryFn, apiRequest, queryClient } from "../lib/queryClient";
+import { useToast } from "@/hooks/use-toast";
+
+type SelectUser = z.infer<typeof UserUncheckedCreateInputObjectSchema>;
+
+const insertUserSchema = (
+  UserUncheckedCreateInputObjectSchema as unknown as z.ZodObject<{
+    username: z.ZodString;
+    password: z.ZodString;
+  }>
+).pick({
+  username: true,
+  password: true,
+});
+
+type InsertUser = z.infer<typeof insertUserSchema>;
+
+type AuthContextType = {
+  user: SelectUser | null;
+  isLoading: boolean;
+  error: Error | null;
+  loginMutation: UseMutationResult<SelectUser, Error, LoginData>;
+  logoutMutation: UseMutationResult<void, Error, void>;
+  registerMutation: UseMutationResult<SelectUser, Error, InsertUser>;
+};
+
+// type LoginData = Pick<InsertUser, "username" | "password">;
+type LoginData = {
+  username: InsertUser["username"];
+  password: InsertUser["password"];
+};
+
+export const AuthContext = createContext<AuthContextType | null>(null);
+
+export function AuthProvider({ children }: { children: ReactNode }) {
+  const { toast } = useToast();
+  const {
+    data: user,
+    error,
+    isLoading,
+  } = useQuery<SelectUser | undefined, Error>({
+    queryKey: ["/api/users/"],
+    queryFn: getQueryFn({ on401: "returnNull" }),
+  });
+
+  const loginMutation = useMutation({
+    mutationFn: async (credentials: LoginData) => {
+      const res = await apiRequest("POST", "/api/auth/login", credentials);
+
+      const contentType = res.headers.get("content-type") || "";
+      const isJson = contentType.includes("application/json");
+      const data = isJson ? await res.json() : {};
+
+      if (!res.ok) {
+        throw new Error(data?.error || "Login failed. Please try again.");
+      }
+      if (!data?.token || !data?.user) {
+        throw new Error("Invalid response from server");
+      }
+
+      localStorage.setItem("token", data.token);
+      return data.user;
+    },
+    onSuccess: (user: SelectUser) => {
+      queryClient.setQueryData(["/api/users/"], user);
+    },
+    onError: (error: Error) => {
+      console.error("Login error:", error);
+      toast({
+        title: "Login failed",
+        description: error.message,
+        variant: "destructive",
+      });
+    },
+  });
+
+  const registerMutation = useMutation({
+    mutationFn: async (credentials: InsertUser) => {
+      const res = await apiRequest("POST", "/api/auth/register", credentials);
+
+      const contentType = res.headers.get("content-type") || "";
+      const isJson = contentType.includes("application/json");
+      const data = isJson ? await res.json() : {};
+
+      if (!res.ok) {
+        throw new Error(data?.error || "Registration failed.");
+      }
+
+      if (!data?.token || !data?.user) {
+        throw new Error("Invalid response from server");
+      }
+
+      localStorage.setItem("token", data.token);
+      return data.user;
+    },
+    onSuccess: (user: SelectUser) => {
+      queryClient.setQueryData(["/api/users/"], user);
+    },
+    onError: (error: Error) => {
+      console.error("Registration error:", error);
+      toast({
+        title: "Registration failed",
+        description: error.message,
+        variant: "destructive",
+      });
+    },
+  });
+
+  const logoutMutation = useMutation({
+    mutationFn: async () => {
+      localStorage.removeItem("token");
+      await apiRequest("POST", "/api/auth/logout");
+    },
+    onSuccess: () => {
+      queryClient.setQueryData(["/api/users/"], null);
+    },
+    onError: (error: Error) => {
+      toast({
+        title: "Logout failed",
+        description: error.message,
+        variant: "destructive",
+      });
+    },
+  });
+
+  return (
+    <AuthContext.Provider
+      value={{
+        user: user ?? null,
+        isLoading,
+        error,
+        loginMutation,
+        logoutMutation,
+        registerMutation,
+      }}
+    >
+      {children}
+    </AuthContext.Provider>
+  );
+}
+
+export function useAuth() {
+  const context = useContext(AuthContext);
+  if (!context) {
+    throw new Error("useAuth must be used within an AuthProvider");
+  }
+  return context;
+}