Merge branch 'master' into Required-Properties-Next-Button-Should-Not…

…-Allow

cypress/e2e/admin/signin.cy.ts

@@ -1,6 +1,8 @@
 describe('Admin Login', () => {
   it('Admin uses the enable function', () => {
-    cy.initialSetup('alice', 50)
+    const username = 'alice'
+
+    cy.initialSetup(username, 50)
 
     cy.intercept({
       method: 'POST',
@@ -24,16 +26,10 @@ describe('Admin Login', () => {
 
     // Submit the form
     cy.get('#add-node-submit-cta').click()
-
     cy.wait('@updateAbout')
 
     // Close modal and assert the title
     cy.get('div[data-testid="close-modal"]').click()
     cy.get('.title').should('have.text', title)
-
-    cy.contains('About').click({ force: true })
-    cy.wait(1000)
-
-    cy.contains(description).should('be.visible')
   })
 })

cypress/e2e/admin/topics.cy.ts

@@ -1,5 +1,5 @@
 describe('Test topics as Admin', () => {
-  it('Mute topic', () => {
+  it.skip('Mute topic', () => {
     cy.initialSetup('alice', 300)
 
     cy.get('#cy-open-soure-table').click()

cypress/e2e/curationTable/curation.cy.ts

@@ -56,9 +56,11 @@ describe('Test Curation Table', () => {
       cy.get('td:nth-child(2)').then(($td) => {
         // Access the value of the first td
         const tdValue = $td.text()
+
         cy.get('.approve-wrapper button').eq(1).click()
       })
     })
+
     cy.get('div[data-testid="rename"]').click()
 
     cy.get('#editTopic').should('exist')
@@ -74,6 +76,7 @@ describe('Test Curation Table', () => {
       cy.get('td:nth-child(2)').then(($td) => {
         // Access the value of the first td
         const tdValue = $td.text().trim()
+
         expect(tdValue).to.equal(newTopic)
       })
     })
@@ -98,6 +101,7 @@ describe('Test Curation Table', () => {
     const mergeTopic = 'authenticity'
     let specificValue = ''
     let matchFound = false
+
     cy.initialSetup('alice', 300)
 
     cy.get('#cy-open-soure-table').click()
@@ -106,17 +110,19 @@ describe('Test Curation Table', () => {
 
     cy.contains('button', 'Topics').click()
 
-    //Get node content intercept
+    // Get node content intercept
     cy.wait('@loadTopics')
 
     cy.get('tbody > tr:first').within(() => {
       cy.get('td:nth-child(2)').then(($td) => {
         // Access the value of the first td
         const tdValue = $td.text().trim()
+
         specificValue = tdValue
         cy.get('.approve-wrapper button').eq(1).click()
       })
     })
+
     cy.get('div[data-testid="merge"]').click()
 
     cy.get('#blur-on-select').type(mergeTopic)
@@ -149,7 +155,7 @@ describe('Test Curation Table', () => {
       })
   })
 
-  it('Mute Topic', () => {
+  it.skip('Mute Topic', () => {
     cy.intercept({
       method: 'GET',
       url: 'http://localhost:8444/api/nodes/info?skip=0&limit=50&muted=False&sort_by=date&node_type=Topic*',
@@ -184,6 +190,7 @@ describe('Test Curation Table', () => {
       cy.get('td:nth-child(2)').then(($td) => {
         // Access the value of the first td
         const tdValue = $td.text().trim()
+
         specificValue = tdValue
         cy.get('.approve-wrapper button').eq(0).click()
       })
@@ -216,6 +223,7 @@ describe('Test Curation Table', () => {
     cy.get('tbody > tr:first').within(() => {
       cy.get('td:nth-child(2)').then(($td) => {
         const tdValue = $td.text().trim()
+
         secondSpecificValue = tdValue
         cy.get('.approve-wrapper button').eq(1).click()
       })
@@ -244,7 +252,7 @@ describe('Test Curation Table', () => {
       })
   })
 
-  it('Unmute Topic', () => {
+  it.skip('Unmute Topic', () => {
     cy.intercept({
       method: 'GET',
       url: 'http://localhost:8444/api/nodes/info?skip=0&limit=50&muted=False&sort_by=date&node_type=Topic*',
@@ -281,6 +289,7 @@ describe('Test Curation Table', () => {
       cy.get('td:nth-child(2)').then(($td) => {
         // Access the value of the first td
         const tdValue = $td.text().trim()
+
         specificValue = tdValue
         cy.get('.approve-wrapper button').eq(0).click()
       })
@@ -313,6 +322,7 @@ describe('Test Curation Table', () => {
     cy.get('tbody > tr:first').within(() => {
       cy.get('td:nth-child(2)').then(($td) => {
         const tdValue = $td.text().trim()
+
         secondSpecificValue = tdValue
         cy.get('.approve-wrapper button').eq(1).click()
       })
@@ -374,9 +384,9 @@ describe('Test Curation Table', () => {
 
       let topicName
 
-      let edgeTopicName = 'Racism'
+      const edgeTopicName = 'Racism'
 
-      let edgeType = 'RELATED_TO'
+      const edgeType = 'RELATED_TO'
 
       cy.get('tbody > tr:first')
         .within(() => {
@@ -402,6 +412,7 @@ describe('Test Curation Table', () => {
 
           for (let i = 0; i < responseData.length; i++) {
             const data = responseData[i]
+
             if (data.name === topicName) {
               currentTopic = { ...data }
               break
@@ -418,6 +429,7 @@ describe('Test Curation Table', () => {
             const responseBody = response.body
             let node
             let edge
+
             for (let i = 0; i < responseBody.nodes.length; i++) {
               if (responseBody.nodes[i].name === edgeTopicName) {
                 node = { ...responseBody.nodes[i] }
@@ -463,6 +475,7 @@ describe('Test Curation Table', () => {
     cy.get('tbody > tr:first').within(() => {
       cy.get('td:nth-child(4)').then(($td) => {
         const tdValue = $td.text().trim()
+
         firstCount = parseInt(tdValue)
       })
     })
@@ -472,6 +485,7 @@ describe('Test Curation Table', () => {
     cy.get('tbody > tr:first').within(() => {
       cy.get('td:nth-child(4)').then(($td) => {
         const tdValue = parseInt($td.text().trim())
+
         expect(tdValue).to.be.gt(firstCount)
       })
     })

cypress/e2e/trendingTopics/trendingTopics.cy.ts

@@ -1,5 +1,5 @@
 describe('test trending topics', () => {
-  it('Checking it trending topics exist', () => {
+  it.skip('Checking it trending topics exist', () => {
     cy.intercept({
       method: 'GET',
       url: 'http://localhost:8444/api/prediction/graph/search*',

src/components/App/SideBar/AiSummary/AiAnswer/index.tsx

@@ -3,11 +3,13 @@ import styled from 'styled-components'
 import { highlightAiSummary } from '~/components/App/SideBar/AiSummary/utils/AiSummaryHighlight'
 import { Flex } from '~/components/common/Flex'
 import { Text } from '~/components/common/Text'
-import { useDataStore, useFilteredNodes } from '~/stores/useDataStore'
+import { useDataStore } from '~/stores/useDataStore'
 import { useUserStore } from '~/stores/useUserStore'
+import { ExtractedEntity } from '~/types/index'
 
 type Props = {
   answer: string
+  entities?: ExtractedEntity[]
   hasBeenRendered: boolean
   handleLoaded: () => void
 }
@@ -25,11 +27,10 @@ const SummaryText = styled(Text)`
   line-height: 19.6px;
 `
 
-export const AiAnswer = ({ answer, handleLoaded, hasBeenRendered }: Props) => {
+export const AiAnswer = ({ answer, entities, handleLoaded, hasBeenRendered }: Props) => {
   const { fetchData, setAbortRequests } = useDataStore((s) => s)
   const { setBudget } = useUserStore((s) => s)
   const [displayedText, setDisplayedText] = useState('')
-  const filteredNodes = useFilteredNodes()
 
   useEffect(() => {
     let timeoutId: NodeJS.Timeout
@@ -64,7 +65,7 @@ export const AiAnswer = ({ answer, handleLoaded, hasBeenRendered }: Props) => {
     fetchData(setBudget, setAbortRequests, search)
   }
 
-  const responseTextDisplay = highlightAiSummary(displayedText, filteredNodes, handleSubmit)
+  const responseTextDisplay = highlightAiSummary(displayedText, handleSubmit, entities)
 
   return (
     <Wrapper>

src/components/App/SideBar/AiSummary/index.tsx

@@ -66,6 +66,7 @@ export const AiSummary = ({ question, response }: Props) => {
           ) : (
             <AiAnswer
               answer={response.answer || ''}
+              entities={response.entities}
               handleLoaded={() => handleLoaded()}
               hasBeenRendered={!!response?.hasBeenRendered}
             />

src/components/App/SideBar/AiSummary/utils/AiSummaryHighlight/index.tsx

@@ -1,22 +1,23 @@
 import styled from 'styled-components'
-import { NodeExtended } from '~/types'
+import { Tooltip } from '~/components/common/ToolTip'
+import { ExtractedEntity } from '~/types'
 import { colors } from '~/utils'
 
 export function highlightAiSummary(
   sDescription: string,
-  nodesTerm: NodeExtended[] | null,
   handleSubmit: (search: string) => void,
+  entities?: ExtractedEntity[],
 ) {
-  if (!nodesTerm || nodesTerm.length === 0) {
+  if (!entities || entities.length === 0) {
     return sDescription
   }
 
-  const sortedTerms = nodesTerm
-    .map((node) => node.name)
-    .filter((name) => typeof name === 'string')
+  const sortedEntities = entities
+    .map((entity) => entity.entity)
+    .filter((entity) => typeof entity === 'string')
     .sort((a, b) => b.length - a.length)
 
-  const escapedTerms = sortedTerms.map((term) => escapeRegExp(term))
+  const escapedTerms = sortedEntities.map((entity) => escapeRegExp(entity))
   const regex = new RegExp(`(${escapedTerms.join('|')})`, 'gi')
 
   const parts = sDescription.split(regex)
@@ -25,18 +26,21 @@ export function highlightAiSummary(
   return (
     <>
       {parts.map((part) => {
-        if (regex.test(part) && !highlighted.has(part.toLowerCase())) {
+        const entity = entities.find((e) => e.entity.toLowerCase() === part.toLowerCase())
+
+        if (entity && !highlighted.has(part.toLowerCase())) {
           highlighted.add(part.toLowerCase())
 
           return (
-            <Highlight
-              key={part}
-              onClick={() => {
-                handleSubmit(part)
-              }}
-            >
-              {part}
-            </Highlight>
+            <StyledTooltip key={part} content={entity.description}>
+              <Highlight
+                onClick={() => {
+                  handleSubmit(part)
+                }}
+              >
+                {part}
+              </Highlight>
+            </StyledTooltip>
           )
         }
 
@@ -60,3 +64,24 @@ const Highlight = styled.span`
     cursor: pointer;
   }
 `
+
+const StyledTooltip = styled(({ className, ...props }) => (
+  <Tooltip
+    {...props}
+    backgroundColor={colors.BG2}
+    borderRadius="6px"
+    className={className}
+    color="white"
+    fontSize="12px"
+    fontWeight="500"
+    minWidth="160px"
+    padding="10px"
+    position="top"
+    textAlign="start"
+    whiteSpace="normal"
+  />
+))`
+  & .tooltip-content {
+    color: white;
+  }
+`

src/components/App/index.tsx

@@ -1,6 +1,7 @@
 import { Leva } from 'leva'
 import { lazy, Suspense, useCallback, useEffect } from 'react'
 import { FormProvider, useForm } from 'react-hook-form'
+import { useSearchParams } from 'react-router-dom'
 import 'react-toastify/dist/ReactToastify.css'
 import { Socket } from 'socket.io-client'
 import styled from 'styled-components'
@@ -18,7 +19,12 @@ import { useFeatureFlagStore } from '~/stores/useFeatureFlagStore'
 import { useUpdateSelectedNode } from '~/stores/useGraphStore'
 import { useTeachStore } from '~/stores/useTeachStore'
 import { useUserStore } from '~/stores/useUserStore'
-import { AiSummaryAnswerResponse, AiSummaryQuestionsResponse, AiSummarySourcesResponse } from '~/types'
+import {
+  AiSummaryAnswerResponse,
+  AiSummaryQuestionsResponse,
+  AiSummarySourcesResponse,
+  ExtractedEntitiesResponse,
+} from '~/types'
 import { colors } from '~/utils/colors'
 import { updateBudget } from '~/utils/setBudget'
 import version from '~/utils/versionHelper'
@@ -29,7 +35,6 @@ import { DeviceCompatibilityNotice } from './DeviceCompatibilityNotification'
 import { Helper } from './Helper'
 import { SecondarySideBar } from './SecondarySidebar'
 import { Toasts } from './Toasts'
-import { useSearchParams } from 'react-router-dom'
 
 const Wrapper = styled(Flex)`
   height: 100%;
@@ -162,6 +167,15 @@ export const App = () => {
     [addNewNode],
   )
 
+  const handleExtractedEntities = useCallback(
+    (data: ExtractedEntitiesResponse) => {
+      if (data.question && getKeyExist(data.question)) {
+        setAiSummaryAnswer(data.question, { answerLoading: false, entities: data.entities })
+      }
+    },
+    [setAiSummaryAnswer, getKeyExist],
+  )
+
   // setup socket
   useEffect(() => {
     if (socket) {
@@ -173,6 +187,10 @@ export const App = () => {
 
       socket.on('newnode', handleNewNode)
 
+      if (chatInterfaceFeatureFlag) {
+        socket.on('extractedentitieshook', handleExtractedEntities)
+      }
+
       // subscribe to ai_summary
       if (chatInterfaceFeatureFlag) {
         socket.on('askquestionhook', handleAiSummaryAnswer)
@@ -205,6 +223,7 @@ export const App = () => {
     chatInterfaceFeatureFlag,
     handleAiRelevantQuestions,
     handleAiSources,
+    handleExtractedEntities,
   ])
 
   return (