diff --git a/packages/twenty-front/src/modules/app/hooks/useCreateAppRouter.tsx b/packages/twenty-front/src/modules/app/hooks/useCreateAppRouter.tsx
index 6cbe0d9b3..bc4d62a6d 100644
--- a/packages/twenty-front/src/modules/app/hooks/useCreateAppRouter.tsx
+++ b/packages/twenty-front/src/modules/app/hooks/useCreateAppRouter.tsx
@@ -1,6 +1,6 @@
import { AppRouterProviders } from '@/app/components/AppRouterProviders';
import { SettingsRoutes } from '@/app/components/SettingsRoutes';
-import { VerifyEffect } from '@/auth/components/Verify';
+import { VerifyLoginTokenEffect } from '@/auth/components/VerifyLoginTokenEffect';
import { VerifyEmailEffect } from '@/auth/components/VerifyEmailEffect';
import indexAppPath from '@/navigation/utils/indexAppPath';
@@ -39,7 +39,7 @@ export const useCreateAppRouter = (
loader={async () => Promise.resolve(null)}
>
}>
- } />
+ } />
} />
} />
} />
diff --git a/packages/twenty-front/src/modules/auth/components/Verify.tsx b/packages/twenty-front/src/modules/auth/components/VerifyLoginTokenEffect.tsx
similarity index 97%
rename from packages/twenty-front/src/modules/auth/components/Verify.tsx
rename to packages/twenty-front/src/modules/auth/components/VerifyLoginTokenEffect.tsx
index a70bbe8e4..2888811b3 100644
--- a/packages/twenty-front/src/modules/auth/components/Verify.tsx
+++ b/packages/twenty-front/src/modules/auth/components/VerifyLoginTokenEffect.tsx
@@ -11,7 +11,7 @@ import { useRecoilValue } from 'recoil';
import { isDefined } from 'twenty-shared/utils';
import { useNavigateApp } from '~/hooks/useNavigateApp';
-export const VerifyEffect = () => {
+export const VerifyLoginTokenEffect = () => {
const [searchParams] = useSearchParams();
const loginToken = searchParams.get('loginToken');
const errorMessage = searchParams.get('errorMessage');
diff --git a/packages/twenty-front/src/modules/ui/input/editor/components/CustomSlashMenu.tsx b/packages/twenty-front/src/modules/ui/input/editor/components/CustomSlashMenu.tsx
index 6b7524bfd..3ea583d5f 100644
--- a/packages/twenty-front/src/modules/ui/input/editor/components/CustomSlashMenu.tsx
+++ b/packages/twenty-front/src/modules/ui/input/editor/components/CustomSlashMenu.tsx
@@ -4,7 +4,8 @@ import styled from '@emotion/styled';
import { DropdownMenu } from '@/ui/layout/dropdown/components/DropdownMenu';
import { DropdownMenuItemsContainer } from '@/ui/layout/dropdown/components/DropdownMenuItemsContainer';
import { OverlayContainer } from '@/ui/layout/overlay/components/OverlayContainer';
-import { useFloating } from '@floating-ui/react';
+import { autoUpdate, useFloating } from '@floating-ui/react';
+import { motion } from 'framer-motion';
import { createPortal } from 'react-dom';
import { IconComponent } from 'twenty-ui/display';
import { MenuItemSuggestion } from 'twenty-ui/navigation';
@@ -32,28 +33,35 @@ const StyledInnerContainer = styled.div`
export const CustomSlashMenu = (props: CustomSlashMenuProps) => {
const { refs, floatingStyles } = useFloating({
placement: 'bottom-start',
+ whileElementsMounted: autoUpdate,
});
return (
{createPortal(
-
-
-
-
- {props.items.map((item, index) => (
- item.onItemClick()}
- text={item.title}
- LeftIcon={item.Icon}
- selected={props.selectedIndex === index}
- />
- ))}
-
-
-
- ,
+
+
+
+
+
+ {props.items.map((item, index) => (
+ item.onItemClick()}
+ text={item.title}
+ LeftIcon={item.Icon}
+ selected={props.selectedIndex === index}
+ />
+ ))}
+
+
+
+
+ ,
document.body,
)}