Auto-fix linting errors with lint:fix(--lint)

src/App.tsx

@@ -6,46 +6,44 @@ import Loading from "./pages/loading";
 import { Profile } from "./pages/profile";
 import { useAuth } from "./hooks/useAuth";
 
-export const RouteContext = createContext<{page: {name: string, props?: any}, setCurrentPage: (page: RouteKeys, props?: any) => void}>({page: {name: "loading"}, setCurrentPage: () => {}});
+export const RouteContext = createContext<{ page: { name: string, props?: any }, setCurrentPage:(page: RouteKeys, props?: any) => void }>({ page: { name: "loading" }, setCurrentPage: () => {} });
 
 const routes = {
   start: <Start />,
   home: <Home />,
   loading: <Loading />,
-  profile: <Profile />
-}
+  profile: <Profile />,
+};
 
 type RouteKeys = keyof typeof routes;
 
-function App() {
-  const {isTokenValid} = useAuth()
-  const [renderedPage, setRenderedPage] = useState<{name: RouteKeys, props?: any}>({name: "loading", props: {}});
+const App = () => {
+  const { isTokenValid } = useAuth();
+  const [renderedPage, setRenderedPage] = useState<{ name: RouteKeys, props?: any }>({ name: "loading", props: {} });
 
   const setCurrentPage = (name: RouteKeys, props: any = {}) => {
-    setRenderedPage({name: name, props})
-  }
+    setRenderedPage({ name, props });
+  };
 
 
   useEffect(() => {
-    if(isTokenValid === null) {
-      setCurrentPage("loading")
-    }
-    else if(isTokenValid) {
-      setCurrentPage("home")
-    } 
-    else {
-      setCurrentPage("start")
+    if (isTokenValid === null) {
+      setCurrentPage("loading");
+    } else if (isTokenValid) {
+      setCurrentPage("home");
+    } else {
+      setCurrentPage("start");
     }
   }, [isTokenValid]);
 
   return (
-    <RouteContext.Provider value={{page: renderedPage, setCurrentPage: setCurrentPage}}>
+    <RouteContext.Provider value={{ page: renderedPage, setCurrentPage }}>
       <div className="p-4 bg-slate-800">
         {routes[renderedPage.name]}
-        </div>
+      </div>
     </RouteContext.Provider>
-    
+
   );
-}
+};
 
 export default App;

src/constants.ts

@@ -1,10 +1,10 @@
-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 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"
+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 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/components/InviteToOpenSauced/InviteToOpenSaucedButton.ts

@@ -16,5 +16,6 @@ export const InviteToOpenSaucedButton = () => {
         <span>Invite to OpenSauced</span>
         `,
   });
+
   return inviteToOpenSaucedButton;
 };

src/content-scripts/components/InviteToOpenSauced/InviteToOpenSaucedModal.ts

@@ -12,53 +12,52 @@ interface Socials {
 
 export const InviteToOpenSaucedModal = (
   username: string,
-  { emailAddress, twitterUsername, linkedInUsername }: Socials = {}, modalDisplayTrigger?: HTMLElement
+  { emailAddress, twitterUsername, linkedInUsername }: Socials = {},
+  modalDisplayTrigger?: HTMLElement,
 ) => {
   const emailBody =
     typeof emailAddress === "string" &&
     `Hey ${username}. I'm using OpenSauced to keep track of my contributions and discover new projects. Check it out at https://opensauced.pizza/`;
   const emailHref =
     typeof emailAddress === "string" &&
     `mailto:${emailAddress}?subject=${encodeURIComponent(
-      "Invitation to join OpenSauced!"
+      "Invitation to join OpenSauced!",
     )}&body=${encodeURIComponent(emailBody)}`;
   const tweetHref =
     typeof twitterUsername === "string" &&
     `https://twitter.com/intent/tweet?text=${encodeURIComponent(
-      `Check out @saucedopen. The platform for open source contributors to find their next contribution. https://opensauced.pizza/blog/social-coding-is-back. @${twitterUsername}`
+      `Check out @saucedopen. The platform for open source contributors to find their next contribution. https://opensauced.pizza/blog/social-coding-is-back. @${twitterUsername}`,
     )}&hashtags=opensource,github`;
   const linkedinHref =
     typeof linkedInUsername === "string" &&
     `https://www.linkedin.com/in/${linkedInUsername}`;
 
   const emailIcon = emailBody
     ? createHtmlElement("a", {
-        href: emailHref,
-        innerHTML: `<img src=${chrome.runtime.getURL(
-          emailSocialIcon
-        )} alt="Email">`,
-      })
+      href: emailHref,
+      innerHTML: `<img src=${chrome.runtime.getURL(
+        emailSocialIcon,
+      )} alt="Email">`,
+    })
     : "";
   const twitterIcon = tweetHref
     ? createHtmlElement("a", {
-        href: tweetHref,
-        innerHTML: `<img src=${chrome.runtime.getURL(
-          twitterSocialIcon
-        )} alt="Twitter">`,
-      })
+      href: tweetHref,
+      innerHTML: `<img src=${chrome.runtime.getURL(
+        twitterSocialIcon,
+      )} alt="Twitter">`,
+    })
     : "";
   const linkedInIcon = linkedinHref
     ? createHtmlElement("a", {
-        href: linkedinHref,
-        innerHTML: `<img src=${chrome.runtime.getURL(
-          linkedInSocailIcon
-        )} alt="LinkedIn">`,
-      })
+      href: linkedinHref,
+      innerHTML: `<img src=${chrome.runtime.getURL(
+        linkedInSocailIcon,
+      )} alt="LinkedIn">`,
+    })
     : "";
 
-  const socialIcons = createHtmlElement("span", {
-    className: "flex flex-nowrap space-x-3",
-  });
+  const socialIcons = createHtmlElement("span", { className: "flex flex-nowrap space-x-3" });
 
   const inviteToOpenSaucedModal = createHtmlElement("div", {
     className:
@@ -80,15 +79,18 @@ export const InviteToOpenSaucedModal = (
 `,
   });
 
-  inviteToOpenSaucedModal.onclick = (e) => {
-    if (e.target === inviteToOpenSaucedModal)
+  inviteToOpenSaucedModal.onclick = e => {
+    if (e.target === inviteToOpenSaucedModal) {
       inviteToOpenSaucedModal.style.display = "none";
+    }
   };
 
-  if (modalDisplayTrigger) modalDisplayTrigger.onclick = () => {
-    inviteToOpenSaucedModal.style.display = "block";
-  };
-
+  if (modalDisplayTrigger) {
+    modalDisplayTrigger.onclick = () => {
+      inviteToOpenSaucedModal.style.display = "block";
+    };
+  }
+
   socialIcons.replaceChildren(emailIcon, twitterIcon, linkedInIcon);
   inviteToOpenSaucedModalContainer.appendChild(socialIcons);
   inviteToOpenSaucedModal.appendChild(inviteToOpenSaucedModalContainer);

src/content-scripts/components/ViewOnOpenSaucedButton/ViewOnOpenSaucedButton.ts

@@ -20,5 +20,6 @@ export const ViewOnOpenSaucedButton = (username: string) => {
     <span>View On OpenSauced</span>
     `,
   });
+
   return viewOnOpenSaucedButton;
 };

src/content-scripts/hotOSHomePage.ts

@@ -1,23 +1,32 @@
 import { checkTokenValidity } from "../utils/fetchOpenSaucedApiData";
 import getAccessToken from "../utils/getAccessToken";
 import setAccessTokenInChromeStorage from "../utils/setAccessToken";
-import {OPEN_SAUCED_AUTH_TOKEN_KEY} from "../constants";
+import { OPEN_SAUCED_AUTH_TOKEN_KEY } from "../constants";
 
 const processHotOSHomePage = async () => {
   const data = await chrome.storage.sync.get([OPEN_SAUCED_AUTH_TOKEN_KEY]);
-  if (data[OPEN_SAUCED_AUTH_TOKEN_KEY]) return;
+
+  if (data[OPEN_SAUCED_AUTH_TOKEN_KEY]) {
+    return;
+  }
   try {
     const accessToken = getAccessToken();
-    if (!accessToken) return;
+
+    if (!accessToken) {
+      return;
+    }
 
     const isValid = await checkTokenValidity(accessToken);
-    if (!isValid) return;
+
+    if (!isValid) {
+      return;
+    }
 
     await setAccessTokenInChromeStorage(accessToken);
   } catch (error) {
     console.error("Error processing Hot home page:", error);
   }
 };
 
-//The local storage takes time to set after the document is idle
+// the local storage takes time to set after the document is idle
 setTimeout(processHotOSHomePage, 1000);

src/content-scripts/profileScreen.ts

@@ -4,18 +4,23 @@ 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 user = await isOpenSaucedUser(username);
-  if (user) injectViewOnOpenSauced(username);
-  else injectInviteToOpenSauced(username);
-}
+  const username = getGithubUsername(window.location.href);
+
+  if (username !== null) {
+    const user = await isOpenSaucedUser(username);
+
+    if (user) {
+      injectViewOnOpenSauced(username);
+    } else {
+      injectInviteToOpenSauced(username);
+    }
+  }
 };
 
-chrome.runtime.onMessage.addListener((request) => {
+chrome.runtime.onMessage.addListener(async request => {
   if (request.message === "GITHUB_URL_CHANGED") {
-    processProfilePage();
+    await processProfilePage();
   }
 });
 
-processProfilePage();
+void processProfilePage();

src/hooks/useOpensaucedUserCheck.ts

@@ -1,27 +1,29 @@
-import { useEffect, useState } from "react"
-import { isOpenSaucedUser } from "../utils/fetchOpenSaucedApiData"
-import { getGithubUsername } from "../utils/urlMatchers"
+import { useEffect, useState } from "react";
+import { isOpenSaucedUser } from "../utils/fetchOpenSaucedApiData";
+import { getGithubUsername } from "../utils/urlMatchers";
 
 export const useOpensaucedUserCheck = () => {
-  const [currentTabIsOpensaucedUser, setCurrentTabIsOpensaucedUser] = useState(false)
-  const [checkedUser, setCheckedUser] = useState<string|null>(null)
+  const [currentTabIsOpensaucedUser, setCurrentTabIsOpensaucedUser] = useState(false);
+  const [checkedUser, setCheckedUser] = useState<string|null>(null);
+
   useEffect(() => {
-    //get active tab
-    chrome.tabs.query({ active: true, currentWindow: true }, async (tabs) => {
+    // get active tab
+    chrome.tabs.query({ active: true, currentWindow: true }, async tabs => {
       if (tabs.length > 0) {
-        const tab = tabs[0]
-        const username = getGithubUsername(tab.url!)
-        if(username != null) {
-          setCheckedUser(username)
-          setCurrentTabIsOpensaucedUser(await isOpenSaucedUser(username))
+        const tab = tabs[0];
+        const username = getGithubUsername(tab.url!);
+
+        if (username !== null) {
+          setCheckedUser(username);
+          setCurrentTabIsOpensaucedUser(await isOpenSaucedUser(username));
         } else {
-          setCheckedUser(null)
-          setCurrentTabIsOpensaucedUser(false)
-        }       
+          setCheckedUser(null);
+          setCurrentTabIsOpensaucedUser(false);
+        }
       }
-    })
-  }, [])
-  
+    });
+  }, []);
+
 
-  return { currentTabIsOpensaucedUser, checkedUser }
-}
+  return { currentTabIsOpensaucedUser, checkedUser };
+};

src/main.tsx

@@ -1,10 +1,10 @@
-import React from 'react'
-import ReactDOM from 'react-dom/client'
-import App from './App'
-import './popup.css'
+import React from "react";
+import ReactDOM from "react-dom/client";
+import App from "./App";
+import "./popup.css";
 
-ReactDOM.createRoot(document.getElementById('root')!).render(
+ReactDOM.createRoot(document.getElementById("root")!).render(
   <React.StrictMode>
     <App />
-  </React.StrictMode>
-)
+  </React.StrictMode>,
+);