Fix AI chat re-renders and refactored code (#18585)

This PR: 

- Breaks useAgentChatData into focused effect components (streaming,
fetch,
init, auto-scroll, diff sync)
- Splits message list into non-last (stable) + last (streaming/error) to
prevent full re-renders on each stream chunk
- Adds scroll-to-bottom button and MutationObserver-based auto-scroll on
thread switch
- Lifts loading state from context to atoms
- Adds areEqual to selector
factories

We could improve further but this sets up a robust architecture for
further refactoring.

## Messages flow

The flow of messages loading and streaming is now more solid. 

Everything goes out from `AgentChatAiSdkStreamEffect`, whether loaded
from the DB or streaming directly, and every consumers is using only one
atom `agentChatMessagesComponentFamilyState`

## Data sync effect with callbacks new hook 

See
`packages/twenty-front/src/modules/apollo/hooks/useQueryWithCallbacks.ts`
which allows to fix Apollo v4 migration leftovers and is an
implementation of the pattern we talked about with @charlesBochet

We could refine this pattern in another PR.

# Before



https://github.com/user-attachments/assets/84e7a96f-6790-405d-8a73-2dacbf783be5


# After



https://github.com/user-attachments/assets/4c692e3a-2413-4513-abcc-44d0da311203

Co-authored-by: Charles Bochet <charles@twenty.com>

packages/twenty-front/src/modules/views/states/selectors/viewsSelector.ts

@@ -1,4 +1,5 @@
 import { metadataStoreState } from '@/metadata-store/states/metadataStoreState';
+import { type FlatObjectMetadataItem } from '@/metadata-store/types/FlatObjectMetadataItem';
 import { type FlatView } from '@/metadata-store/types/FlatView';
 import { type FlatViewField } from '@/metadata-store/types/FlatViewField';
 import { type FlatViewFieldGroup } from '@/metadata-store/types/FlatViewFieldGroup';
@@ -8,11 +9,21 @@ import { type FlatViewGroup } from '@/metadata-store/types/FlatViewGroup';
 import { type FlatViewSort } from '@/metadata-store/types/FlatViewSort';
 import { createAtomSelector } from '@/ui/utilities/state/jotai/utils/createAtomSelector';
 import { type ViewWithRelations } from '@/views/types/ViewWithRelations';
+import { resolveViewNamePlaceholders } from '@/views/utils/resolveViewNamePlaceholders';
 
 export const viewsSelector = createAtomSelector<ViewWithRelations[]>({
   key: 'viewsSelector',
   get: ({ get }) => {
     const flatViews = get(metadataStoreState, 'views').current as FlatView[];
+    const flatObjectMetadataItems = get(
+      metadataStoreState,
+      'objectMetadataItems',
+    ).current as FlatObjectMetadataItem[];
+
+    const objectMetadataItemsById = new Map(
+      flatObjectMetadataItems.map((item) => [item.id, item]),
+    );
+
     const flatViewFields = get(metadataStoreState, 'viewFields')
       .current as FlatViewField[];
     const flatViewFilters = get(metadataStoreState, 'viewFilters')
@@ -75,6 +86,10 @@ export const viewsSelector = createAtomSelector<ViewWithRelations[]>({
 
     return flatViews.map((view) => ({
       ...view,
+      name: resolveViewNamePlaceholders(
+        view.name,
+        objectMetadataItemsById.get(view.objectMetadataId),
+      ),
       viewFields: viewFieldsByViewId.get(view.id) ?? [],
       viewFilters: viewFiltersByViewId.get(view.id) ?? [],
       viewSorts: viewSortsByViewId.get(view.id) ?? [],

packages/twenty-front/src/modules/views/utils/resolveViewNamePlaceholders.ts

@@ -0,0 +1,15 @@
+import { type FlatObjectMetadataItem } from '@/metadata-store/types/FlatObjectMetadataItem';
+import { isDefined } from 'twenty-shared/utils';
+
+export const resolveViewNamePlaceholders = (
+  viewName: string,
+  objectMetadataItem: FlatObjectMetadataItem | undefined,
+): string => {
+  if (!isDefined(objectMetadataItem)) {
+    return viewName;
+  }
+
+  return viewName
+    .replace('{objectLabelPlural}', objectMetadataItem.labelPlural)
+    .replace('{objectLabelSingular}', objectMetadataItem.labelSingular);
+};