chore: add .env files (#151)

.env.development

@@ -0,0 +1,3 @@
+VITE_OPEN_SAUCED_INSIGHTS_DOMAIN = "beta.insights.opensauced.pizza"
+VITE_OPEN_SAUCED_API_ENDPOINT = "https://beta.api.opensauced.pizza/v1"
+VITE_OPEN_SAUCED_SUPABASE_ID = "fcqqkxwlntnrtjfbcioz"

.env.production

@@ -0,0 +1,3 @@
+VITE_OPEN_SAUCED_INSIGHTS_DOMAIN = "insights.opensauced.pizza"
+VITE_OPEN_SAUCED_API_ENDPOINT = "https://api.opensauced.pizza/v1"
+VITE_OPEN_SAUCED_SUPABASE_ID = "ibcwmlhcimymasokhgvn"

README.md

@@ -38,12 +38,23 @@ To install the project dependencies:
 npm ci
 ```
 
+
 To run a local instance of the project:
 
+### On development environment
+
 ```shell
 npm run dev
 ```
 
+### On Production environment 
+
+```shell
+npm run build
+npm run preview
+```
+
+
 ## Installing the local build on a Chromium based browser:
 After running the above commands,
 1. Navigate to `chrome://extensions`. 

manifest.json

@@ -20,6 +20,6 @@
  "48": "src/assets/os-icons/os-icon-48.png",
  "128": "src/assets/os-icons/os-icon-128.png"
  },
- "host_permissions": ["https://github.com/*", "https://insights.opensauced.pizza/*"],
+ "host_permissions": ["https://github.com/*", "https://*.insights.opensauced.pizza/*"],
  "permissions": ["storage", "tabs", "cookies"]
 }

src/constants.ts

@@ -1,20 +1,23 @@
 // OpenSauced constants
-export const SUPABASE_LOGIN_URL = "https://ibcwmlhcimymasokhgvn.supabase.co/auth/v1/authorize?provider=github&redirect_to=https://insights.opensauced.pizza/";
+export const OPEN_SAUCED_INSIGHTS_DOMAIN = import.meta.env.VITE_OPEN_SAUCED_INSIGHTS_DOMAIN;
+export const OPEN_SAUCED_API_ENDPOINT = import.meta.env.VITE_OPEN_SAUCED_API_ENDPOINT;
+export const SUPABASE_LOGIN_URL = `https://${import.meta.env.VITE_OPEN_SAUCED_SUPABASE_ID}.supabase.co/auth/v1/authorize?provider=github&redirect_to=https://${OPEN_SAUCED_INSIGHTS_DOMAIN}/`;
+
+
 export const SUPABASE_AUTH_COOKIE_NAME = "supabase-auth-token";
 export const OPEN_SAUCED_AUTH_TOKEN_KEY = "os-access-token";
 export const OPEN_SAUCED_OPTED_LOG_OUT_KEY = "opted-log-out";
-export const OPEN_SAUCED_INSIGHTS_DOMAIN = "insights.opensauced.pizza";
 export const AI_PR_DESCRIPTION_CONFIG_KEY = "ai-pr-description-config";
 
-// API endpoints
-export const OPEN_SAUCED_API_ENDPOINT = "https://api.opensauced.pizza/v1";
+
 export const OPEN_SAUCED_USERS_ENDPOINT = `${OPEN_SAUCED_API_ENDPOINT}/users`;
 export const OPEN_SAUCED_REPOS_ENDPOINT = `${OPEN_SAUCED_API_ENDPOINT}/repos`;
 export const OPEN_SAUCED_SESSION_ENDPOINT = `${OPEN_SAUCED_API_ENDPOINT}/auth/session`;
 export const OPEN_SAUCED_USER_INSIGHTS_ENDPOINT = `${OPEN_SAUCED_API_ENDPOINT}/user/insights`;
 export const OPEN_SAUCED_AI_PR_DESCRIPTION_ENDPOINT = `${OPEN_SAUCED_API_ENDPOINT}/prs/description/generate`;
 export const OPEN_SAUCED_USER_HIGHLIGHTS_ENDPOINT = `${OPEN_SAUCED_API_ENDPOINT}/user/highlights`;
-export const OPEN_SAUCED_AI_CODE_REFACTOR_ENDPOINT = "https://api.opensauced.pizza/v1/prs/suggestion/generate";
+export const OPEN_SAUCED_AI_CODE_REFACTOR_ENDPOINT = `${OPEN_SAUCED_API_ENDPOINT}/prs/suggestion/generate`;
+
 
 // GitHub constants/selectors
 export const GITHUB_PROFILE_MENU_SELECTOR = ".p-nickname.vcard-username.d-block";

src/content-scripts/components/AddPRToHighlights/AddPRToHighlightsButton.ts

@@ -1,5 +1,6 @@
 import { createHtmlElement } from "../../../utils/createHtmlElement";
 import openSaucedLogoIcon from "../../../assets/opensauced-icon.svg";
+import { OPEN_SAUCED_INSIGHTS_DOMAIN } from "../../../constants";
 
 export const AddPRToHighlightsButton = () => {
  const addPRToHighlightsButton = createHtmlElement("a", {
@@ -9,7 +10,7 @@ export const AddPRToHighlightsButton = () => {
  openSaucedLogoIcon,
  )}>
  <details-menu id="details-menu-os" class="dropdown-menu hidden dropdown-menu-sw color-fg-default w-48 mt-2">
- <a href="https://insights.opensauced.pizza/feed?prurl=${encodeURIComponent(window.location.href)}" class="dropdown-item" target="_blank">
+ <a href="https://${OPEN_SAUCED_INSIGHTS_DOMAIN}/feed?prurl=${encodeURIComponent(window.location.href)}" class="dropdown-item" target="_blank">
  <svg aria-hidden="true" height="16" viewBox="0 0 16 16" version="1.1" width="16" data-view-component="true" class="octicon octicon-plus">
  <path d="M7.75 2a.75.75 0 0 1 .75.75V7h4.25a.75.75 0 0 1 0 1.5H8.5v4.25a.75.75 0 0 1-1.5 0V8.5H2.75a.75.75 0 0 1 0-1.5H7V2.75A.75.75 0 0 1 7.75 2Z"></path>
  </svg> Add PR to Highlights

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

@@ -3,6 +3,7 @@ import { createHtmlElement } from "../../../utils/createHtmlElement";
 import { getAuthToken } from "../../../utils/checkAuthentication";
 import { getUserInsightsData, getRepoData, updateInsight } from "../../../utils/fetchOpenSaucedApiData";
 import { IInsight } from "../../../ts/InsightDto";
+import { OPEN_SAUCED_INSIGHTS_DOMAIN } from "../../../constants";
 
 export const InsightsSelectDropdown = async (ownerName: string, repoName: string) => {
  const insightsDropdown = createHtmlElement("div", {
@@ -105,7 +106,7 @@ export const InsightsSelectDropdown = async (ownerName: string, repoName: string
 
  addInsightBtn.addEventListener("click", () => {
  window.open(
- "https://insights.opensauced.pizza/hub/insights/new",
+ `https://${OPEN_SAUCED_INSIGHTS_DOMAIN}/hub/insights/new`,
  "_blank",
  );
  });

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

@@ -3,6 +3,7 @@ import { createHtmlElement } from "../../../utils/createHtmlElement";
 import emailSocialIcon from "../../../assets/mail-icon.svg";
 import twitterSocialIcon from "../../../assets/twitter-icon.svg";
 import linkedInSocailIcon from "../../../assets/linkedin-icon.svg";
+import { OPEN_SAUCED_INSIGHTS_DOMAIN } from "../../../constants";
 
 interface Socials {
  emailAddress?: string | null;
@@ -76,7 +77,7 @@ export const InviteToOpenSaucedModal = (
  className:
  "mt-2 min-w-[33%] relative top-60 mx-auto p-4 border w-96 rounded-md shadow-button border-solid border-orange bg-slate-800",
  innerHTML: `
- <h3 class="text-2xl leading-6 font-bold text-white">Invite ${username} to <a href="https://insights.opensauced.pizza/start"><span class="hover:text-orange hover:underline">OpenSauced!</span></a></h3>
+ <h3 class="text-2xl leading-6 font-bold text-white">Invite ${username} to <a href="https://${OPEN_SAUCED_INSIGHTS_DOMAIN}/start"><span class="hover:text-orange hover:underline">OpenSauced!</span></a></h3>
  <div class="mt-2">
  <p class="text-md text-white">
  Use the links below to invite them.

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

@@ -1,11 +1,12 @@
 import logoIcon from "../../../assets/opensauced-icon.svg";
 import "../../content-scripts.css";
 import { createHtmlElement } from "../../../utils/createHtmlElement";
+import { OPEN_SAUCED_INSIGHTS_DOMAIN } from "../../../constants";
 
 export const ViewOnOpenSaucedButton = (username: string) => {
  const viewOnOpenSaucedButton = createHtmlElement("a", {
  id: "view-on-opensauced-button",
- href: `https://insights.opensauced.pizza/user/${username}/contributions`,
+ href: `https://${OPEN_SAUCED_INSIGHTS_DOMAIN}/user/${username}/contributions`,
  className:
  "inline-block mt-4 text-black bg-gh-white dark:bg-gh-gray dark:text-white rounded-md p-2 text-sm font-semibold text-center select-none w-full border hover:shadow-button hover:no-underline",
  target: "_blank",

src/pages/home.tsx

@@ -14,6 +14,7 @@ import PostOnHighlight from "./posthighlight";
 
 
 import Help from "./help";
+import { OPEN_SAUCED_INSIGHTS_DOMAIN } from "../constants";
 
 const Home = () => {
  const { user } = useAuth();
@@ -54,7 +55,7 @@ const Home = () => {
  <div className="tools flex flex-col gap-2">
  <a
  className="flex items-center bg-slate-700 hover:bg-slate-700/70 text-white hover:text-orange no-underline gap-2 p-1.5 px-3 w-full rounded-sm font-medium text-sm"
- href="https://insights.opensauced.pizza/feed"
+ href={`https://${OPEN_SAUCED_INSIGHTS_DOMAIN}/feed`}
  rel="noreferrer"
  target="_blank"
  >
@@ -64,7 +65,7 @@ const Home = () => {
 
  <a
  className="flex items-center bg-slate-700 hover:bg-slate-700/70 hover:text-orange text-white gap-2 p-1.5 px-3 w-full rounded-sm font-medium text-sm"
- href="https://insights.opensauced.pizza"
+ href={`https://${OPEN_SAUCED_INSIGHTS_DOMAIN}/feed`}
  rel="noreferrer"
  target="_blank"
  >

src/pages/profile.tsx

@@ -12,6 +12,7 @@ import { getUserPRVelocity } from "../utils/getUserPRVelocity";
 import { BiExit } from "react-icons/bi";
 import Start from "./start";
 import { optLogOut } from "../utils/checkAuthentication";
+import { OPEN_SAUCED_INSIGHTS_DOMAIN } from "../constants";
 
 const interestIcon = {
  python: <SiPython />,
@@ -89,7 +90,7 @@ export const Profile = ({ username }: { username: string }) => {
  <div className="flex flex-col items-center gap-1 mb-4">
  <a
  className="flex flex-col items-center hover:text-orange hover:scale-105"
- href={`https://insights.opensauced.pizza/user/${username}`}
+ href={`https://${OPEN_SAUCED_INSIGHTS_DOMAIN}/user/${username}`}
  rel="noopener noreferrer"
  target="_blank"
  >
@@ -192,10 +193,10 @@ export const Profile = ({ username }: { username: string }) => {
  <a
  key={interest}
  className="flex gap-1 items-center p-1.5 px-4 rounded-full bg-slate-700 hover:bg-slate-700/50"
- href={`https://insights.opensauced.pizza/${interest}/dashboard/filter/recent`}
+ href={`https://${OPEN_SAUCED_INSIGHTS_DOMAIN}/${interest}/dashboard/filter/recent`}
  rel="noreferrer"
  target="_blank"
- title={`https://insights.opensauced.pizza/${interest}/dashboard/filter/recent`}
+ title={`https://${OPEN_SAUCED_INSIGHTS_DOMAIN}/${interest}/dashboard/filter/recent`}
  >
  {interestIcon[interest as InterestIconKeys]}