135 lines
3.5 KiB
TypeScript
135 lines
3.5 KiB
TypeScript
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 data = await res.json();
|
|
localStorage.setItem("token", data.token);
|
|
|
|
return data;
|
|
},
|
|
onSuccess: (user: SelectUser) => {
|
|
queryClient.setQueryData(["/api/users/"], user);
|
|
},
|
|
onError: (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 data = await res.json();
|
|
localStorage.setItem("token", data.token);
|
|
return data;
|
|
},
|
|
onSuccess: (user: SelectUser) => {
|
|
queryClient.setQueryData(["/api/users/"], user);
|
|
},
|
|
onError: (error: Error) => {
|
|
toast({
|
|
title: "Registration failed",
|
|
description: error.message,
|
|
variant: "destructive",
|
|
});
|
|
},
|
|
});
|
|
|
|
const logoutMutation = useMutation({
|
|
mutationFn: async () => {
|
|
// Remove token from localStorage when logging out
|
|
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;
|
|
}
|