From 09ef7e8d734bc617e298a86a5a7b1d3886baada1 Mon Sep 17 00:00:00 2001 From: Theo Gautier Date: Fri, 14 Jun 2024 10:29:59 +0200 Subject: [PATCH 1/2] feat(us-2650): surbrillance recherche message --- clients/firebase.client.ts | 34 ++++++++----- .../chat/DisplayMessageBeneficiaire.tsx | 29 +++++++++-- components/chat/DisplayMessageConseiller.tsx | 12 ++++- components/chat/LienPieceJointe.tsx | 18 ++++++- components/chat/RechercheMessage.tsx | 21 ++++++-- components/chat/TexteAvecLien.tsx | 27 +++++++++- interfaces/message.ts | 5 ++ services/messages.service.ts | 50 ++++++++++--------- .../ConversationBeneficiaire.test.tsx | 34 +++++++------ tests/services/messages.service.test.ts | 30 ++++++----- 10 files changed, 185 insertions(+), 75 deletions(-) diff --git a/clients/firebase.client.ts b/clients/firebase.client.ts index 02131d347..67dd5991c 100644 --- a/clients/firebase.client.ts +++ b/clients/firebase.client.ts @@ -36,6 +36,7 @@ import { InfoOffre, Message, MessageListeDiffusion, + MessageRechercheMatch, TypeMessage, } from 'interfaces/message' import { BaseOffre, TypeOffre } from 'interfaces/offre' @@ -470,27 +471,36 @@ export async function rechercherMessages( accessToken: string, idBeneficiaire: string, recherche: string -): Promise { +): Promise< + Array<{ + message: Message + matches: MessageRechercheMatch[] + }> +> { const { content: { resultats }, } = await apiGet<{ resultats: Array<{ id: string message: FirebaseMessage & { creationDate: { _seconds: number } } + matches: MessageRechercheMatch[] }> }>(`/jeunes/${idBeneficiaire}/messages?recherche=${recherche}`, accessToken) - return resultats.map(({ message, id }) => - firebaseMessageToMessage( - { - ...message, - creationDate: Timestamp.fromMillis( - message.creationDate._seconds * 1000 - ), - }, - id - ) - ) + return resultats.map(({ message, id, matches }) => { + return { + matches, + message: firebaseMessageToMessage( + { + ...message, + creationDate: Timestamp.fromMillis( + message.creationDate._seconds * 1000 + ), + }, + id + ), + } + }) } export async function getMessagesPeriode( diff --git a/components/chat/DisplayMessageBeneficiaire.tsx b/components/chat/DisplayMessageBeneficiaire.tsx index ec155d101..506a06bb4 100644 --- a/components/chat/DisplayMessageBeneficiaire.tsx +++ b/components/chat/DisplayMessageBeneficiaire.tsx @@ -7,12 +7,19 @@ import { LienPieceJointe } from 'components/chat/LienPieceJointe' import LienSessionMilo from 'components/chat/LienSessionMilo' import TexteAvecLien from 'components/chat/TexteAvecLien' import { SpinningLoader } from 'components/ui/SpinningLoader' -import { isDeleted, isEdited, Message, TypeMessage } from 'interfaces/message' +import { + isDeleted, + isEdited, + Message, + MessageRechercheMatch, + TypeMessage, +} from 'interfaces/message' import { toFrenchTime, toLongMonthDate, toShortDate } from 'utils/date' type MessageBeneficiaireProps = { message: Message beneficiaireNomComplet: string + highlight?: MessageRechercheMatch } type ResultatRechercheProps = MessageBeneficiaireProps & { @@ -45,11 +52,17 @@ export default function DisplayMessageBeneficiaire( {message.type === TypeMessage.MESSAGE_PJ && message.infoPiecesJointes && message.infoPiecesJointes.map((pj, key) => { - return + return ( + + ) })} {message.type !== TypeMessage.MESSAGE_PJ && ( - + )} {message.type === TypeMessage.MESSAGE_OFFRE && @@ -120,10 +133,12 @@ function MessagePJ({ id, nom, statut, + highlight, }: { id: string nom: string statut?: string + highlight?: MessageRechercheMatch }) { switch (statut) { case 'valide': @@ -134,7 +149,13 @@ function MessagePJ({ Celle-ci sera conservée 4 mois. Enregistrez la dans i-milo pour la conserver de manière sécurisée.

- + ) case 'non_valide': diff --git a/components/chat/DisplayMessageConseiller.tsx b/components/chat/DisplayMessageConseiller.tsx index 7ede39ef9..77879dc9f 100644 --- a/components/chat/DisplayMessageConseiller.tsx +++ b/components/chat/DisplayMessageConseiller.tsx @@ -9,7 +9,13 @@ import LienSessionMilo from 'components/chat/LienSessionMilo' import TexteAvecLien from 'components/chat/TexteAvecLien' import IconComponent, { IconName } from 'components/ui/IconComponent' import { SpinningLoader } from 'components/ui/SpinningLoader' -import { isDeleted, isEdited, Message, TypeMessage } from 'interfaces/message' +import { + isDeleted, + isEdited, + Message, + MessageRechercheMatch, + TypeMessage, +} from 'interfaces/message' import { toFrenchDateTime, toFrenchTime, @@ -21,6 +27,7 @@ type Base = { message: Message conseillerNomComplet: string | undefined isConseillerCourant: boolean + highlight?: MessageRechercheMatch } type ResultatRechercheProps = Base & { @@ -124,7 +131,7 @@ function MessageConseiller(props: DisplayMessageConseillerProps) { {isConseillerCourant ? 'Vous' : conseillerNomComplet}

- + {message.type === TypeMessage.MESSAGE_OFFRE && message.infoOffre && ( @@ -155,6 +162,7 @@ function MessageConseiller(props: DisplayMessageConseillerProps) { id={id} nom={nom} className='fill-primary' + highlight={props.highlight} /> ))} diff --git a/components/chat/LienPieceJointe.tsx b/components/chat/LienPieceJointe.tsx index a73df215c..a6816d2c4 100644 --- a/components/chat/LienPieceJointe.tsx +++ b/components/chat/LienPieceJointe.tsx @@ -1,16 +1,32 @@ +import parse from 'html-react-parser' import React from 'react' import IconComponent, { IconName } from 'components/ui/IconComponent' +import { MessageRechercheMatch } from 'interfaces/message' export function LienPieceJointe({ id, nom, className, + highlight, }: { id: string nom: string className?: string + highlight?: MessageRechercheMatch }) { + const texteASurligner = highlight && highlight.key === 'piecesJointes.nom' + function surlignerTexte(texte: string) { + const coordDebut = highlight!.match[0] + const coordFin = highlight!.match[1] + 1 + + const debut = texte.slice(0, coordDebut) + const highlightedText = texte.slice(coordDebut, coordFin) + const fin = texte.slice(coordFin) + + return parse(`${debut}${highlightedText}${fin}`) + } + return (
Télécharger la pièce jointe - {nom} + {texteASurligner ? surlignerTexte(nom) : nom}
) diff --git a/components/chat/RechercheMessage.tsx b/components/chat/RechercheMessage.tsx index e9d1fb1b5..1f395f665 100644 --- a/components/chat/RechercheMessage.tsx +++ b/components/chat/RechercheMessage.tsx @@ -13,7 +13,11 @@ import IllustrationComponent, { } from 'components/ui/IllustrationComponent' import { ValueWithError } from 'components/ValueWithError' import { JeuneChat } from 'interfaces/jeune' -import { fromConseiller, Message } from 'interfaces/message' +import { + fromConseiller, + Message, + MessageRechercheMatch, +} from 'interfaces/message' import { useChatCredentials } from 'utils/chat/chatCredentialsContext' import { useConseiller } from 'utils/conseiller/conseillerContext' @@ -32,7 +36,7 @@ export function RechercheMessage({ const [conseiller] = useConseiller() const [resultatsRecherche, setResultatsRecherche] = useState< - Message[] | undefined + Array<{ message: Message; matches: MessageRechercheMatch[] }> | undefined >() const [messageSelectionne, setMessageSelectionne] = useState< Message | undefined @@ -121,7 +125,9 @@ function RechercheMessageForm({ onResultat, }: { idJeuneChat: string - onResultat: (message: Message[]) => void + onResultat: ( + messages: Array<{ message: Message; matches: MessageRechercheMatch[] }> + ) => void }) { const chatCredentials = useChatCredentials() @@ -194,7 +200,10 @@ function ResultatsRecherche({ getConseillerNomComplet, onSelectionnerMessage, }: { - resultatsRecherche: Message[] + resultatsRecherche: Array<{ + message: Message + matches: MessageRechercheMatch[] + }> beneficiaireNomComplet: string idConseiller: string getConseillerNomComplet: (message: Message) => string | undefined @@ -210,7 +219,7 @@ function ResultatsRecherche({

{resultatsRecherche.length >= 1 && (
    - {resultatsRecherche.map((message, key) => ( + {resultatsRecherche.map(({ message, matches }, key) => ( {!fromConseiller(message) && ( onSelectionnerMessage(message)} + highlight={matches[0]} /> )} @@ -229,6 +239,7 @@ function ResultatsRecherche({ isEnCoursDeModification={false} estResultatDeRecherche={true} onAllerAuMessage={() => onSelectionnerMessage(message)} + highlight={matches[0]} /> )} diff --git a/components/chat/TexteAvecLien.tsx b/components/chat/TexteAvecLien.tsx index ad788b71e..82abeec4c 100644 --- a/components/chat/TexteAvecLien.tsx +++ b/components/chat/TexteAvecLien.tsx @@ -1,11 +1,18 @@ import parse, { domToReact } from 'html-react-parser' import React from 'react' +import { MessageRechercheMatch } from 'interfaces/message' + type TexteAvecLienProps = { texte: string lighten?: boolean + highlight?: MessageRechercheMatch } -export default function TexteAvecLien({ texte, lighten }: TexteAvecLienProps) { +export default function TexteAvecLien({ + texte, + lighten, + highlight, +}: TexteAvecLienProps) { function confirmationRedirectionLienExterne( e: React.MouseEvent, lien: string @@ -70,6 +77,22 @@ export default function TexteAvecLien({ texte, lighten }: TexteAvecLienProps) { return str.includes('http') || str.includes('https') } - if (!detecteLien(texte)) return

    {texte}

    + function surlignerTexte(texte: string) { + const coordDebut = highlight!.match[0] + const coordFin = highlight!.match[1] + 1 + + const debut = texte.slice(0, coordDebut) + const highlightedText = texte.slice(coordDebut, coordFin) + const fin = texte.slice(coordFin) + + return `${debut}${highlightedText}${fin}` + } + + if (highlight && highlight.key === 'content') { + texte = surlignerTexte(texte) + } + + if (!detecteLien(texte)) + return parse(`

    ${texte}

    `) return <>{formateTexteAvecLien()} } diff --git a/interfaces/message.ts b/interfaces/message.ts index 7274323ac..2febdc0f1 100644 --- a/interfaces/message.ts +++ b/interfaces/message.ts @@ -45,6 +45,11 @@ export interface ByDay { messages: T[] } +export type MessageRechercheMatch = { + match: [number, number] + key?: 'content' | 'piecesJointes.nom' +} + export interface ChatCredentials { token: string cleChiffrement: string diff --git a/services/messages.service.ts b/services/messages.service.ts index 7d57a97bf..92c32bde4 100644 --- a/services/messages.service.ts +++ b/services/messages.service.ts @@ -31,6 +31,7 @@ import { ChatCredentials, Message, MessageListeDiffusion, + MessageRechercheMatch, TypeMessage, } from 'interfaces/message' import { BaseOffre } from 'interfaces/offre' @@ -185,44 +186,47 @@ export function observeJeuneReadingDate( }) } +export async function getMessagesListeDeDiffusion( + idListeDiffusion: string, + cleChiffrement: string +): Promise[]> { + const session = await getSession() + const messages = await getMessagesGroupe(session!.user.id, idListeDiffusion) + + return grouperMessagesParJour(messages, cleChiffrement) +} + export async function rechercherMessagesConversation( idBeneficiaire: string, recherche: string, cleChiffrement: string -): Promise { +): Promise> { const session = await getSession() - const messages = await rechercherMessages( + const resultatsRecherche = await rechercherMessages( session!.accessToken, idBeneficiaire, recherche ) - return messages.map((message) => { - if (!message.iv) return message + return resultatsRecherche.map(({ matches, message }) => { + if (!message.iv) return { message, matches } return { - ...message, - ...decryptContentAndFilename( - { - iv: message.iv, - content: message.content, - infoPiecesJointes: message.infoPiecesJointes, - }, - cleChiffrement - ), + message: { + ...message, + ...decryptContentAndFilename( + { + iv: message.iv, + content: message.content, + infoPiecesJointes: message.infoPiecesJointes, + }, + cleChiffrement + ), + }, + matches, } }) } -export async function getMessagesListeDeDiffusion( - idListeDiffusion: string, - cleChiffrement: string -): Promise[]> { - const session = await getSession() - const messages = await getMessagesGroupe(session!.user.id, idListeDiffusion) - - return grouperMessagesParJour(messages, cleChiffrement) -} - export async function getMessageImportant( cleChiffrement: string ): Promise { diff --git a/tests/components/ConversationBeneficiaire.test.tsx b/tests/components/ConversationBeneficiaire.test.tsx index 51d0962d0..cb20d51a2 100644 --- a/tests/components/ConversationBeneficiaire.test.tsx +++ b/tests/components/ConversationBeneficiaire.test.tsx @@ -660,16 +660,22 @@ describe('', () => { const now = DateTime.fromISO('2024-05-24') jest.spyOn(DateTime, 'now').mockReturnValue(now) ;(rechercherMessagesConversation as jest.Mock).mockResolvedValue([ - unMessage({ - content: 'tchoupi vs trotro', - sentBy: 'conseiller', - creationDate: DateTime.now().minus({ day: 2 }), - }), - unMessage({ - content: 'tchoupi est plus beau que l’âne trotro', - sentBy: 'jeune', - creationDate: DateTime.now().minus({ day: 1 }), - }), + { + message: unMessage({ + content: 'tchoupi vs trotro', + sentBy: 'conseiller', + creationDate: DateTime.now().minus({ day: 2 }), + }), + matches: [{ match: [0, 6], key: 'content' }], + }, + { + message: unMessage({ + content: 'tchoupi est plus beau que l’âne trotro', + sentBy: 'jeune', + creationDate: DateTime.now().minus({ day: 1 }), + }), + matches: [{ match: [0, 6], key: 'content' }], + }, ]) await userEvent.type(formInput, 'tchoupi') @@ -680,11 +686,11 @@ describe('', () => { expect(screen.getByText('2 résultats trouvés')).toBeInTheDocument() }) it('affiche le contenu des messages', async () => { - expect(screen.getByText('tchoupi vs trotro')).toBeInTheDocument() + const markedElements = screen.getAllByText('tchoupi', { + selector: 'mark', + }) + expect(markedElements.length).toEqual(2) expect(screen.getByText('Le 22/05/2024')).toBeInTheDocument() - expect( - screen.getByText('tchoupi est plus beau que l’âne trotro') - ).toBeInTheDocument() expect(screen.getByText('Le 23/05/2024')).toBeInTheDocument() }) }) diff --git a/tests/services/messages.service.test.ts b/tests/services/messages.service.test.ts index 613a7fb9f..d90f53516 100644 --- a/tests/services/messages.service.test.ts +++ b/tests/services/messages.service.test.ts @@ -796,12 +796,15 @@ describe('MessagesFirebaseAndApiService', () => { jest.spyOn(DateTime, 'now').mockReturnValue(now) const resultatRecherche = [ - unMessage({ - content: 'tchoupi', - infoPiecesJointes: [ - { id: 'id-pj', nom: 'tchoupi.jpg', statut: 'valide' }, - ], - }), + { + message: unMessage({ + content: 'tchoupi', + infoPiecesJointes: [ + { id: 'id-pj', nom: 'tchoupi.jpg', statut: 'valide' }, + ], + }), + matches: [{ match: [0, 1], key: 'content' }], + }, ] ;(rechercherMessages as jest.Mock).mockResolvedValue(resultatRecherche) }) @@ -824,12 +827,15 @@ describe('MessagesFirebaseAndApiService', () => { it('retourne les résultats', async () => { //Given - const resultatDechiffre = unMessage({ - content: 'Decrypted: tchoupi', - infoPiecesJointes: [ - { id: 'id-pj', nom: 'Decrypted: tchoupi.jpg', statut: 'valide' }, - ], - }) + const resultatDechiffre = { + message: unMessage({ + content: 'Decrypted: tchoupi', + infoPiecesJointes: [ + { id: 'id-pj', nom: 'Decrypted: tchoupi.jpg', statut: 'valide' }, + ], + }), + matches: [{ match: [0, 1], key: 'content' }], + } //When const resultats = await rechercherMessagesConversation( From b5fd435d87ad04c06f63bf862f168337e27531d1 Mon Sep 17 00:00:00 2001 From: Theo Gautier Date: Mon, 17 Jun 2024 11:55:23 +0200 Subject: [PATCH 2/2] retours revue et tests --- .../chat/DisplayMessageBeneficiaire.tsx | 10 ++- components/chat/DisplayMessageConseiller.tsx | 13 +++- components/chat/LienPieceJointe.tsx | 13 ++-- components/chat/TexteAvecLien.tsx | 24 ++++--- .../DisplayMessageBeneficiaire.test.tsx | 62 ++++++++++++++++ .../DisplayMessageConseiller.test.tsx | 72 +++++++++++++++++++ 6 files changed, 172 insertions(+), 22 deletions(-) diff --git a/components/chat/DisplayMessageBeneficiaire.tsx b/components/chat/DisplayMessageBeneficiaire.tsx index 506a06bb4..b86687c2a 100644 --- a/components/chat/DisplayMessageBeneficiaire.tsx +++ b/components/chat/DisplayMessageBeneficiaire.tsx @@ -61,7 +61,11 @@ export default function DisplayMessageBeneficiaire( )} @@ -154,7 +158,9 @@ function MessagePJ({ id={id} nom={nom} className='fill-blanc' - highlight={highlight} + highlight={ + highlight?.key === 'piecesJointes.nom' ? highlight : undefined + } /> ) diff --git a/components/chat/DisplayMessageConseiller.tsx b/components/chat/DisplayMessageConseiller.tsx index 77879dc9f..90a934866 100644 --- a/components/chat/DisplayMessageConseiller.tsx +++ b/components/chat/DisplayMessageConseiller.tsx @@ -131,7 +131,12 @@ function MessageConseiller(props: DisplayMessageConseillerProps) { {isConseillerCourant ? 'Vous' : conseillerNomComplet}

    - + {message.type === TypeMessage.MESSAGE_OFFRE && message.infoOffre && ( @@ -162,7 +167,11 @@ function MessageConseiller(props: DisplayMessageConseillerProps) { id={id} nom={nom} className='fill-primary' - highlight={props.highlight} + highlight={ + props.highlight?.key === 'piecesJointes.nom' + ? props.highlight + : undefined + } /> ))} diff --git a/components/chat/LienPieceJointe.tsx b/components/chat/LienPieceJointe.tsx index a6816d2c4..730ed6e8c 100644 --- a/components/chat/LienPieceJointe.tsx +++ b/components/chat/LienPieceJointe.tsx @@ -15,14 +15,13 @@ export function LienPieceJointe({ className?: string highlight?: MessageRechercheMatch }) { - const texteASurligner = highlight && highlight.key === 'piecesJointes.nom' function surlignerTexte(texte: string) { - const coordDebut = highlight!.match[0] - const coordFin = highlight!.match[1] + 1 + const indexDebut = highlight!.match[0] + const indexFin = highlight!.match[1] + 1 - const debut = texte.slice(0, coordDebut) - const highlightedText = texte.slice(coordDebut, coordFin) - const fin = texte.slice(coordFin) + const debut = texte.slice(0, indexDebut) + const highlightedText = texte.slice(indexDebut, indexFin) + const fin = texte.slice(indexFin) return parse(`${debut}${highlightedText}${fin}`) } @@ -43,7 +42,7 @@ export function LienPieceJointe({ className='font-bold break-all' > Télécharger la pièce jointe - {texteASurligner ? surlignerTexte(nom) : nom} + {highlight ? surlignerTexte(nom) : nom} ) diff --git a/components/chat/TexteAvecLien.tsx b/components/chat/TexteAvecLien.tsx index 82abeec4c..04a3c7e21 100644 --- a/components/chat/TexteAvecLien.tsx +++ b/components/chat/TexteAvecLien.tsx @@ -23,8 +23,8 @@ export default function TexteAvecLien({ } } - function formateTexteAvecLien() { - const messageFormate = texte + function formateTexteAvecLien(texteAFormater: string) { + const messageFormate = texteAFormater .replaceAll('<', '<') .replaceAll('>', '>') .split(/\r?\n|\s+/) @@ -77,22 +77,24 @@ export default function TexteAvecLien({ return str.includes('http') || str.includes('https') } - function surlignerTexte(texte: string) { + function surlignerTexte(texteASurligner: string) { const coordDebut = highlight!.match[0] const coordFin = highlight!.match[1] + 1 - const debut = texte.slice(0, coordDebut) - const highlightedText = texte.slice(coordDebut, coordFin) - const fin = texte.slice(coordFin) + const debut = texteASurligner.slice(0, coordDebut) + const highlightedText = texteASurligner.slice(coordDebut, coordFin) + const fin = texteASurligner.slice(coordFin) return `${debut}${highlightedText}${fin}` } - if (highlight && highlight.key === 'content') { - texte = surlignerTexte(texte) + let texteAAfficher = texte + + if (highlight) { + texteAAfficher = surlignerTexte(texteAAfficher) } - if (!detecteLien(texte)) - return parse(`

    ${texte}

    `) - return <>{formateTexteAvecLien()} + if (!detecteLien(texteAAfficher)) + return parse(`

    ${texteAAfficher}

    `) + return <>{formateTexteAvecLien(texteAAfficher)} } diff --git a/tests/components/DisplayMessageBeneficiaire.test.tsx b/tests/components/DisplayMessageBeneficiaire.test.tsx index e66a56ce7..e5103f618 100644 --- a/tests/components/DisplayMessageBeneficiaire.test.tsx +++ b/tests/components/DisplayMessageBeneficiaire.test.tsx @@ -79,6 +79,33 @@ describe('', () => { expect(screen.getByText(/Modifié/)).toBeInTheDocument() }) + it('affiche un résultat de recherche surligné', async () => { + const beneficiaireNomComplet = 'Père Castor' + + //Given + const message = unMessage({ + sentBy: 'jeune', + content: 'Je vais vous raconter une histoire', + }) + + //When + await act(async () => { + renderWithContexts( + + ) + }) + + // Then + const markedElements = screen.getAllByText('Je', { + selector: 'mark', + }) + expect(markedElements.length).toEqual(1) + }) + describe('quand il y a une pièce jointe', () => { it('pas de statut', async () => { const beneficiaireNomComplet = 'Père Castor' @@ -248,5 +275,40 @@ describe('', () => { // Then expect(screen.getByText('Pièce jointe expirée')).toBeInTheDocument() }) + + it('affiche un résultat de recherche avec nom de la pj surligné', async () => { + const beneficiaireNomComplet = 'Père Castor' + + //Given + const message = unMessage({ + sentBy: 'jeune', + content: 'Je vais vous raconter une histoire', + infoPiecesJointes: [ + { + id: 'id-pj', + nom: 'toto.jpg', + statut: 'valide', + }, + ], + type: TypeMessage.MESSAGE_PJ, + }) + + //When + await act(async () => { + renderWithContexts( + + ) + }) + + // Then + const markedElements = screen.getAllByText('toto', { + selector: 'mark', + }) + expect(markedElements.length).toEqual(1) + }) }) }) diff --git a/tests/components/DisplayMessageConseiller.test.tsx b/tests/components/DisplayMessageConseiller.test.tsx index 5cf6467e2..4002949a7 100644 --- a/tests/components/DisplayMessageConseiller.test.tsx +++ b/tests/components/DisplayMessageConseiller.test.tsx @@ -8,6 +8,8 @@ import { unConseiller } from 'fixtures/conseiller' import { unMessage } from 'fixtures/message' import { StructureConseiller } from 'interfaces/conseiller' import renderWithContexts from 'tests/renderWithContexts' +import DisplayMessageBeneficiaire from 'components/chat/DisplayMessageBeneficiaire' +import { TypeMessage } from 'interfaces/message' describe('', () => { const nomConseiller = 'johnny boi' @@ -132,4 +134,74 @@ describe('', () => { expect(screen.getByText('· Modifié')).toBeInTheDocument() expect(screen.queryByText('· Lu')).not.toBeInTheDocument() }) + + describe('quand le message est un résultat de recherche', () => { + it('affiche le contenu surligné', async () => { + //GIVEN + const messageRecherche = unMessage({ + sentBy: 'conseiller', + content: 'Hello, tu as pensé à envoyer ton CV ?', + conseillerId: customConseiller.id, + }) + + //WHEN + await act(async () => { + renderWithContexts( + + ) + }) + + //THEN + const markedElements = screen.getAllByText('Hello', { + selector: 'mark', + }) + expect(markedElements.length).toEqual(1) + }) + + it('affiche le nom de la pj surligné', async () => { + //GIVEN + const messageRecherche = unMessage({ + sentBy: 'conseiller', + content: 'Hello, tu as pensé à envoyer ton CV ?', + infoPiecesJointes: [ + { + id: 'id-pj', + nom: 'toto.jpg', + statut: 'valide', + }, + ], + type: TypeMessage.MESSAGE_PJ, + conseillerId: customConseiller.id, + }) + + //WHEN + await act(async () => { + renderWithContexts( + + ) + }) + + //THEN + const markedElements = screen.getAllByText('toto', { + selector: 'mark', + }) + expect(markedElements.length).toEqual(1) + }) + }) })