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 <gitstart-twenty@users.noreply.github.com>
Co-authored-by: Charles Bochet <charles@twenty.com>

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-front/src/modules/ui/utilities/screen-size/hooks/useScreenSize.ts

@@ -1,25 +0,0 @@
-import { useEffect, useState } from 'react';
-
-export const useScreenSize = () => {
-  const [screenSize, setScreenSize] = useState({
-    width: window.innerWidth,
-    height: window.innerHeight,
-  });
-
-  useEffect(() => {
-    const handleResize = () => {
-      setScreenSize({
-        width: window.innerWidth,
-        height: window.innerHeight,
-      });
-    };
-
-    window.addEventListener('resize', handleResize);
-
-    return () => {
-      window.removeEventListener('resize', handleResize);
-    };
-  }, []);
-
-  return screenSize;
-};