diff --git a/src/content-scripts/components/AICodeRefactor/ChangeSuggestorButton.ts b/src/content-scripts/components/AICodeRefactor/ChangeSuggestorButton.ts index 1313c960..047e3160 100644 --- a/src/content-scripts/components/AICodeRefactor/ChangeSuggestorButton.ts +++ b/src/content-scripts/components/AICodeRefactor/ChangeSuggestorButton.ts @@ -21,13 +21,15 @@ export const ChangeSuggestorButton = (commentNode: HTMLElement) => { }; const handleSubmit = async (commentNode: HTMLElement) => { + const logo = document.getElementById("ai-description-button-logo"); + const button = document.getElementById("os-ai-change-gen"); + try { if (!(await isLoggedIn())) { return window.open(SUPABASE_LOGIN_URL, "_blank"); } - const logo = document.getElementById("ai-description-button-logo"); - if (!logo) { + if (!logo || !button) { return; } @@ -41,6 +43,7 @@ const handleSubmit = async (commentNode: HTMLElement) => { } logo.classList.toggle("animate-spin"); + button.classList.toggle("pointer-events-none"); const selectedLines = document.querySelectorAll(".code-review.selected-line"); let selectedCode = Array.from(selectedLines).map(line => line.textContent) @@ -69,6 +72,7 @@ const handleSubmit = async (commentNode: HTMLElement) => { ); logo.classList.toggle("animate-spin"); + button.classList.toggle("pointer-events-none"); if (!suggestionStream) { return console.error("No description was generated!"); } @@ -76,6 +80,9 @@ const handleSubmit = async (commentNode: HTMLElement) => { insertTextAtCursor(textArea as HTMLTextAreaElement, suggestionStream); } catch (error: unknown) { + logo?.classList.toggle("animate-spin"); + button?.classList.toggle("pointer-events-none"); + if (error instanceof Error) { console.error("Description generation error:", error.message); } diff --git a/src/content-scripts/components/GenerateAIDescription/DescriptionGeneratorButton.ts b/src/content-scripts/components/GenerateAIDescription/DescriptionGeneratorButton.ts index 7c468b3b..c637c29b 100644 --- a/src/content-scripts/components/GenerateAIDescription/DescriptionGeneratorButton.ts +++ b/src/content-scripts/components/GenerateAIDescription/DescriptionGeneratorButton.ts @@ -23,26 +23,30 @@ export const DescriptionGeneratorButton = () => { }; const handleSubmit = async () => { - const logo = document.getElementById("ai-description-button-logo") ?? null; + const logo = document.getElementById("ai-description-button-logo"); + const button = document.getElementById("ai-description-button"); try { if (!(await isLoggedIn())) { return window.open(SUPABASE_LOGIN_URL, "_blank"); } - if (!logo) { + if (!logo || !button) { return; } logo.classList.toggle("animate-spin"); + button.classList.toggle("pointer-events-none"); const descriptionStream = await getAiDescription(); logo.classList.toggle("animate-spin"); + button.classList.toggle("pointer-events-none"); const textArea = document.getElementsByName(GITHUB_PR_COMMENT_TEXT_AREA_SELECTOR)[0] as HTMLTextAreaElement; insertTextAtCursor(textArea, descriptionStream); } catch (error: unknown) { logo?.classList.toggle("animate-spin"); + button?.classList.toggle("pointer-events-none"); if (error instanceof Error) { alert(error.message); @@ -52,7 +56,9 @@ const handleSubmit = async () => { }; export const getAiDescription = async () => { - const url = getPullRequestAPIURL(window.location.href); + const { protocol, hostname, pathname } = window.location; + const url = getPullRequestAPIURL(`${protocol}//${hostname}${pathname}`); + const descriptionConfig = await getAIDescriptionConfig(); if (!descriptionConfig) { @@ -89,3 +95,4 @@ export const getAiDescription = async () => { return descriptionStream; }; + diff --git a/src/pages/home.tsx b/src/pages/home.tsx index 3990bb82..011c6264 100644 --- a/src/pages/home.tsx +++ b/src/pages/home.tsx @@ -18,27 +18,22 @@ import { getHighlights } from "../utils/fetchOpenSaucedApiData"; import Help from "./help"; import { OPEN_SAUCED_INSIGHTS_DOMAIN } from "../constants"; -interface Highlight { - highlight: string; - title: string; - name: string; - url: string; - login: string; -} - +import type { Highlight } from "../ts/types"; const Home = () => { const { user } = useAuth(); const { currentTabIsOpensaucedUser, checkedUser } = useOpensaucedUserCheck(); const [highlights, setHighlights] = useState([]); const [currentPage, setCurrentPage] = useState(0); - const [currentName, setCurrentName] = useState(""); - useEffect(() => { const fetchHighlights = async () => { try { const userHighlightsData = await getHighlights(); + + if (!userHighlightsData) { + return; + } const highlights = userHighlightsData.data; setHighlights(highlights); @@ -58,13 +53,6 @@ const Home = () => { setCurrentPage(prevPage => prevPage + 1); }; - useEffect(() => { - // Update the current name when the highlight changes - if (highlights[currentPage]?.login) { - setCurrentName(highlights[currentPage].login); - } - }, [highlights, currentPage]); - return (
diff --git a/src/pages/posthighlight.tsx b/src/pages/posthighlight.tsx index 66696eb6..aed12cd6 100644 --- a/src/pages/posthighlight.tsx +++ b/src/pages/posthighlight.tsx @@ -5,6 +5,7 @@ import { useAuth } from "../hooks/useAuth"; import toast, { Toaster } from "react-hot-toast"; import { cerateHighlight } from "../utils/fetchOpenSaucedApiData"; import { goBack } from "react-chrome-extension-router"; +import { OPEN_SAUCED_INSIGHTS_DOMAIN } from "../constants"; const PostOnHighlight = () => { const { authToken, user } = useAuth(); @@ -42,7 +43,7 @@ const PostOnHighlight = () => { return ( diff --git a/src/ts/types.ts b/src/ts/types.ts index 597da4f0..c8f75a65 100644 --- a/src/ts/types.ts +++ b/src/ts/types.ts @@ -17,3 +17,33 @@ export interface IUserPR { readonly changed_files: number; readonly repo_id: number; } + +export interface Highlights { + data: Highlight[]; + meta: HighlightsMeta; +} + +export interface Highlight { + id: number; + user_id: number; + url: string; + title: string; + highlight: string; + pinned: boolean; + created_at: string; + updated_at: string; + deleted_at: string; + shipped_at: string; + full_name: string; + name: string; + login: string; +} + +interface HighlightsMeta { + page: number; + limit: number; + itemCount: number; + pageCount: number; + hasPreviousPage: boolean; + hasNextPage: boolean; +} diff --git a/src/utils/fetchOpenSaucedApiData.ts b/src/utils/fetchOpenSaucedApiData.ts index 0be04fc8..e5714218 100644 --- a/src/utils/fetchOpenSaucedApiData.ts +++ b/src/utils/fetchOpenSaucedApiData.ts @@ -8,6 +8,7 @@ import { OPEN_SAUCED_HIGHLIGHTS_ENDPOINT, } from "../constants"; import { IInsight } from "../ts/InsightDto"; +import { Highlights } from "../ts/types"; export const isOpenSaucedUser = async (username: string) => { try { @@ -178,12 +179,18 @@ export const updateInsight = async (userToken: string, repoId: string, checked: return response.status === 200; }; -export const getHighlights = async () => { - const response = await fetch( +export const getHighlights = async (): Promise => { + const response = await cachedFetch( `${OPEN_SAUCED_HIGHLIGHTS_ENDPOINT}`, - { method: "GET" }, + { + method: "GET", + expireInSeconds: 300, + }, ); + if (!response) { + return; + } return response.json(); };