On main: session-work-2026-05-22

frontend/src/hooks/useGSCBrainstorm.ts

@@ -1,11 +1,14 @@
-import { useState, useCallback } from 'react';
+import { useState, useCallback, useRef, useEffect } from 'react';
 import { useAuth } from '@clerk/clerk-react';
 import {
   gscBrainstormAPI,
   BrainstormResult,
   ContentOpportunity,
   KeywordGap,
+  QuickWin,
+  PageOpportunity,
   AIRecommendations,
+  AIRecommendation,
   BrainstormSummary,
 } from '../api/gscBrainstorm';
 import { useGSCBrainstormConnection } from './useGSCBrainstormConnection';
@@ -20,13 +23,27 @@ interface UseGSCBrainstormReturn {
   brainstormResult: BrainstormResult | null;
   contentOpportunities: ContentOpportunity[];
   keywordGaps: KeywordGap[];
+  quickWins: QuickWin[];
+  pageOpportunities: PageOpportunity[];
   aiRecommendations: AIRecommendations | null;
   summary: BrainstormSummary | null;
   connectGSC: () => Promise<void>;
   brainstorm: (keywords: string, siteUrl?: string) => Promise<BrainstormResult | null>;
   reset: () => void;
+  progressMessage: string;
 }
 
+const PROGRESS_MESSAGES = [
+  'Fetching your Google Search Console data for the last 30 days...',
+  'Analyzing which keywords bring traffic to your site and which ones need work...',
+  'Scanning for quick wins — keywords already on page 1 that just need a boost...',
+  'Identifying keyword gaps where better content could move you to page 1...',
+  'Reviewing your pages for optimization opportunities...',
+  'Computing your SEO health score and benchmark metrics...',
+  'Generating AI-powered blog post recommendations tailored to your GSC data...',
+  'Formatting insights into actionable topic suggestions you can use today...',
+];
+
 export const useGSCBrainstorm = (): UseGSCBrainstormReturn => {
   const { getToken } = useAuth();
   const {
@@ -41,11 +58,45 @@ export const useGSCBrainstorm = (): UseGSCBrainstormReturn => {
   const [isBrainstorming, setIsBrainstorming] = useState(false);
   const [brainstormError, setBrainstormError] = useState<string | null>(null);
   const [brainstormResult, setBrainstormResult] = useState<BrainstormResult | null>(null);
+  const [progressMessage, setProgressMessage] = useState('');
+  const progressIndexRef = useRef(0);
+  const progressTimerRef = useRef<ReturnType<typeof setInterval> | null>(null);
+
+  useEffect(() => {
+    return () => {
+      if (progressTimerRef.current) {
+        clearInterval(progressTimerRef.current);
+      }
+    };
+  }, []);
+
+  const startProgressMessages = () => {
+    progressIndexRef.current = 0;
+    setProgressMessage(PROGRESS_MESSAGES[0]);
+    progressTimerRef.current = setInterval(() => {
+      progressIndexRef.current += 1;
+      if (progressIndexRef.current < PROGRESS_MESSAGES.length) {
+        setProgressMessage(PROGRESS_MESSAGES[progressIndexRef.current]);
+      } else if (progressTimerRef.current) {
+        clearInterval(progressTimerRef.current);
+        progressTimerRef.current = null;
+      }
+    }, 3000);
+  };
+
+  const stopProgressMessages = () => {
+    if (progressTimerRef.current) {
+      clearInterval(progressTimerRef.current);
+      progressTimerRef.current = null;
+    }
+    setProgressMessage('');
+  };
 
   const brainstorm = useCallback(
     async (keywords: string, siteUrl?: string): Promise<BrainstormResult | null> => {
       setIsBrainstorming(true);
       setBrainstormError(null);
+      startProgressMessages();
 
       try {
         gscBrainstormAPI.setAuthTokenGetter(async () => {
@@ -66,6 +117,7 @@ export const useGSCBrainstorm = (): UseGSCBrainstormReturn => {
         return null;
       } finally {
         setIsBrainstorming(false);
+        stopProgressMessages();
       }
     },
     [getToken],
@@ -75,6 +127,7 @@ export const useGSCBrainstorm = (): UseGSCBrainstormReturn => {
     setBrainstormResult(null);
     setBrainstormError(null);
     setIsBrainstorming(false);
+    stopProgressMessages();
   }, []);
 
   return {
@@ -87,16 +140,19 @@ export const useGSCBrainstorm = (): UseGSCBrainstormReturn => {
     brainstormResult,
     contentOpportunities: brainstormResult?.content_opportunities ?? [],
     keywordGaps: brainstormResult?.keyword_gaps ?? [],
+    quickWins: brainstormResult?.quick_wins ?? [],
+    pageOpportunities: brainstormResult?.page_opportunities ?? [],
     aiRecommendations: brainstormResult?.ai_recommendations
-      && Object.keys(brainstormResult.ai_recommendations).length > 0
+      && Array.isArray(brainstormResult.ai_recommendations?.immediate_opportunities)
       ? (brainstormResult.ai_recommendations as AIRecommendations)
       : null,
     summary: brainstormResult?.summary
-      && Object.keys(brainstormResult.summary).length > 0
+      && brainstormResult.summary.site_url
       ? (brainstormResult.summary as BrainstormSummary)
       : null,
     connectGSC,
     brainstorm,
     reset,
+    progressMessage,
   };
-};
+};