Add functionality to match button

Author: WZWren

peerprep/api/gateway.ts

@@ -1,11 +1,11 @@
 import { cookies } from "next/headers";
-import { LoginResponse, Question, SigninResponse, StatusBody } from "./structs";
+import { LoginResponse, Question, UserServiceResponse, StatusBody } from "./structs";
 import DOMPurify from "isomorphic-dompurify";
 
 export function generateAuthHeaders() {
   return {
-    Authorization: `Bearer ${cookies().get("session")}`,
-  };
+    "Authorization": `Bearer ${cookies().get("session")?.value}`,
+  };;
 }
 
 export function generateJSONHeaders() {
@@ -75,7 +75,7 @@ export async function postSignupUser(validatedFields: {
   username: string;
   email: string;
   password: string;
-}): Promise<SigninResponse | StatusBody> {
+}): Promise<UserServiceResponse | StatusBody> {
   try {
     console.log(JSON.stringify(validatedFields));
     const res = await fetch(`${process.env.NEXT_PUBLIC_USER_SERVICE}/users`, {
@@ -97,3 +97,23 @@ export async function postSignupUser(validatedFields: {
     return { error: err.message, status: 400 };
   }
 }
+
+export async function verifyUser(): Promise<UserServiceResponse | StatusBody> {
+  try {
+    const res = await fetch(
+      `${process.env.NEXT_PUBLIC_USER_SERVICE}/auth/verify-token`,
+      {
+        method: "GET",
+        headers: generateAuthHeaders(),
+      }
+    );
+    const json = await res.json();
+
+    if (!res.ok) {
+      return { error: json.message, status: res.status };
+    }
+    return json;
+  } catch (err: any) {
+    return { error: err.message, status: 400 };
+  }
+}

peerprep/api/structs.ts

@@ -43,7 +43,7 @@ export interface LoginResponse {
   data: UserDataAccessToken;
 }
 
-export interface SigninResponse {
+export interface UserServiceResponse {
   message: string;
   data: UserData;
 }

peerprep/app/actions/server_actions.ts

@@ -1,14 +1,16 @@
 "use server";
-import { getSessionLogin, postSignupUser } from "@/api/gateway";
+import { getSessionLogin, postSignupUser, verifyUser } from "@/api/gateway";
 // defines the server-sided login action.
 import {
   SignupFormSchema,
   LoginFormSchema,
   FormState,
   isError,
+  UserServiceResponse,
 } from "@/api/structs";
-import { createSession } from "@/app/actions/session";
+import { createSession, expireSession } from "@/app/actions/session";
 import { redirect } from "next/navigation";
+import { cookies } from "next/headers";
 
 // credit - taken from Next.JS Auth tutorial
 export async function signup(state: FormState, formData: FormData) {
@@ -59,3 +61,18 @@ export async function login(state: FormState, formData: FormData) {
     console.log(json.error);
   }
 }
+
+export async function hydrateUid(): Promise<undefined|string> {
+  if (!cookies().has("session")) {
+    console.log("No session found - triggering switch back to login page.");
+    redirect("/auth/login");
+  }
+  const json = await verifyUser();
+  if (isError(json)) {
+    console.log("Failed to fetch user ID.");
+    console.log(`Error ${json.status}: ${json.error}`);
+    redirect("/api/internal/auth/expire");
+  }
+
+  return json.data.id;
+}

peerprep/app/actions/session.ts

@@ -11,3 +11,7 @@ export async function createSession(accessToken: string) {
     path: "/",
   });
 }
+
+export async function expireSession() {
+  cookies().delete("session");
+}

peerprep/app/api/internal/auth/expire/route.ts

@@ -0,0 +1,9 @@
+import { expireSession } from "@/app/actions/session";
+import { NextRequest, NextResponse } from "next/server";
+
+export async function GET(request: NextRequest) {
+  await expireSession();
+  const url = request.nextUrl.clone();
+  url.pathname = "/auth/login";
+  return NextResponse.redirect(url);
+}

peerprep/app/api/internal/questions/route.ts

@@ -1,5 +1,4 @@
 import { generateAuthHeaders, generateJSONHeaders } from "@/api/gateway";
-import { QuestionFullBody } from "@/api/structs";
 import { NextRequest, NextResponse } from "next/server";
 
 export async function GET() {

peerprep/app/questions/page.tsx

@@ -3,10 +3,12 @@ import QuestionList from "@/components/questionpage/QuestionList";
 import Matchmaking from "@/components/questionpage/Matchmaking";
 import { QuestionFilterProvider } from "@/contexts/QuestionFilterContext";
 import { UserInfoProvider } from "@/contexts/UserInfoContext";
+import { hydrateUid } from "../actions/server_actions";
 
-const QuestionsPage = () => {
+async function QuestionsPage() {
+  const userId = await hydrateUid();
   return (
-    <UserInfoProvider>
+    <UserInfoProvider userid={userId}>
       <QuestionFilterProvider>
         <Matchmaking></Matchmaking>
         <QuestionList></QuestionList>

peerprep/components/questionpage/Matchmaking.tsx

@@ -9,8 +9,6 @@ import {
   checkMatchStatus,
   findMatch,
 } from "@/app/api/internal/matching/helper";
-import { match } from "assert";
-import { TIMEOUT } from "dns";
 
 const QUERY_INTERVAL_MILLISECONDS = 5000;
 const TIMEOUT_MILLISECONDS = 30000;

peerprep/contexts/UserInfoContext.tsx

@@ -4,22 +4,23 @@
 "use client";
 import React, { createContext, useContext, useState, ReactNode } from "react";
 
+interface UserInfoProviderProps {
+  userid: string|undefined,
+  children: ReactNode
+}
+
 interface UserInfoContextType {
   userid: string;
-  setUserid: (userid: string) => void;
 }
 
 const UserInfoContext = createContext<UserInfoContextType | undefined>(
   undefined
 );
 
-export const UserInfoProvider: React.FC<{ children: ReactNode }> = ({
-  children,
-}) => {
-  const [userid, setUserid] = useState<string>("test-user");
-
+export function UserInfoProvider({ userid, children }: UserInfoProviderProps) {
+  const val = userid ? userid : "";
   return (
-    <UserInfoContext.Provider value={{ userid, setUserid }}>
+    <UserInfoContext.Provider value={{ userid: val }}>
       {children}
     </UserInfoContext.Provider>
   );