Migrate to twenty-ui utilities/screen-size (#7836)

This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-7540](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-7540).

 --- 

### Description

Move `utilities/screen-size` to the `twenty-ui` package

### Demo

The `useScreenSize` was used to render the mobile nav for example on the
landing page.

It still renders properly


![](https://assets-service.gitstart.com/4814/018fa684-c192-455d-a38b-3b212fdb3c1a.png)

###### Fixes [#7540](https://github.com/twentyhq/twenty/issues/7540)

###### Dev QA

- [x] `utilities/screen-size` should be moved to the `twenty-ui` folder

- [x] The mobile nav should still show on the landing page

Co-authored-by: gitstart-twenty <[email protected]>
Co-authored-by: Charles Bochet <[email protected]>

packages/twenty-front/src/modules/ui/layout/page/components/DefaultLayout.tsx

@@ -10,7 +10,7 @@ import { SignInBackgroundMockPage } from '@/sign-in-background-mock/components/S
 import { useShowAuthModal } from '@/ui/layout/hooks/useShowAuthModal';
 import { NAV_DRAWER_WIDTHS } from '@/ui/navigation/navigation-drawer/constants/NavDrawerWidths';
 import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
-import { useScreenSize } from '@/ui/utilities/screen-size/hooks/useScreenSize';
+import { useScreenSize } from 'twenty-ui';
 import { css, Global, useTheme } from '@emotion/react';
 import styled from '@emotion/styled';
 import { AnimatePresence, LayoutGroup, motion } from 'framer-motion';

packages/twenty-ui/src/utilities/index.ts

@@ -3,3 +3,4 @@ export * from './image/getImageAbsoluteURI';
 export * from './isDefined';
 export * from './state/utils/createState';
 export * from './types/Nullable';
+export * from './screen-size/hooks/useScreenSize';