Merge pull request #1865 from MahtabBukhari/should_render_seed_questi…

…on_with_not_delay

Ai seed Questions under AI search bar Rendered after the AI chat search panel open

src/components/App/Splash/index.tsx

@@ -17,14 +17,18 @@ export const Splash = memo(({ children }: PropsWithChildren) => {
   const [progress, setProgress] = useState(0)
   const [isLoading, setIsLoading] = useState(true)
   const { appMetaData, setAppMetaData } = useAppStore((s) => s)
-  const { stats, setStats, isFetching } = useDataStore((s) => s)
+  const { stats, setStats, isFetching, setSeedQuestions } = useDataStore((s) => s)
 
   const fetchData = useCallback(async () => {
     try {
       if (!appMetaData) {
         const aboutResponse = await getAboutData()
 
         setAppMetaData(aboutResponse)
+
+        if (aboutResponse.seed_questions) {
+          setSeedQuestions(aboutResponse.seed_questions)
+        }
       }
 
       if (!stats) {
@@ -43,7 +47,7 @@ export const Splash = memo(({ children }: PropsWithChildren) => {
 
       setProgress(100)
     }
-  }, [appMetaData, setAppMetaData, setStats, stats])
+  }, [appMetaData, setAppMetaData, setStats, stats, setSeedQuestions])
 
   useEffect(() => {
     fetchData()

src/components/App/UniverseQuestion/index.tsx

@@ -3,11 +3,10 @@ import { Flex } from '~/components/common/Flex'
 
 import { TextareaAutosize } from '@mui/base'
 import { Button } from '@mui/material'
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 import ArrowForwardIcon from '~/components/Icons/ArrowForwardIcon'
 import ExploreIcon from '~/components/Icons/ExploreIcon'
 import HelpIcon from '~/components/Icons/HelpIcon'
-import { getAboutData } from '~/network/fetchSourcesData'
 import { useAiSummaryStore } from '~/stores/useAiSummaryStore'
 import { useAppStore } from '~/stores/useAppStore'
 import { useDataStore } from '~/stores/useDataStore'
@@ -16,30 +15,11 @@ import { colors } from '~/utils/colors'
 
 export const UniverseQuestion = () => {
   const [question, setQuestion] = useState('')
-  const [seedQuestions, setSeedQuestions] = useState<string[]>([])
-  const { fetchData, setAbortRequests } = useDataStore((s) => s)
+  const { fetchData, setAbortRequests, seedQuestions } = useDataStore((s) => s)
   const [setBudget] = useUserStore((s) => [s.setBudget])
   const setUniverseQuestionIsOpen = useAppStore((s) => s.setUniverseQuestionIsOpen)
   const resetAiSummaryAnswer = useAiSummaryStore((s) => s.resetAiSummaryAnswer)
 
-  useEffect(() => {
-    const fetchSeedQuestions = async () => {
-      try {
-        const response = await getAboutData()
-
-        if (response.seed_questions) {
-          const shuffledQuestions = shuffleArray(response.seed_questions)
-
-          setSeedQuestions(shuffledQuestions)
-        }
-      } catch (error) {
-        console.error('Error fetching seed questions:', error)
-      }
-    }
-
-    fetchSeedQuestions()
-  }, [])
-
   const handleSubmitQuestion = async (questionToSubmit: string) => {
     if (questionToSubmit) {
       resetAiSummaryAnswer()
@@ -77,7 +57,7 @@ export const UniverseQuestion = () => {
     return array
   }
 
-  const displayedSeedQuestions = seedQuestions.slice(0, 4)
+  const displayedSeedQuestions = seedQuestions ? shuffleArray(seedQuestions).slice(0, 4) : []
 
   const isValidText = !!question && question.trim().length > 0
 

src/stores/useDataStore/index.ts

@@ -46,6 +46,7 @@ export type DataStore = {
   trendingTopics: Trending[]
   stats: TStats | null
   nodeTypes: string[]
+  seedQuestions: string[] | null
 
   setTrendingTopics: (trendingTopics: Trending[]) => void
   setDataNew: (data: GraphData) => void
@@ -72,6 +73,7 @@ export type DataStore = {
   setAbortRequests: (abortRequest: boolean) => void
   nextPage: () => void
   setFilters: (filters: Partial<FilterParams>) => void
+  setSeedQuestions: (questions: string[]) => void
 }
 
 const defaultData: Omit<
@@ -98,6 +100,7 @@ const defaultData: Omit<
   | 'nextPage'
   | 'setDataNew'
   | 'resetDataNew'
+  | 'setSeedQuestions'
 > = {
   categoryFilter: null,
   dataInitial: null,
@@ -127,6 +130,7 @@ const defaultData: Omit<
   splashDataLoading: true,
   abortRequest: false,
   dataNew: null,
+  seedQuestions: null,
 }
 
 let abortController: AbortController | null = null
@@ -258,6 +262,7 @@ export const useDataStore = create<DataStore>()(
     setSources: (sources) => set({ sources }),
     setHideNodeDetails: (hideNodeDetails) => set({ hideNodeDetails }),
     setTeachMe: (showTeachMe) => set({ showTeachMe }),
+    setSeedQuestions: (questions) => set({ seedQuestions: questions }),
     updateNode: (updatedNode) => {
       console.log(updatedNode)
     },