Bug fix batches (#18588)

- clear sse state on logout
- fix no record not selectable through keyboard
- fix book a call design
- fix error notif design

packages/twenty-front/src/modules/auth/hooks/useAuth.ts

@@ -52,7 +52,7 @@ import { useOrigin } from '@/domain-manager/hooks/useOrigin';
 import { useRedirect } from '@/domain-manager/hooks/useRedirect';
 import { useRedirectToWorkspaceDomain } from '@/domain-manager/hooks/useRedirectToWorkspaceDomain';
 import { domainConfigurationState } from '@/domain-manager/states/domainConfigurationState';
-import { sseClientState } from '@/sse-db-event/states/sseClientState';
+import { useClearSseClient } from '@/sse-db-event/hooks/useClearSseClient';
 import { useLoadCurrentUser } from '@/users/hooks/useLoadCurrentUser';
 import { workspaceAuthProvidersState } from '@/workspace/states/workspaceAuthProvidersState';
 import { i18n } from '@lingui/core';
@@ -81,6 +81,7 @@ export const useAuth = () => {
     isEmailVerificationRequiredState,
   );
   const { loadCurrentUser } = useLoadCurrentUser();
+  const { clearSseClient } = useClearSseClient();
 
   const { reloadWorkspaceMetadata, resetToMockedMetadata } =
     useReloadWorkspaceMetadata();
@@ -117,9 +118,7 @@ export const useAuth = () => {
   const navigate = useNavigate();
 
   const clearSession = useCallback(async () => {
-    const sseClient = store.get(sseClientState.atom);
-
-    sseClient?.dispose();
+    clearSseClient();
 
     const authProvidersValue = store.get(workspaceAuthProvidersState.atom);
     const domainConfigurationValue = store.get(domainConfigurationState.atom);
@@ -162,6 +161,7 @@ export const useAuth = () => {
     navigate(AppPath.SignInUp);
     store.set(isAppEffectRedirectEnabledState.atom, true);
   }, [
+    clearSseClient,
     client,
     setLastAuthenticateWorkspaceDomain,
     resetToMockedMetadata,

packages/twenty-front/src/modules/object-record/record-picker/single-record-picker/components/SingleRecordPickerMenuItems.tsx

@@ -55,8 +55,8 @@ export const SingleRecordPickerMenuItems = ({
 
   const isSelectedItemId = useAtomComponentFamilyStateValue(
     isSelectedItemIdComponentFamilyState,
-    selectableListComponentInstanceId,
     'select-none',
+    selectableListComponentInstanceId,
   );
 
   useHotkeysOnFocusedElement({
@@ -69,9 +69,10 @@ export const SingleRecordPickerMenuItems = ({
     dependencies: [onCancel, resetSelectedItem],
   });
 
-  const selectableItemIds = pickableMorphItems.map(
-    (morphItem) => morphItem.recordId,
-  );
+  const selectableItemIds = [
+    ...(emptyLabel ? ['select-none'] : []),
+    ...pickableMorphItems.map((morphItem) => morphItem.recordId),
+  ];
   const [singleRecordPickerSelectedId, setSingleRecordPickerSelectedId] =
     useAtomComponentState(singleRecordPickerSelectedIdComponentState);
 

packages/twenty-front/src/modules/sse-db-event/hooks/useClearSseClient.ts

@@ -0,0 +1,25 @@
+import { activeQueryListenersState } from '@/sse-db-event/states/activeQueryListenersState';
+import { requiredQueryListenersState } from '@/sse-db-event/states/requiredQueryListenersState';
+import { sseClientState } from '@/sse-db-event/states/sseClientState';
+import { sseEventStreamIdState } from '@/sse-db-event/states/sseEventStreamIdState';
+import { sseEventStreamReadyState } from '@/sse-db-event/states/sseEventStreamReadyState';
+import { useCallback } from 'react';
+import { useStore } from 'jotai';
+
+export const useClearSseClient = () => {
+  const store = useStore();
+
+  const clearSseClient = useCallback(() => {
+    const sseClient = store.get(sseClientState.atom);
+
+    store.set(sseClientState.atom, null);
+    store.set(sseEventStreamIdState.atom, null);
+    store.set(sseEventStreamReadyState.atom, false);
+    store.set(activeQueryListenersState.atom, []);
+    store.set(requiredQueryListenersState.atom, []);
+
+    sseClient?.dispose();
+  }, [store]);
+
+  return { clearSseClient };
+};