force users to login to discord after signing in

client/src/App.tsx

@@ -21,6 +21,7 @@ import HomePage from "./routes/home";
 import Leaderboard from "./routes/leaderboard";
 import AdminPanel from "./routes/admin";
 import HeaderNav from "./components/header";
+import DiscordCallback from "./routes/discordCallback";
 
 const router = createBrowserRouter(
   createRoutesFromElements(
@@ -35,6 +36,7 @@ const router = createBrowserRouter(
       <Route index path="/queue" element={<QueuePage />} />
       <Route index path="/leaderboard" element={<Leaderboard />} />
       <Route index path="/stats" element={<AdminPanel />} />
+      <Route path="/auth/discord/callback" element={<DiscordCallback />} />
     </Route>
   )
 );

client/src/routes/discordCallback.tsx

@@ -0,0 +1,86 @@
+import { useEffect, useState } from "react";
+import { Container, Title, Loader, Text, Anchor } from "@mantine/core";
+
+export default function DiscordCallback() {
+  const [status, setStatus] = useState("processing");
+  const [message, setMessage] = useState("Connecting Discord...");
+
+  useEffect(() => {
+    const handleDiscordCallback = async () => {
+      const urlParams = new URLSearchParams(window.location.search);
+      const code = urlParams.get('code');
+      const error = urlParams.get('error');
+
+      if (error) {
+        setStatus("error");
+        setMessage(`Discord connection failed: ${error}`);
+        return;
+      }
+
+      if (!code) {
+        setStatus("error");
+        setMessage("No authorization code received from Discord");
+        return;
+      }
+
+      try {
+        const response = await fetch('/api/auth/discord/exchange-token', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          credentials: 'include',
+          body: JSON.stringify({ code })
+        });
+
+        const data = await response.json();
+
+        if (response.ok && data.success) {
+          setStatus("success");
+          setMessage(`Discord connected: ${data.discord_tag}`);
+          setTimeout(() => {
+            window.location.href = '/home';
+          }, 2000);
+        } else {
+          setStatus("error");
+          setMessage(data.error || data.message || "Discord connection failed");
+        }
+      } catch (error) {
+        setStatus("error");
+        setMessage("Network error during Discord connection");
+        console.error('Discord error:', error);
+      }
+    };
+
+    handleDiscordCallback();
+  }, []);
+
+  return (
+    <Container size="xs" className="h-full">
+      <div className="pt-[40%] text-center">
+        {status === "processing" && (
+          <>
+            <Loader size="lg" mb="md" />
+            <Title order={3}>{message}</Title>
+          </>
+        )}
+        {status === "success" && (
+          <>
+            <Title order={3} className="text-green-500">Success!</Title>
+            <Text mt="md">{message}</Text>
+            <Text mt="sm" size="sm" className="text-gray-400">Redirecting...</Text>
+          </>
+        )}
+        {status === "error" && (
+          <>
+            <Title order={3} className="text-red-500">Connection Failed</Title>
+            <Text mt="md">{message}</Text>
+            <Text mt="md">
+              <Anchor href="/home">Back to Home</Anchor>
+            </Text>
+          </>
+        )}
+      </div>
+    </Container>
+  );
+}

client/src/routes/home.tsx

@@ -1,6 +1,37 @@
-import { Paper, Text, Title, Container, Anchor } from "@mantine/core";
+import { Paper, Text, Title, Container, Anchor, Button, Group, Badge } from "@mantine/core";
+import { useEffect, useState } from "react";
 
 export default function HomePage() {
+  const [user, setUser] = useState(null);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    // Check if user is authenticated and fetch their info
+    const checkAuth = async () => {
+      try {
+        const response = await fetch('/api/auth/whoami', {
+          credentials: 'include'
+        });
+        if (response.ok) {
+          const userData = await response.json();
+          if (userData.loggedIn) {
+            setUser(userData);
+            if (!userData.discord) {
+              window.location.href = '/api/auth/discord/login';
+              return;
+            }
+          }
+        }
+      } catch (error) {
+        console.error('Error checking auth:', error);
+      } finally {
+        setLoading(false);
+      }
+    };
+
+    checkAuth();
+  }, []);
+
   return (
     <Container size="sm" py="6rem">
       <Paper p="xl" shadow="xs" className="bg-neutral-800">
@@ -18,9 +49,37 @@ export default function HomePage() {
           page.
         </Text>
 
-        <Text className="text-2xl mt-5">More questions?</Text>
+        <Text className="text-2xl mt-5">Discord Connection</Text>
 
-        <Text>Visit our helpdesk or email us at <span></span>
+        {loading ? (
+          <Text>Checking connection status...</Text>
+        ) : user && user.loggedIn ? (
+          user.discord ? (
+            <Paper p="md" className="bg-neutral-700" mb="md">
+              <Group>
+                <div style={{ flex: 1 }}>
+                  <Group spacing="xs">
+                    <Text weight={500}>{user.discord}</Text>
+                    <Badge color="green" size="sm">Connected</Badge>
+                  </Group>
+                  <Text size="sm" color="dimmed">
+                    Mentors can reach you via Discord
+                  </Text>
+                </div>
+              </Group>
+            </Paper>
+          ) : (
+            <>
+              <Text mb="sm">Connecting Discord...</Text>
+            </>
+          )
+        ) : (
+          <Text>Please log in to connect your Discord account.</Text>
+        )}
+
+        <Text className="text-2xl mt-5">More questions?</Text>
+        <Text>
+          Visit our helpdesk or email us at <span></span>
           <Anchor href="mailto:[email protected]" target="_blank">
             [email protected]
           </Anchor>

server/config.py

@@ -11,7 +11,7 @@
 # CORS configuration
 FRONTEND_URL = os.environ.get("FRONTEND_URL", "http://localhost:6001")
 BACKEND_URL = os.environ.get("BACKEND_URL", "http://127.0.0.1:3001")
-ALLOWED_DOMAINS = [FRONTEND_URL]
+ALLOWED_DOMAINS = [BACKEND_URL]
 
 SQLALCHEMY_DATABASE_URI = os.environ.get(
     "SQLALCHEMY_DATABASE_URI", "postgresql://postgres:password@database/qstackdb"
@@ -24,10 +24,11 @@
 AUTH0_DOMAIN = os.environ.get("AUTH0_DOMAIN")
 APP_SECRET_KEY = os.environ.get("APP_SECRET_KEY")
 MENTOR_PASS = os.environ.get("MENTOR_PASS")
+DISCORD_CLIENT_ID = os.getenv("DISCORD_CLIENT_ID")
+DISCORD_CLIENT_SECRET = os.getenv("DISCORD_CLIENT_SECRET")
 
 ENV = os.environ.get("ENVIRONMENT", "development")
 
-
 AUTH_ADMINS = [
     {"name": "HackMIT", "email": "[email protected]"},
     {"name": "HackMIT", "email": "[email protected]"}

server/controllers/auth.py

@@ -6,12 +6,15 @@
 from server.models import User
 from server.config import (
     FRONTEND_URL,
+    BACKEND_URL,
     MENTOR_PASS,
     AUTH0_CLIENT_ID,
     AUTH0_CLIENT_SECRET,
     AUTH0_DOMAIN,
     AUTH_USERNAME,
-    AUTH_PASSWORD
+    AUTH_PASSWORD,
+    DISCORD_CLIENT_ID,
+    DISCORD_CLIENT_SECRET
 )
 
 auth = APIBlueprint("auth", __name__, url_prefix="/auth")
@@ -28,6 +31,15 @@
         AUTH0_DOMAIN}/.well-known/openid-configuration",
 )
 
+oauth.register(
+    "discord",
+    client_id=DISCORD_CLIENT_ID,
+    client_secret=DISCORD_CLIENT_SECRET,
+    access_token_url="https://discord.com/api/oauth2/token",
+    authorize_url="https://discord.com/api/oauth2/authorize",
+    api_base_url="https://discord.com/api/",
+    client_kwargs={"scope": "identify email"},
+)
 
 def auth_required_decorator(roles):
     """
@@ -96,6 +108,58 @@ def logout():
         )
     )
 
+@auth.route("/discord/login")
+def discord_login():
+    if "user" not in session:
+        return redirect(FRONTEND_URL + "/api/auth/login")
+
+    return oauth.discord.authorize_redirect(
+        redirect_uri=FRONTEND_URL + "/auth/discord/callback"
+    )
+
+@auth.route("/discord/exchange-token", methods=["POST"])
+def discord_exchange_token():
+    data = request.get_json()
+    code = data.get("code")
+
+    if not code:
+        return abort(400, "Missing authorization code")
+
+    # Check if user is logged in via Auth0 first
+    if "user" not in session:
+        return {"success": False, "error": "Must be logged in via Auth0 first"}
+
+    try:
+        # Exchange code for token using the Discord OAuth client
+        token = oauth.discord.fetch_access_token(
+            code=code,
+            redirect_uri=FRONTEND_URL + "/auth/discord/callback"
+        )
+
+        # Get Discord user profile
+        resp = oauth.discord.get("users/@me", token=token)
+        profile = resp.json()
+
+        # Extract Discord info
+        discord_tag = f"{profile['username']}#{profile['discriminator']}"
+        discord_id = profile['id']
+
+        # Update user in database
+        email = session["user"]["userinfo"]["email"]
+        user = User.query.filter_by(email=email).first()
+
+        if not user:
+            return {"success": False, "error": "User not found"}
+
+        user.discord = discord_tag
+        db.session.commit()
+
+        return {"success": True, "discord_tag": discord_tag}
+
+    except Exception as e:
+        return {"success": False, "error": str(e)}
+
+
 
 @auth.route("/whoami")
 def whoami():