Merge pull request microsoft#329 from microsoft/psl-bug-16193

fix: psl bug 16193

Author: Roopan-Microsoft

src/frontend/src/components/ChatHistory/ChatHistoryList.test.tsx

@@ -4,10 +4,13 @@ import { AppStateContext } from '../../state/AppProvider';
 import ChatHistoryList from './ChatHistoryList';
 import { Conversation } from '../../api/models';
 import { ChatHistoryLoadingState } from '../../api/models';
+import {defaultMockState} from '../../test/test.utils';
+
 
 const mockDispatch = jest.fn();
 
 const mockState = {
+  ...defaultMockState,
   isChatHistoryOpen: false,
   chatHistoryLoadingState: ChatHistoryLoadingState.Loading,
   isCosmosDBAvailable: {
@@ -27,7 +30,7 @@ const mockState = {
   isRequestInitiated: false,
   failedSections : [],
   isFailedReqInitiated : false,
-  isLoading : false,
+  isLoading : false
 };
 
 const renderChatHistoryList = (stateOverride = {}) => {

src/frontend/src/components/ChatHistory/ChatHistoryPanel.test.tsx

@@ -4,6 +4,8 @@ import { AppStateContext } from '../../state/AppProvider';
 import { ChatHistoryPanel } from './ChatHistoryPanel';
 import { ChatHistoryLoadingState, ChatMessage, Conversation, CosmosDBStatus, Feedback, historyDeleteAll,historyList } from '../../api';
 import * as api from '../../api';
+import {defaultMockState} from '../../test/test.utils';
+
 
 // Mock the API function
 jest.mock('../../api/api', () => ({
@@ -37,6 +39,7 @@ const mockConversation: Conversation = {
 
 // Mock initial state for the context
 const mockState = {
+  ...defaultMockState,
   chatHistoryLoadingState: ChatHistoryLoadingState.Success,
   isCosmosDBAvailable: { cosmosDB: true, status: CosmosDBStatus.NotConfigured },
   chatHistory: [mockConversation], // Added mock chat history here
@@ -54,7 +57,7 @@ const mockState = {
   isRequestInitiated: false,
   failedSections : [],
   isFailedReqInitiated : false,
-  isLoading : false,
+  isLoading : false
 };
 
 const mockDispatch = jest.fn();

src/frontend/src/components/DraftCards/SectionCard.test.tsx

@@ -9,6 +9,8 @@ import { MemoryRouter } from 'react-router-dom'
 import { ChatHistoryLoadingState } from '../../api/models'
 import { act } from 'react-dom/test-utils'
 
+import {defaultMockState} from '../../test/test.utils';
+
 // Mock the API
 jest.mock('../../api/api', () => ({
   sectionGenerate: jest.fn(() =>
@@ -26,6 +28,7 @@ jest.mock('../../assets/Generate.svg', () => 'mocked-generate-icon')
 
 const mockDispatch = jest.fn()
 const mockState = {
+  ...defaultMockState,
   draftedDocument: {
     title: 'Draft Document',
     sections: [
@@ -56,7 +59,7 @@ const mockState = {
   isRequestInitiated: false,
   failedSections : [],
   isFailedReqInitiated : false,
-  isLoading : false,
+  isLoading : false
 }
 
 const renderWithContext = (idx = 0) =>
@@ -210,4 +213,7 @@ describe('SectionCard Component', () => {
       }
     })
   })
+
+  
+
 })

src/frontend/src/components/DraftCards/SectionCard.tsx

@@ -111,7 +111,7 @@ const useStyles = makeStyles({
   }
 })
 
-const SectionCard = ({ sectionIdx }: SectionCardProps) => {
+const SectionCard = ({ sectionIdx  }: SectionCardProps) => {
   const location = useLocation()
   const classes = useStyles()
   const [isLoading, setIsLoading] = useState(false)
@@ -141,7 +141,6 @@ const SectionCard = ({ sectionIdx }: SectionCardProps) => {
 
   useEffect(() => {
     if (appStateContext.state?.failedSections.length >0 && appStateContext.state?.failedSections[0].title === sectionTitle && isLoading && !appStateContext.state.isFailedReqInitiated) {
-      console.log("appStateContext.state?.failedSections", appStateContext.state?.failedSections);
       const tempItem = {
         title: sectionTitle,
         description: sectionDescription,
@@ -157,13 +156,13 @@ const SectionCard = ({ sectionIdx }: SectionCardProps) => {
 
   async function fetchSectionContent(sectionTitle: string, sectionDescription: string , isReqFrom = '') {
     setIsLoading(true)
+    
     const sectionGenerateRequest: SectionGenerateRequest = { sectionTitle, sectionDescription }
 
     const response = await sectionGenerate(sectionGenerateRequest)
     const responseBody = await response.json()
 
     if(responseBody?.error?.includes("429")) {
-      console.log("retriggerd !!!")
       const failedSectionItems = {
         title: sectionTitle,
         description: sectionDescription,
@@ -192,9 +191,11 @@ const SectionCard = ({ sectionIdx }: SectionCardProps) => {
 
       setCharCount(content.length)
       setIsLoading(false)
-
       appStateContext?.dispatch({ type: 'REMOVED_FAILED_SECTION', payload: {section : updatedSection} })
 
+      appStateContext?.dispatch({ type: 'UPDATE_IS_LOADED_SECTIONS', payload: {section : updatedSection} })
+
+
       if(isReqFrom == 'failed')
         appStateContext?.dispatch({ type: 'UPDATE_SECTION_API_REQ_STATUS', payload:  false })
     }
@@ -207,6 +208,11 @@ const SectionCard = ({ sectionIdx }: SectionCardProps) => {
   useEffect(() => {
     if (sectionContent === '' && !isLoading && !isManuallyCleared) {
       fetchSectionContent(sectionTitle, sectionDescription)
+    }else {
+      if(sectionContent!='' && !isLoading){
+        const updatedSection: Section = {...section}
+        appStateContext?.dispatch({ type: 'UPDATE_IS_LOADED_SECTIONS', payload: {section : updatedSection} })
+      }
     }
   }, [sectionContent, isLoading, isManuallyCleared])
 
@@ -256,6 +262,7 @@ const SectionCard = ({ sectionIdx }: SectionCardProps) => {
                     console.error('Section description is empty')
                     return
                   }
+                  appStateContext?.dispatch({ type: 'UPDATE_IS_LOADED_SECTIONS', payload: {section : null, 'title' : sectionTitle ,'act' :'removeItem'  } })
 
                   setIsPopoverOpen(false)
                   fetchSectionContent(sectionTitle, updatedSectionDescription)

src/frontend/src/components/Sidebar/Sidebar.test.tsx

@@ -5,6 +5,7 @@ import Sidebar from './Sidebar';
 import { ChatHistoryLoadingState } from '../../api/models';
 import { BrowserRouter as Router, useLocation ,useNavigate} from 'react-router-dom';
 import { getUserInfo } from '../../api';
+import {defaultMockState} from '../../test/test.utils';
 
 const mockDispatch = jest.fn();
 beforeEach(() => {
@@ -35,6 +36,7 @@ jest.mock('react-router-dom', () => ({
   useLocation: jest.fn(),
 }));
 const mockState = {
+  ...defaultMockState,
   isChatHistoryOpen: false,
   chatHistoryLoadingState: ChatHistoryLoadingState.Loading,
   isCosmosDBAvailable: {
@@ -56,23 +58,7 @@ const mockState = {
   isFailedReqInitiated : false,
   isLoading : false,
 };
-const mockState2 = {
-  isChatHistoryOpen: false,
-    chatHistoryLoadingState: ChatHistoryLoadingState.Loading,
-    chatHistory: null, 
-    filteredChatHistory: [], 
-    currentChat: null, 
-    browseChat: null, 
-    generateChat: null,
-    isCosmosDBAvailable: {
-        cosmosDB: false,
-        status: 'NotConfigured' 
-    },
-    frontendSettings: { auth_enabled: false }, 
-    feedbackState: {}, 
-    draftedDocument: null,
-    draftedDocumentTitle: ''
-};
+
 const renderSidebar = (stateOverride = {}, pathname = '/') => {
 
   (useLocation as jest.Mock).mockReturnValue({ pathname });