refactor: improved-auth-strategy

manifest.json

@@ -7,11 +7,6 @@
     {
       "js": ["src/content-scripts/profileScreen.ts"],
       "matches": ["https://github.com/*"]
-    },
-    {
-      "js": ["src/content-scripts/hotOSHomePage.ts"],
-      "matches": ["https://hot.opensauced.pizza/*"],
-      "run_at": "document_end"
     }
   ],
   "background": {
@@ -25,5 +20,5 @@
     "128": "src/assets/os-icons/os-icon-128.png"
   },
   "host_permissions": ["<all_urls>"],
-  "permissions": ["storage","webRequest", "tabs", "cookies"]
+  "permissions": ["storage", "tabs", "cookies"]
 }

src/constants.ts

@@ -1,10 +1,8 @@
-export const SUPABASE_LOCAL_STORAGE_KEY = "supabase.auth.token";
-export const SUPABASE_AUTH_DOMAIN = "ibcwmlhcimymasokhgvn.supabase.co";
-export const SUPABASE_COOKIE_NAME = "sb-access-token";
-export const SUPABASE_LOGIN_URL = "https://ibcwmlhcimymasokhgvn.supabase.co/auth/v1/authorize?provider=github&redirect_to=https://hot.opensauced.pizza/";
-export const SUPABASE_LOGOUT_URL = "https://ibcwmlhcimymasokhgvn.supabase.co/auth/v1/logout";
+export const SUPABASE_LOGIN_URL = "https://ibcwmlhcimymasokhgvn.supabase.co/auth/v1/authorize?provider=github&redirect_to=https://insights.opensauced.pizza/";
+export const SUPABASE_AUTH_COOKIE_NAME = "supabase-auth-token";
 export const OPEN_SAUCED_AUTH_TOKEN_KEY = "os-access-token";
 export const OPEN_SAUCED_USERS_ENDPOINT = "https://api.opensauced.pizza/v1/users";
 export const OPEN_SAUCED_SESSION_ENDPOINT = "https://api.opensauced.pizza/v1/auth/session";
+export const OPEN_SAUCED_INSIGHTS_DOMAIN = "insights.opensauced.pizza";
 export const GITHUB_PROFILE_MENU_SELECTOR = ".p-nickname.vcard-username.d-block";
 export const GITHUB_PROFILE_EDIT_MENU_SELECTOR = "button.js-profile-editable-edit-button";

src/pages/profile.tsx

@@ -80,6 +80,12 @@ export const Profile = () => {
 
       <main>
         <div className="flex flex-col items-center gap-1 mb-4">
+          <a
+            className="hover:text-orange hover:scale-105"
+            href={`https://insights.opensauced.pizza/user/${page.props.userName}`}
+            rel="noopener noreferrer"
+            target="_blank"
+          >
           <img
             alt="User avatar"
             className="rounded-full w-14 aspect-square p-1 bg-slate-700"
@@ -90,12 +96,13 @@ export const Profile = () => {
             @
             {page.props.userName}
           </p>
+          </a>
 
           {(user?.linkedin_url || user?.twitter_username) &&
             <div className="social flex gap-0.5">
               {user.linkedin_url &&
                 <a
-                  className="rounded-sm border bg-slate-700 hover:bg-slate-700/50 hover:text-orange p-1"
+                  className="rounded-sm border bg-slate-700 hover:bg-slate-700/50 hover:text-cyan-400 p-1"
                   href={user.linkedin_url}
                   rel="noreferrer"
                   target="_blank"
@@ -106,7 +113,7 @@ export const Profile = () => {
 
               {user.twitter_username &&
                 <a
-                  className="rounded-sm border bg-slate-700 hover:bg-slate-700/50 hover:text-orange p-1"
+                  className="rounded-sm border bg-slate-700 hover:bg-slate-700/50 hover:text-cyan-400 p-1"
                   href={`https://twitter.com/${user.twitter_username}`}
                   rel="noreferrer"
                   target="_blank"

src/utils/checkAuthentication.ts

@@ -0,0 +1,33 @@
+import {
+  OPEN_SAUCED_AUTH_TOKEN_KEY,
+  SUPABASE_AUTH_COOKIE_NAME,
+  OPEN_SAUCED_INSIGHTS_DOMAIN,
+} from "../constants";
+import { checkTokenValidity } from "../utils/fetchOpenSaucedApiData";
+import setAccessTokenInChromeStorage from "../utils/setAccessToken";
+
+export const checkAuthentication = () => {
+    chrome.cookies.get(
+      {
+        name: SUPABASE_AUTH_COOKIE_NAME,
+        url: `https://${OPEN_SAUCED_INSIGHTS_DOMAIN}`,
+      },
+      async cookie => {
+        if (!cookie) {
+          return chrome.storage.sync.remove(OPEN_SAUCED_AUTH_TOKEN_KEY);
+        }
+        try {
+        const authCookie = JSON.parse(decodeURIComponent(cookie.value))[0];
+        const isValidToken = await checkTokenValidity(authCookie);
+
+        if (!isValidToken) {
+          return chrome.storage.sync.remove(OPEN_SAUCED_AUTH_TOKEN_KEY);
+        }
+        void setAccessTokenInChromeStorage(authCookie);
+      } catch (error) {
+        void chrome.storage.sync.remove(OPEN_SAUCED_AUTH_TOKEN_KEY);
+        console.error("Error processing cookie:", error);
+      }
+      },
+    );
+};

src/worker/background.ts

@@ -1,35 +1,20 @@
-import { SUPABASE_LOGOUT_URL, SUPABASE_AUTH_DOMAIN, SUPABASE_COOKIE_NAME, OPEN_SAUCED_AUTH_TOKEN_KEY } from "../constants";
-import { checkTokenValidity } from "../utils/fetchOpenSaucedApiData";
-import setAccessTokenInChromeStorage from "../utils/setAccessToken";
-
-chrome.webRequest.onCompleted.addListener(
-  () => {
-    void chrome.storage.sync.remove(OPEN_SAUCED_AUTH_TOKEN_KEY);
-  },
-  { urls: [SUPABASE_LOGOUT_URL] },
-);
+import { checkAuthentication } from "../utils/checkAuthentication";
+import { SUPABASE_AUTH_COOKIE_NAME, OPEN_SAUCED_INSIGHTS_DOMAIN } from "../constants";
 
 chrome.tabs.onUpdated.addListener((tabId, changeInfo) => {
   if (changeInfo.url?.includes("github.com")) {
     void chrome.tabs.sendMessage(tabId, { message: "GITHUB_URL_CHANGED" });
   }
 });
 
-chrome.cookies.onChanged.addListener(async changeInfo => {
-  try {
-    if (changeInfo.cookie.name !== SUPABASE_COOKIE_NAME || changeInfo.cookie.domain !== SUPABASE_AUTH_DOMAIN) {
-      return;
-    }
-    if (changeInfo.removed) {
-      return chrome.storage.sync.remove(OPEN_SAUCED_AUTH_TOKEN_KEY);
-    }
-    const isValidToken = await checkTokenValidity(changeInfo.cookie.value);
-
-    if (!isValidToken) {
-      return chrome.storage.sync.remove(OPEN_SAUCED_AUTH_TOKEN_KEY);
+chrome.cookies.onChanged.addListener(changeInfo => {
+    if (
+      changeInfo.cookie.name === SUPABASE_AUTH_COOKIE_NAME ||
+      changeInfo.cookie.domain === OPEN_SAUCED_INSIGHTS_DOMAIN
+    ) {
+      checkAuthentication();
     }
-    void setAccessTokenInChromeStorage(changeInfo.cookie.value);
-  } catch (error) {
-    console.error("Error processing cookie update:", error);
-  }
 });
+
+chrome.runtime.onInstalled.addListener(checkAuthentication);
+chrome.runtime.onStartup.addListener(checkAuthentication);