Fix Timeline blinking (#16322)

Timeline activities are fetched using the `useTimelineActivities` hook,
which relies on `useFindManyRecords`. Previously, it also fetched linked
object titles via `useLinkedObjectsTitle`.

When the user scrolled to the bottom, we triggered `fetchMore` from
`useFindManyRecords` to load additional data. This operation correctly
handled in-place loading and did not set the main `loading` flag to
`true`.

However, after `useFindManyRecords` returned updated data, new variables
were passed to `useLinkedObjectsTitle`, which didn’t leverage the
`fetchMore` pattern. As a result, the `loading` state of
`useLinkedObjectsTitle` was set to `true`, even when only partial data
changed.

Our logic for displaying the skeleton loader was:

```ts
const loading = loadingTimelineActivities || loadingLinkedObjectsTitle;
```

When `loadingLinkedObjectsTitle` turned `true`, this triggered the
entire list to unmount and remount, causing repeated unnecessary
reloads.

To resolve this, I no longer delay rendering the list while loading
linked objects title.

## Demo

The skeleton is only shown at the beginning of the navigation.


https://github.com/user-attachments/assets/cb79f91d-5151-4dc1-8e6b-a322e56a48c4

Closes https://github.com/twentyhq/twenty/issues/16210
This commit is contained in:
Baptiste Devessier
2025-12-04 15:50:19 +01:00
committed by GitHub
parent d0e75d5948
commit 61a469cff8
@@ -46,10 +46,9 @@ export const useTimelineActivities = (
.map((timelineActivity) => timelineActivity.linkedRecordId)
.filter(isDefined);
const { loading: loadingLinkedObjectsTitle } =
useLinkedObjectsTitle(activityIds);
useLinkedObjectsTitle(activityIds);
const loading = loadingTimelineActivities || loadingLinkedObjectsTitle;
const loading = loadingTimelineActivities;
return {
timelineActivities,