Fix view picker small bugs (#16987)

This PR solves small bugs around the view picker.

- Couldn’t obtain optimistic update after a re-order of a view by drag
and drop, we needed to refresh the page
- Picking a new icon wouldn’t trigger optimistic update (same problem)
- Picking a new icon would change the view (difficult to understand
behavior)
- Picking a new icon would trigger left drawer collapse (z-index
problem)

Since core views are not being handled by object metadata items anymore,
and that all view logic is plugged on coreViewsState, this PR
implemented optimistic effect by upserting into this state.

Fixes https://github.com/twentyhq/twenty/issues/15422
Fixes https://github.com/twentyhq/twenty/issues/16986

# Before


https://github.com/user-attachments/assets/64099c21-df9f-4772-ab0d-9ea449aed761

# After


https://github.com/user-attachments/assets/f4e844b3-6530-4178-abdb-b7a10d2327b8

---------

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

packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx

@@ -9,6 +9,8 @@ import { SelectableList } from '@/ui/layout/selectable-list/components/Selectabl
 import { arrayToChunks } from '~/utils/array/arrayToChunks';
 
 import { ICON_PICKER_DROPDOWN_CONTENT_WIDTH } from '@/ui/input/components/constants/IconPickerDropdownContentWidth';
+import { IconPickerScrollEffect } from '@/ui/input/hooks/IconPickerScrollEffect';
+import { iconPickerVisibleCountState } from '@/ui/input/states/iconPickerVisibleCountState';
 import { DropdownContent } from '@/ui/layout/dropdown/components/DropdownContent';
 import { useCloseDropdown } from '@/ui/layout/dropdown/hooks/useCloseDropdown';
 import { type DropdownOffset } from '@/ui/layout/dropdown/types/DropdownOffset';
@@ -25,8 +27,6 @@ import {
   type IconButtonVariant,
   LightIconButton,
 } from 'twenty-ui/input';
-import { IconPickerScrollEffect } from '@/ui/input/hooks/IconPickerScrollEffect';
-import { iconPickerVisibleCountState } from '@/ui/input/states/iconPickerVisibleCountState';
 
 export type IconPickerProps = {
   disabled?: boolean;
@@ -86,7 +86,7 @@ const convertIconKeyToLabel = (iconKey: string) =>
 
 type IconPickerIconProps = {
   iconKey: string;
-  onClick: () => void;
+  onSelect: () => void;
   selectedIconKey?: string;
   Icon: IconComponent;
   focusedIconKey?: string;
@@ -94,7 +94,7 @@ type IconPickerIconProps = {
 
 const IconPickerIcon = ({
   iconKey,
-  onClick,
+  onSelect,
   selectedIconKey,
   Icon,
   focusedIconKey,
@@ -106,7 +106,7 @@ const IconPickerIcon = ({
 
   return (
     <StyledMatrixItem>
-      <SelectableListItem itemId={iconKey} onEnter={onClick}>
+      <SelectableListItem itemId={iconKey} onEnter={onSelect}>
         <StyledLightIconButton
           key={iconKey}
           aria-label={convertIconKeyToLabel(iconKey)}
@@ -115,7 +115,7 @@ const IconPickerIcon = ({
           isSelected={iconKey === selectedIconKey || !!isSelectedItemId}
           isFocused={iconKey === focusedIconKey}
           Icon={Icon}
-          onClick={onClick}
+          onClick={onSelect}
         />
       </SelectableListItem>
     </StyledMatrixItem>
@@ -301,7 +301,7 @@ export const IconPicker = ({
                         <IconPickerIcon
                           key={iconKey}
                           iconKey={iconKey}
-                          onClick={() => {
+                          onSelect={() => {
                             onChange({ iconKey, Icon: getIcon(iconKey) });
                             closeDropdown(dropdownId);
                           }}