feat: Added a configuration file (#32)

* chore: Created constants.ts for config literals

* feat: Created configuration file

src/App.tsx

@@ -1,9 +1,8 @@
 import { useState, useEffect } from "react";
-
+import { OPEN_SAUCED_AUTH_TOKEN_KEY } from "./constants";
 import Start from "./pages/start";
 import Home from "./pages/home";
 import Loading from "./pages/loading";
-
 import { checkTokenValidity } from "./utils/fetchOpenSaucedApiData";
 
 function App() {
@@ -12,14 +11,15 @@ function App() {
   const [renderedPage, setRenderedPage] = useState("loading");
 
   useEffect(() => {
-    chrome.storage.sync.get(["os-access-token"], (result) => {
-      if (result["os-access-token"]) {
-        checkTokenValidity(result["os-access-token"]).then((valid) => {
+    chrome.storage.sync.get([OPEN_SAUCED_AUTH_TOKEN_KEY], (result) => {
+      const authToken: string | undefined = result[OPEN_SAUCED_AUTH_TOKEN_KEY];
+      if (authToken) {
+        checkTokenValidity(authToken).then((valid) => {
           if (!valid) {
             setOsAccessToken("");
             setRenderedPage("signin");
           } else {
-            setOsAccessToken(result["os-access-token"]);
+            setOsAccessToken(authToken);
             setRenderedPage("home");
           }
         });

src/constants.ts

@@ -0,0 +1,8 @@
+export const SUPABASE_LOCAL_STORAGE_KEY = "supabase.auth.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 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 GITHUB_PROFILE_MENU_SELECTOR = ".p-nickname.vcard-username.d-block"
+export const GITHUB_PROFILE_EDIT_MENU_SELECTOR = "button.js-profile-editable-edit-button"

src/content-scripts/hotOSHomePage.ts

@@ -1,10 +1,11 @@
 import { checkTokenValidity } from "../utils/fetchOpenSaucedApiData";
 import getAccessToken from "../utils/getAccessToken";
 import setAccessTokenInChromeStorage from "../utils/setAccessToken";
+import {OPEN_SAUCED_AUTH_TOKEN_KEY} from "../constants";
 
 const processHotOSHomePage = async () => {
-  const data = await chrome.storage.sync.get(["os-access-token"]);
-  if (data["os-access-token"]) return;
+  const data = await chrome.storage.sync.get([OPEN_SAUCED_AUTH_TOKEN_KEY]);
+  if (data[OPEN_SAUCED_AUTH_TOKEN_KEY]) return;
   try {
     const accessToken = getAccessToken();
     if (!accessToken) return;

src/content-scripts/profileScreen.ts

@@ -1,12 +1,12 @@
 import { getGithubUsername } from "../utils/urlMatchers";
-import { getOpenSaucedUser } from "../utils/fetchOpenSaucedApiData";
+import { isOpenSaucedUser } from "../utils/fetchOpenSaucedApiData";
 import injectViewOnOpenSauced from "../utils/dom-utils/viewOnOpenSauced";
 import injectInviteToOpenSauced from "../utils/dom-utils/inviteToOpenSauced";
 
 const processProfilePage = async () => {
 const username = getGithubUsername(window.location.href);
 if (username != null) {
-  const openSaucedUser = await getOpenSaucedUser(username);
+  const openSaucedUser = await isOpenSaucedUser(username);
   if (openSaucedUser) injectViewOnOpenSauced(username);
   else injectInviteToOpenSauced(username);
 }

src/pages/start.tsx

@@ -1,4 +1,5 @@
 import OpenSaucedLogo from "../assets/opensauced-logo.svg";
+import { SUPABASE_LOGIN_URL } from "../constants";
 
 interface StartProps {
   setRenderedPage: (page: string) => void;
@@ -21,7 +22,7 @@ function Start({ setRenderedPage }: StartProps) {
       <a
         target="_blank"
         rel="noopener noreferrer"
-        href="https://ibcwmlhcimymasokhgvn.supabase.co/auth/v1/authorize?provider=github&redirect_to=https://hot.opensauced.pizza/"
+        href={SUPABASE_LOGIN_URL}
         className="bg-orange no-underline border-none rounded-md text-white font-bold py-2 px-4 cursor-pointer
           bg-gradient-to-r from-[#e67e22] to-[#d35400]"
       >

src/utils/dom-utils/inviteToOpenSauced.ts

@@ -1,3 +1,4 @@
+import { GITHUB_PROFILE_MENU_SELECTOR } from "../../constants";
 import { InviteToOpenSaucedButton } from "../../content-scripts/components/InviteToOpenSauced/InviteToOpenSaucedButton";
 import { InviteToOpenSaucedModal } from "../../content-scripts/components/InviteToOpenSauced/InviteToOpenSaucedModal";
 import { getTwitterUsername, getLinkedInUsername } from "../urlMatchers";
@@ -23,7 +24,7 @@ const injectOpenSaucedInviteButton = (username: string) => {
     linkedInUsername,
   }, inviteToOpenSaucedButton);
 
-  const userBio = document.querySelector(".p-nickname.vcard-username.d-block");
+  const userBio = document.querySelector(GITHUB_PROFILE_MENU_SELECTOR);
   if (!userBio || !userBio.parentNode) return;
   userBio.parentNode.replaceChild(inviteToOpenSaucedButton, userBio);
   document.body.appendChild(inviteToOpenSaucedModal);

src/utils/dom-utils/viewOnOpenSauced.ts

@@ -1,10 +1,11 @@
+import { GITHUB_PROFILE_MENU_SELECTOR, GITHUB_PROFILE_EDIT_MENU_SELECTOR } from "../../constants";
 import { ViewOnOpenSaucedButton } from "../../content-scripts/components/ViewOnOpenSaucedButton/ViewOnOpenSaucedButton";
 
 const injectViewOnOpenSaucedButton = (username: string) => {
   const viewOnOpenSaucedButton = ViewOnOpenSaucedButton(username);
 
   const userBio = document.querySelector(
-    ".p-nickname.vcard-username.d-block, button.js-profile-editable-edit-button"
+    `${GITHUB_PROFILE_MENU_SELECTOR}, ${GITHUB_PROFILE_EDIT_MENU_SELECTOR}`
   );
   if (!userBio || !userBio.parentNode) return;
   userBio.parentNode.replaceChild(viewOnOpenSaucedButton, userBio);

src/utils/fetchOpenSaucedApiData.ts

@@ -1,7 +1,9 @@
-export const getOpenSaucedUser = async (username: string) => {
+import { OPEN_SAUCED_USERS_ENDPOINT, OPEN_SAUCED_SESSION_ENDPOINT } from "../constants";
+
+export const isOpenSaucedUser = async (username: string) => {
   try {
     const response = await fetch(
-      `https://api.opensauced.pizza/v1/users/${username}`
+      `${OPEN_SAUCED_USERS_ENDPOINT}/${username}`
     );
     return response.status === 200;
   } catch (error) {
@@ -10,8 +12,7 @@ export const getOpenSaucedUser = async (username: string) => {
 };
 
 export const checkTokenValidity = async (token: string) => {
-  const url = "https://api.opensauced.pizza/v1/auth/session";
-  const response = await fetch(url, {
+  const response = await fetch(OPEN_SAUCED_SESSION_ENDPOINT, {
     method: "GET",
     headers: {
       Authorization: `Bearer ${token}`,

src/utils/getAccessToken.ts

@@ -1,5 +1,7 @@
+import { SUPABASE_LOCAL_STORAGE_KEY } from "../constants";
+
 const getAccessToken = (): string | null => {
-    const localStore = window.localStorage.getItem("supabase.auth.token");
+    const localStore = window.localStorage.getItem(SUPABASE_LOCAL_STORAGE_KEY);
     if (localStore === null) return null;
     return JSON.parse(localStore)?.currentSession?.access_token;
   };

src/utils/setAccessToken.ts

@@ -1,6 +1,8 @@
+import { OPEN_SAUCED_AUTH_TOKEN_KEY } from "../constants";
+
 const setAccessTokenInChromeStorage = (accessToken: string): Promise<void> => {
     return new Promise((resolve, reject) => {
-      chrome.storage.sync.set({ "os-access-token": accessToken }, () => {
+      chrome.storage.sync.set({ [OPEN_SAUCED_AUTH_TOKEN_KEY]: accessToken }, () => {
         if (chrome.runtime.lastError) {
           reject(chrome.runtime.lastError);
         } else {

src/worker/background.ts

@@ -1,8 +1,8 @@
+import  { SUPABASE_LOGOUT_URL, OPEN_SAUCED_AUTH_TOKEN_KEY } from "../constants";
+
 chrome.webRequest.onCompleted.addListener(
     (details) => {
-      chrome.storage.sync.remove("os-access-token");
+      chrome.storage.sync.remove(OPEN_SAUCED_AUTH_TOKEN_KEY);
     },
-    { urls: ["https://ibcwmlhcimymasokhgvn.supabase.co/auth/v1/logout"] }
-  );
-
-export {};
+    { urls: [SUPABASE_LOGOUT_URL] }
+  );