diff --git a/src/app/_components/Auth/AuthTypes.ts b/src/app/_components/Auth/AuthTypes.ts index 58da403c..27ffdbf3 100644 --- a/src/app/_components/Auth/AuthTypes.ts +++ b/src/app/_components/Auth/AuthTypes.ts @@ -1,9 +1,5 @@ import React from "react"; -export interface ILoginProps { - handleSubmit: (provider: "google" | "discord") => void; -} - export interface IStyledTextFieldProps { variant?: "outlined" | "filled" | "standard"; fullWidth?: boolean; diff --git a/src/app/_components/Auth/Login/Login.tsx b/src/app/_components/Auth/Login/Login.tsx index 325ecf07..15101385 100644 --- a/src/app/_components/Auth/Login/Login.tsx +++ b/src/app/_components/Auth/Login/Login.tsx @@ -2,9 +2,11 @@ import React from "react"; import { Box, Button, Card, CardContent, Typography } from "@mui/material"; -import { ILoginProps } from "../AuthTypes"; +import { useUser } from "@/app/_contexts/User.context"; -const Login: React.FC = ({ handleSubmit }) => { +const Login: React.FC = () => { + const isDev = process.env.NODE_ENV === "development"; + const { login, devLogin } = useUser(); //------------------------STYLES------------------------// const loginStyles = { container: { @@ -49,7 +51,7 @@ const Login: React.FC = ({ handleSubmit }) => { @@ -57,10 +59,28 @@ const Login: React.FC = ({ handleSubmit }) => { + { isDev && + <> + + + + } diff --git a/src/app/_components/_sharedcomponents/CreateGameForm/CreateGameForm.tsx b/src/app/_components/_sharedcomponents/CreateGameForm/CreateGameForm.tsx index 36e19b92..642876cb 100644 --- a/src/app/_components/_sharedcomponents/CreateGameForm/CreateGameForm.tsx +++ b/src/app/_components/_sharedcomponents/CreateGameForm/CreateGameForm.tsx @@ -57,8 +57,7 @@ const CreateGameForm: React.FC = ({ const isCreateGamePath = pathname === "/creategame"; // Common State - const [favouriteDeck, setFavouriteDeck] = - useState("Vader Green Ramp"); + const [favouriteDeck, setFavouriteDeck] = useState(""); const [deckLink, setDeckLink] = useState(""); const [saveDeck, setSaveDeck] = useState(false); //let [deckData, setDeckData] = useState(null); Because of Async this won't set in the correct timeframe @@ -150,6 +149,7 @@ const CreateGameForm: React.FC = ({ const labelTextStyle = { mb: ".5em", + color: "white", }; const labelTextStyleSecondary = { @@ -215,7 +215,7 @@ const CreateGameForm: React.FC = ({ {/* SWUDB Deck Link Input */} - + SWUDB {' '} @@ -227,7 +227,7 @@ const CreateGameForm: React.FC = ({ (use the URL or 'Deck Link' button) - + ({ user: null, login: () => {}, + devLogin: () => {}, logout: () => {}, }); @@ -21,15 +24,15 @@ export const UserProvider: React.FC<{ children: ReactNode }> = ({ }) => { const { data: session } = useSession(); // Get session from next-auth const [user, setUser] = useState(null); + const router = useRouter(); useEffect(() => { // Keep context in sync with next-auth session if (session?.user) { setUser({ id: session.user.id || null, - name: session.user.name || null, + username: session.user.name || null, email: session.user.email || null, - image: session.user.image || null, provider: session.user.provider || null, }); } else { @@ -38,22 +41,52 @@ export const UserProvider: React.FC<{ children: ReactNode }> = ({ }, [session]); const login = (provider: "google" | "discord") => { - console.log("Logging in with", provider); - signIn(provider, { callbackUrl: "/", }); + }; + + const handleSetUser = (user: "Order66" | "ThisIsTheWay") => { + if (user === "Order66") { + setUser({ + id: "66", + username: "Order66", + email: null, + provider: null, + }); + } else if (user === "ThisIsTheWay") { + setUser({ + id: "Mandalorian", + username: "ThisIsTheWay", + email: null, + provider: null, + }); + } + } - console.log("Logged in with", provider); + const devLogin = (user: "Order66" | "ThisIsTheWay") => { + handleSetUser(user); + localStorage.setItem("devUser", user); + router.push("/"); }; + + useEffect(() => { + if (process.env.NODE_ENV === "development" && !user ) { + const storedUser = localStorage.getItem("devUser"); + if (storedUser === "Order66" || storedUser === "ThisIsTheWay") { + handleSetUser(storedUser); + } + } + }, [user]); const logout = () => { signOut(); + localStorage.removeItem("devUser"); setUser(null); }; return ( - + {children} ); diff --git a/src/app/_contexts/UserTypes.ts b/src/app/_contexts/UserTypes.ts index 53774619..624db35f 100644 --- a/src/app/_contexts/UserTypes.ts +++ b/src/app/_contexts/UserTypes.ts @@ -1,13 +1,13 @@ export interface IUser { id: string | null; - name: string | null; + username: string | null; email: string | null; - image: string | null; provider: string | null; } export interface IUserContextType { user: IUser | null; login: (provider: "google" | "discord") => void; + devLogin: (user: "Order66" | "ThisIsTheWay") => void; logout: () => void; } diff --git a/src/app/auth/page.tsx b/src/app/auth/page.tsx index 2cb59edd..ca36d303 100644 --- a/src/app/auth/page.tsx +++ b/src/app/auth/page.tsx @@ -4,10 +4,10 @@ import React from "react"; import { Box } from "@mui/material"; import KarabastBanner from "../_components/_sharedcomponents/Banner/Banner"; import Login from "../_components/Auth/Login/Login"; -import { useUser } from "../_contexts/User.context"; + const Auth: React.FC = () => { - const { login } = useUser(); + const mainContainerStyle = { position: "relative", @@ -20,7 +20,7 @@ const Auth: React.FC = () => { return ( - + ); };