Fix message thread pagination

[FelixMalfait]

On a company or person's detail page, go to the emails tab.
You will see the frontend does two request to GetTimelineThreadsFromCompanyId.
It seems it only stops doing request when it finds an empty array.
Instead, it should rely on the count returned in totalNumberOfThreads variables.
If that count it inferior to the total number of records we ask for, then we already know we don't have to ask for a second page.

[greptile-apps]

To fix the issue with unnecessary requests in message thread pagination, you need to adjust the logic in the EmailThreads component to stop fetching more records when the total number of threads is less than or equal to the number of records already fetched. Here's a specific implementation step:

1. Modify the fetchMoreRecords function inside EmailThreads.tsx to check if the total number of threads (totalNumberOfThreads) is less than or equal to the number of records already fetched. If so, do not perform any more fetch requests.

const fetchMoreRecords = () => {
  const alreadyFetchedRecords = timelineThreads.length;
  if (totalNumberOfThreads <= alreadyFetchedRecords) {
    return; // Stop fetching more records
  }
  // Existing logic to fetch more records
};

This change ensures that additional data is only requested when the total number of threads exceeds the number of threads already fetched, effectively using the totalNumberOfThreads variable to control pagination.

References

twentyhq/twenty/packages/twenty-front/src/modules/activities/emails/components/EmailThreads.tsx
twentyhq/twenty/packages/twenty-front/src/modules/activities/emails/queries/getTimelineThreadsFromCompanyId.ts
twentyhq/twenty/packages/twenty-server/src/core/messaging/timeline-messaging.resolver.ts
twentyhq/twenty/packages/twenty-server/src/core/messaging/timeline-messaging.service.ts

Ask Greptile

[greptile-apps]

To address the issue of unnecessary requests for message thread pagination, you'll need to modify the logic within the EmailThreads.tsx component to utilize the totalNumberOfThreads variable more effectively. Here's a step-by-step guide to implement the fix:

1. Modify Fetch Logic: In EmailThreads.tsx, adjust the fetchMoreRecords function or its equivalent logic to check if the current page number multiplied by the page size is greater than or equal to totalNumberOfThreads. If true, this indicates that all records have been fetched, and no further requests are necessary.

2. Implement the Check: Before calling fetchMoreRecords, add a condition to verify whether additional data needs to be fetched. This can be done by comparing the totalNumberOfThreads with the product of the current page number and TIMELINE_THREADS_DEFAULT_PAGE_SIZE.

3. Adjust the UseEffect or Fetching Logic: Ensure that the logic which triggers the data fetching (possibly within a useEffect hook or a similar lifecycle method) respects this new condition to prevent unnecessary fetch calls.

Here's a pseudo-code snippet to illustrate the concept:

if ((currentPage * TIMELINE_THREADS_DEFAULT_PAGE_SIZE) < totalNumberOfThreads) {
  fetchMoreRecords();
} else {
  // All records have been fetched, do not make more requests
}

This adjustment ensures that the component only requests additional pages when the total number of threads exceeds the number of threads already fetched, effectively reducing unnecessary network requests and improving the performance of the emails tab on detail pages.

References

twentyhq/twenty/packages/twenty-front/src/modules/activities/emails/components/EmailThreads.tsx
twentyhq/twenty/packages/twenty-front/src/modules/activities/emails/queries/getTimelineThreadsFromCompanyId.ts
twentyhq/twenty/packages/twenty-server/src/core/messaging/timeline-messaging.resolver.ts
twentyhq/twenty/packages/twenty-server/src/core/messaging/timeline-messaging.service.ts

Ask Greptile

[greptile-apps]

To address the issue of unnecessary requests in the pagination of message threads, you need to modify the logic in the EmailThreads component to stop making additional requests based on the totalNumberOfThreads variable rather than waiting for an empty array response. Here's a specific implementation approach:

1. In /packages/twenty-front/src/modules/activities/emails/components/EmailThreads.tsx, update the logic inside the EmailThreads component that triggers fetchMoreRecords. Instead of relying solely on the presence of threads to continue fetching, compare the totalNumberOfThreads with the number of threads already fetched.

2. Modify the fetchMoreRecords function or its calling condition to check if the total number of threads already fetched is less than totalNumberOfThreads. If true, then proceed to fetch more; otherwise, do not make additional requests.

3. Specifically, you can adjust the condition around the FetchMoreLoader component's onLastRowVisible prop. Ensure that it also considers whether the total fetched threads are less than totalNumberOfThreads before deciding to fetch more.

4. Here's a pseudo-code snippet for the adjusted condition:

const hasMoreThreadsToFetch = timelineThreads.length < totalNumberOfThreads;

<FetchMoreLoader
  loading={isFetchingMore || firstQueryLoading}
  onLastRowVisible={hasMoreThreadsToFetch ? fetchMoreRecords : () => {}}
/>

This approach ensures that additional network requests are only made when necessary, based on the actual count of available threads, improving the efficiency of data fetching on the emails tab.

References

twentyhq/twenty/packages/twenty-front/src/modules/activities/emails/components/EmailThreads.tsx
twentyhq/twenty/packages/twenty-front/src/modules/activities/emails/queries/getTimelineThreadsFromCompanyId.ts
twentyhq/twenty/packages/twenty-server/src/core/messaging/timeline-messaging.service.ts
twentyhq/twenty/packages/twenty-server/src/core/messaging/timeline-messaging.resolver.ts

Ask Greptile

[orinamio]

I'll look into this issue. Can you assign me to it?

[FelixMalfait]

@orinamio Let's leave this one to someone else while you work on the others? Happy to assign it after. Thanks again!!!