add localstorage as fallback if cookie can't be used to get and set s…

…ession id
nattvara · Apr 18, 2024 · e163d39 · e163d39
1 parent adfee82
commit e163d39
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 30 deletions.
diff --git a/gui/api/chat.ts b/gui/api/chat.ts
@@ -1,6 +1,4 @@
-import Cookies from "js-cookie";
-
-import { HttpError, makeUrl } from "@/api/http";
+import { HttpError, getSessionId, makeUrl } from "@/api/http";
 
 export interface Faq {
   faq_id: string;
@@ -65,7 +63,7 @@ export class ChatNotFoundError extends Error {
 }
 
 export async function fetchCourse(canvasId: string): Promise<Course> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/course/${canvasId}`), {
     method: "GET",
@@ -85,7 +83,7 @@ export async function fetchCourse(canvasId: string): Promise<Course> {
 }
 
 export async function fetchChats(canvasId: string): Promise<Chats> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/course/${canvasId}/chat`), {
     method: "GET",
@@ -105,7 +103,7 @@ export async function fetchChats(canvasId: string): Promise<Chats> {
 }
 
 export async function startChat(canvasId: string): Promise<Chat> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/course/${canvasId}/chat`), {
     method: "POST",
@@ -125,7 +123,7 @@ export async function startChat(canvasId: string): Promise<Chat> {
 }
 
 export async function fetchChat(canvasId: string, chatId: string): Promise<Chat> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/course/${canvasId}/chat/${chatId}`), {
     method: "GET",
@@ -149,7 +147,7 @@ export async function fetchChat(canvasId: string, chatId: string): Promise<Chat>
 }
 
 export async function fetchMessages(canvasId: string, chatId: string): Promise<Messages> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/course/${canvasId}/chat/${chatId}/messages`), {
     method: "GET",
@@ -169,7 +167,7 @@ export async function fetchMessages(canvasId: string, chatId: string): Promise<M
 }
 
 export async function fetchMessage(canvasId: string, chatId: string, messageId: string): Promise<Message> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/course/${canvasId}/chat/${chatId}/messages/${messageId}`), {
     method: "GET",
@@ -189,7 +187,7 @@ export async function fetchMessage(canvasId: string, chatId: string, messageId:
 }
 
 export async function sendMessage(canvasId: string, chatId: string, content: string): Promise<Message> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/course/${canvasId}/chat/${chatId}/messages`), {
     method: "POST",
@@ -212,7 +210,7 @@ export async function sendMessage(canvasId: string, chatId: string, content: str
 }
 
 export async function sendMessageUsingFaq(canvasId: string, chatId: string, faqId: string): Promise<Message> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/course/${canvasId}/chat/${chatId}/messages`), {
     method: "POST",

diff --git a/gui/api/feedback.ts b/gui/api/feedback.ts
@@ -1,6 +1,4 @@
-import Cookies from "js-cookie";
-
-import { HttpError, makeUrl } from "@/api/http";
+import { HttpError, getSessionId, makeUrl } from "@/api/http";
 
 export const UNANSWERED = "UNANSWERED";
 
@@ -14,7 +12,7 @@ export interface Feedback {
 }
 
 export async function fetchFeedbackQuestions(feedbackId: string): Promise<Feedback> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/feedback/${feedbackId}`), {
     method: "GET",
@@ -34,7 +32,7 @@ export async function fetchFeedbackQuestions(feedbackId: string): Promise<Feedba
 }
 
 export async function sendFeedback(feedback_id: string, choice: string): Promise<Feedback> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/feedback/${feedback_id}`), {
     method: "POST",

diff --git a/gui/api/http.ts b/gui/api/http.ts
@@ -1,3 +1,26 @@
+import Cookies from "js-cookie";
+
+export function getSessionId() {
+  let sessionId = Cookies.get("session_id");
+
+  if (!sessionId) {
+    const local = localStorage.getItem("session_id");
+    if (local) {
+      sessionId = local;
+    }
+  }
+
+  return sessionId;
+}
+
+export function setSessionId(sessionId: string) {
+  try {
+    Cookies.set("session_id", sessionId, { expires: 365, secure: true, sameSite: "None" });
+  } catch (e) {
+    localStorage.setItem("session_id", sessionId);
+  }
+}
+
 export class HttpError extends Error {
   public statusCode: number;
   public statusText: string;

diff --git a/gui/api/session.ts b/gui/api/session.ts
@@ -1,6 +1,4 @@
-import Cookies from "js-cookie";
-
-import { HttpError, makeUrl } from "./http";
+import { HttpError, getSessionId, makeUrl } from "./http";
 
 export interface Session {
   public_id: string;
@@ -34,7 +32,7 @@ export async function startSession(): Promise<Session> {
 }
 
 export async function getSession(): Promise<Session> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/session/me`), {
     method: "GET",
@@ -54,7 +52,7 @@ export async function getSession(): Promise<Session> {
 }
 
 export async function grantConsent(): Promise<Consent> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/session/consent`), {
     method: "POST",
@@ -77,7 +75,7 @@ export async function grantConsent(): Promise<Consent> {
 }
 
 export async function grantAdminAccess(adminToken: string): Promise<GrantAdmin> {
-  const sessionCookie = Cookies.get("session_id") as string;
+  const sessionCookie = getSessionId() as string;
 
   const response = await fetch(makeUrl(`/session/grant_admin/${adminToken}`), {
     method: "POST",

diff --git a/gui/pages/_app.tsx b/gui/pages/_app.tsx
@@ -5,7 +5,6 @@ import { Notifications } from "@mantine/notifications";
 import "@mantine/notifications/styles.css";
 import { IconPlugConnectedX } from "@tabler/icons-react";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import Cookies from "js-cookie";
 import { appWithTranslation, useTranslation } from "next-i18next";
 import { AppProps } from "next/app";
 import Head from "next/head";
@@ -14,7 +13,7 @@ import { useEffect, useRef, useState } from "react";
 
 import { HeaderNavbar } from "@/components/navigation";
 
-import { HttpError } from "@/api/http";
+import { HttpError, getSessionId, setSessionId } from "@/api/http";
 import { getSession, startSession } from "@/api/session";
 
 import { theme } from "../theme";
@@ -33,16 +32,13 @@ function App({ Component, pageProps }: AppProps) {
       if (!sessionInitiated.current) {
         sessionInitiated.current = true;
 
-        const sessionCookie = Cookies.get("session_id");
+        const sessionCookie = getSessionId() as string;
         const startNewSession = async () => {
           console.log("Starting new session");
 
           const newSession = await startSession();
-          Cookies.set("session_id", newSession.public_id, {
-            expires: 365,
-            sameSite: "None",
-            secure: true,
-          });
+          console.log(newSession);
+          setSessionId(newSession.public_id);
           setValidSession(true);
         };