fix: I should be able to use "enter" key to create profile (#4978)

## Context
Fixes #4808 

TL;DR
Introducing pure stateless modal component ("UI modal") for our auth
modal not to have default hotkeyScope overriding our create-profile
hotkeyScope
+ we dont want the shortcut to be available for all the modal content, only for the input that should not be using a hotkeyscope, so we are using onKeyDown for the specific issue on create profile.

Explanation
create-profile hotkey scope is set by PageChangeEffect; CreateProfile
component adds enter key shortcut; but this scope is overwritten by the
default scope by the Modal component that expects a hotkeyScope to reset
to (and defaults to the default hotkeyScope if none indicated).
In the auth flow we were using that Modal component to give a modal look
to the flow but it is not a modal per say, it's a set of pages contained
within a modal look.
By creating this UI component we are escaping that hotkeyScope
overriding that does not make sense in our context.

## How was it tested
Locally
Storybook

packages/twenty-front/src/modules/auth/components/Modal.tsx

@@ -1,9 +1,9 @@
 import React from 'react';
 import styled from '@emotion/styled';
 
-import { Modal as UIModal } from '@/ui/layout/modal/components/Modal';
+import { ModalLayout } from '@/ui/layout/modal/components/ModalLayout';
 
-const StyledContent = styled(UIModal.Content)`
+const StyledContent = styled(ModalLayout.Content)`
   align-items: center;
   width: calc(400px - ${({ theme }) => theme.spacing(10 * 2)});
 `;
@@ -11,7 +11,7 @@ const StyledContent = styled(UIModal.Content)`
 type AuthModalProps = { children: React.ReactNode };
 
 export const AuthModal = ({ children }: AuthModalProps) => (
-  <UIModal isOpen={true} padding={'none'}>
+  <ModalLayout padding={'none'}>
     <StyledContent>{children}</StyledContent>
-  </UIModal>
+  </ModalLayout>
 );