fix: corrige recuperation messages plus anciens

SocialGouv · Nov 12, 2024 · 0618d14 · 0618d14
1 parent a62e4da
commit 0618d14
Show file tree

Hide file tree

Showing 12 changed files with 337 additions and 311 deletions.
diff --git a/clients/firebase.client.ts b/clients/firebase.client.ts
@@ -29,9 +29,9 @@ import {
 import { DateTime } from 'luxon'
 
 import { apiGet } from 'clients/api.client'
+import { Chat } from 'interfaces/beneficiaire'
 import { UserType } from 'interfaces/conseiller'
 import { InfoFichier } from 'interfaces/fichier'
-import { Chat } from 'interfaces/beneficiaire'
 import {
   InfoOffre,
   Message,
@@ -429,7 +429,7 @@ export function observeDerniersMessagesDuChat(
       ),
       (querySnapshot: QuerySnapshot<FirebaseMessage, FirebaseMessage>) => {
         const messages: Message[] = querySnapshot.docs.map(docSnapshotToMessage)
-        if (messages.length && !messages[messages.length - 1].creationDate) {
+        if (messages.length && !messages.at(-1)!.creationDate) {
           return
         }
 

diff --git a/components/chat/Conversation.tsx b/components/chat/Conversation.tsx
@@ -25,10 +25,10 @@ import { BeneficiaireEtChat } from 'interfaces/beneficiaire'
 import { InfoFichier } from 'interfaces/fichier'
 import {
   ByDay,
-  countItems,
   fromConseiller,
   getPreviousItemId,
   Message,
+  OfDay,
 } from 'interfaces/message'
 import {
   FormNouveauMessageIndividuel,
@@ -82,7 +82,7 @@ export function Conversation({
     Message | undefined
   >()
 
-  const [messagesByDay, setMessagesByDay] = useState<ByDay<Message>[]>()
+  const [messagesByDay, setMessagesByDay] = useState<ByDay<Message>>()
   const [uploadedFileInfo, setUploadedFileInfo] = useState<
     InfoFichier | undefined
   >(undefined)
@@ -115,21 +115,12 @@ export function Conversation({
         idChatToObserve,
         chatCredentials.cleChiffrement,
         { pages: nombreDePages, taillePage: NB_MESSAGES_PAR_PAGE },
-        (messagesGroupesParJour: ByDay<Message>[]) => {
-          setMessagesByDay((previousValue) => {
-            if (
-              !messagesGroupesParJour.length ||
-              countItems(messagesGroupesParJour) < NB_MESSAGES_PAR_PAGE ||
-              (previousValue?.length &&
-                countItems(messagesGroupesParJour) - countItems(previousValue) <
-                  NB_MESSAGES_PAR_PAGE)
-            ) {
-              setHasNoMoreMessages(true)
-            }
-
-            return messagesGroupesParJour
-          })
+        (messagesGroupesParJour: ByDay<Message>) => {
+          setMessagesByDay(messagesGroupesParJour)
           setNombrePagesChargees(nombreDePages)
+          setHasNoMoreMessages(
+            messagesGroupesParJour.length < nombreDePages * NB_MESSAGES_PAR_PAGE
+          )
 
           setLoadingMoreMessages(false)
 
@@ -181,7 +172,7 @@ export function Conversation({
   function chargerPlusDeMessages() {
     const pageSuivante = nombrePagesChargees! + 1
     setLoadingMoreMessages(true)
-    idPrecedentPremierMessage.current = messagesByDay![0].messages[0].id
+    idPrecedentPremierMessage.current = messagesByDay!.days[0].messages[0].id
 
     unsubscribeFromMessages.current()
     unsubscribeFromMessages.current = observerMessages(
@@ -485,50 +476,55 @@ export function Conversation({
 
                 {messagesByDay.length > 0 && (
                   <ul ref={conteneurMessagesRef}>
-                    {messagesByDay.map((messagesOfADay: ByDay<Message>) => (
-                      <li key={messagesOfADay.date.toMillis()} className='mb-5'>
-                        <div className='text-base-regular text-center mb-3'>
-                          <p>{displayDate(messagesOfADay.date)}</p>
-                        </div>
-
-                        <ul>
-                          {messagesOfADay.messages.map((message: Message) => (
-                            <Fragment key={message.id}>
-                              {!fromConseiller(message) && (
-                                <DisplayMessageBeneficiaire
-                                  message={message}
-                                  beneficiaireNomComplet={
-                                    beneficiaireNomComplet
-                                  }
-                                />
-                              )}
-
-                              {fromConseiller(message) && (
-                                <DisplayMessageConseiller
-                                  message={message}
-                                  conseillerNomComplet={getConseillerNomComplet(
-                                    message
-                                  )}
-                                  lastSeenByJeune={lastSeenByJeune}
-                                  isConseillerCourant={
-                                    message.conseillerId === conseiller.id
-                                  }
-                                  onSuppression={() =>
-                                    supprimerMessage(message)
-                                  }
-                                  onModification={() =>
-                                    preparerModificationMessage(message)
-                                  }
-                                  isEnCoursDeModification={
-                                    message.id === messageAModifier?.id
-                                  }
-                                />
-                              )}
-                            </Fragment>
-                          ))}
-                        </ul>
-                      </li>
-                    ))}
+                    {messagesByDay.days.map(
+                      (messagesOfADay: OfDay<Message>) => (
+                        <li
+                          key={messagesOfADay.date.toMillis()}
+                          className='mb-5'
+                        >
+                          <div className='text-base-regular text-center mb-3'>
+                            <p>{displayDate(messagesOfADay.date)}</p>
+                          </div>
+
+                          <ul>
+                            {messagesOfADay.messages.map((message: Message) => (
+                              <Fragment key={message.id}>
+                                {!fromConseiller(message) && (
+                                  <DisplayMessageBeneficiaire
+                                    message={message}
+                                    beneficiaireNomComplet={
+                                      beneficiaireNomComplet
+                                    }
+                                  />
+                                )}
+
+                                {fromConseiller(message) && (
+                                  <DisplayMessageConseiller
+                                    message={message}
+                                    conseillerNomComplet={getConseillerNomComplet(
+                                      message
+                                    )}
+                                    lastSeenByJeune={lastSeenByJeune}
+                                    isConseillerCourant={
+                                      message.conseillerId === conseiller.id
+                                    }
+                                    onSuppression={() =>
+                                      supprimerMessage(message)
+                                    }
+                                    onModification={() =>
+                                      preparerModificationMessage(message)
+                                    }
+                                    isEnCoursDeModification={
+                                      message.id === messageAModifier?.id
+                                    }
+                                  />
+                                )}
+                              </Fragment>
+                            ))}
+                          </ul>
+                        </li>
+                      )
+                    )}
                   </ul>
                 )}
               </>

diff --git a/components/chat/DetailMessageListeDeDiffusion.tsx b/components/chat/DetailMessageListeDeDiffusion.tsx
@@ -33,10 +33,7 @@ function DetailMessageListeDeDiffusion(
   ref: ForwardedRef<{ focusRetour: () => void }>
 ) {
   useImperativeHandle(ref, () => ({
-    focusRetour: () => {
-      console.log('>>>', 'DETAIL FOCUS RETOUR')
-      headerRef.current!.focusRetour()
-    },
+    focusRetour: () => headerRef.current!.focusRetour(),
   }))
 
   const isFirstRender = useRef<boolean>(true)

diff --git a/components/chat/MessagesListeDeDiffusion.tsx b/components/chat/MessagesListeDeDiffusion.tsx
@@ -17,7 +17,7 @@ import ButtonLink from 'components/ui/Button/ButtonLink'
 import IconComponent, { IconName } from 'components/ui/IconComponent'
 import SpinningLoader from 'components/ui/SpinningLoader'
 import { ListeDeDiffusion } from 'interfaces/liste-de-diffusion'
-import { ByDay, MessageListeDiffusion } from 'interfaces/message'
+import { ByDay, MessageListeDiffusion, OfDay } from 'interfaces/message'
 import { getMessagesListeDeDiffusion } from 'services/messages.service'
 import { useChatCredentials } from 'utils/chat/chatCredentialsContext'
 import { dateIsToday, toShortDate } from 'utils/date'
@@ -51,7 +51,7 @@ function MessagesListeDeDiffusion(
   const headerRef = useRef<{ focusRetour: () => void }>(null)
   const containerRef = useRef<HTMLDivElement>(null)
 
-  const [messages, setMessages] = useState<ByDay<MessageListeDiffusion>[]>()
+  const [messages, setMessages] = useState<ByDay<MessageListeDiffusion>>()
   const [messagerieEstVisible, setMessagerieEstVisible] =
     useState<boolean>(true)
   const [idMessageAFocus, setIdMessageAFocus] = useState<string | undefined>()
@@ -151,8 +151,8 @@ function MessagesListeDeDiffusion(
                   className='h-full min-h-0 p-4 overflow-y-auto'
                   aria-describedby='description-messages'
                 >
-                  {messages.map(
-                    (messagesOfADay: ByDay<MessageListeDiffusion>, i) => (
+                  {messages.days.map(
+                    (messagesOfADay: OfDay<MessageListeDiffusion>, i) => (
                       <li
                         key={messagesOfADay.date.toMillis() + i}
                         className='mb-5'