4699 update the onboarding app placeholder (#5616)

## Before

![image](https://github.com/twentyhq/twenty/assets/29927851/e9055c16-eed3-48f1-a4e2-df115a6c2247)

## After

![image](https://github.com/twentyhq/twenty/assets/29927851/254c7573-81c7-487e-b653-5b0ba311cf9e)

packages/twenty-front/src/modules/prefetch/hooks/internal/usePrefetchRunQuery.ts

@@ -15,7 +15,7 @@ export type UsePrefetchRunQuery = {
 export const usePrefetchRunQuery = <T extends ObjectRecord>({
   prefetchKey,
 }: UsePrefetchRunQuery) => {
-  const setPrefetchDataIsLoadedLoaded = useSetRecoilState(
+  const setPrefetchDataIsLoaded = useSetRecoilState(
     prefetchIsLoadedFamilyState(prefetchKey),
   );
   const { objectMetadataItem } = useObjectMetadataItem({
@@ -28,6 +28,7 @@ export const usePrefetchRunQuery = <T extends ObjectRecord>({
     });
 
   const upsertRecordsInCache = (records: T[]) => {
+    setPrefetchDataIsLoaded(false);
     upsertFindManyRecordsQueryInCache({
       queryVariables: PREFETCH_CONFIG[prefetchKey].variables,
       recordGqlFields:
@@ -36,12 +37,12 @@ export const usePrefetchRunQuery = <T extends ObjectRecord>({
       objectRecordsToOverwrite: records,
       computeReferences: false,
     });
-    setPrefetchDataIsLoadedLoaded(true);
+    setPrefetchDataIsLoaded(true);
   };
 
   return {
     objectMetadataItem,
-    setPrefetchDataIsLoadedLoaded,
+    setPrefetchDataIsLoaded,
     upsertRecordsInCache,
   };
 };

packages/twenty-front/src/modules/prefetch/states/prefetchIsLoadedFamilyState.ts

@@ -6,5 +6,5 @@ export const prefetchIsLoadedFamilyState = createFamilyState<
   PrefetchKey
 >({
   key: 'prefetchIsLoadedFamilyState',
-  defaultValue: false,
+  defaultValue: true,
 });

packages/twenty-front/src/modules/sign-in-background-mock/components/SignInBackgroundMockPage.tsx

@@ -20,7 +20,7 @@ const StyledTableContainer = styled.div`
 export const SignInBackgroundMockPage = () => {
   return (
     <PageContainer>
-      <PageHeader title="Objects" Icon={IconBuildingSkyscraper}>
+      <PageHeader title="Companies" Icon={IconBuildingSkyscraper}>
         <PageHotkeysEffect onAddButtonClick={() => {}} />
         <PageAddButton onClick={() => {}} />
       </PageHeader>

packages/twenty-front/src/modules/sign-in-background-mock/constants/SignInBackgroundMockCompanies.ts

@@ -4,13 +4,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: '04b2e9f5-0713-40a5-8216-82802401d33e',
     domainName: 'qonto.com',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 1400,
     name: 'Qonto',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: 'OLINDA SAS. 18 rue de Navarin, 75009 Paris',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -56,8 +56,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'qonto',
-      url: null,
+      url: 'https://www.linkedin.com/company/qonto',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -109,13 +109,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: '0d940997-c21e-4ec2-873b-de4264d89025',
     domainName: 'google.com',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 72_000,
     name: 'Google',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '1600 Amphitheatre Pkwy, Mountain View, CA 94043',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -280,8 +280,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'google',
-      url: null,
+      url: 'https://www.linkedin.com/company/google',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -308,13 +308,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: '118995f3-5d81-46d6-bf83-f7fd33ea6102',
     domainName: 'facebook.com',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 87_000,
     name: 'Facebook',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '1 Hacker Way, Menlo Park, CA 94025',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -389,8 +389,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'facebook',
-      url: null,
+      url: 'https://www.linkedin.com/company/facebook',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -438,13 +438,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: '1d3a1c6e-707e-44dc-a1d2-30030bf1a944',
     domainName: 'netflix.com',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 3_000,
     name: 'Netflix',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '121 Albright Way, Los Gatos, CA 95032',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -458,8 +458,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'netflix',
-      url: null,
+      url: 'https://www.linkedin.com/company/netflix',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -486,13 +486,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: '460b6fb1-ed89-413a-b31a-962986e67bb4',
     domainName: 'microsoft.com',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 221_000,
     name: 'Microsoft',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '1 Microsoft Way, Redmond, WA 98052',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -597,8 +597,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'microsoft',
-      url: null,
+      url: 'https://www.linkedin.com/company/microsoft',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -666,13 +666,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: '7a93d1e5-3f74-492d-a101-2a70f50a1645',
     domainName: 'libeo.io',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 50,
     name: 'Libeo',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '42 Rue de Paradis, 75010 Paris',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -686,8 +686,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'libeo',
-      url: null,
+      url: 'https://www.linkedin.com/company/libeo',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -714,13 +714,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: '89bb825c-171e-4bcc-9cf7-43448d6fb278',
     domainName: 'airbnb.com',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 6_000,
     name: 'Airbnb',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '888 Brannan Street San Francisco, CA 94103',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -734,8 +734,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'airbnb',
-      url: null,
+      url: 'https://www.linkedin.com/company/airbnb',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -762,13 +762,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: '9d162de6-cfbf-4156-a790-e39854dcd4eb',
     domainName: 'claap.io',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 7,
     name: 'Claap',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '901 Fifth Avenue; Suite 1200; Seattle, WA 98164',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -782,8 +782,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'claap',
-      url: null,
+      url: 'https://www.linkedin.com/company/claap',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -810,13 +810,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: 'a674fa6c-1455-4c57-afaf-dd5dc086361d',
     domainName: 'algolia.com',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 250,
     name: 'Algolia',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '3790 El Camino Real, Unit 518, Palo Alto, CA 94306',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -861,8 +861,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'algolia',
-      url: null,
+      url: 'https://www.linkedin.com/company/algolia',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -889,13 +889,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: 'a7bc68d5-f79e-40dd-bd06-c36e6abb4678',
     domainName: 'samsung.com',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 400_000,
     name: 'Samsung',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '129, Samsung-ro, Yeongtong-gu, Suwon-si, Gyeonggi-do',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -940,8 +940,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'samsung',
-      url: null,
+      url: 'https://www.linkedin.com/company/samsung',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -968,13 +968,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: 'aaffcfbd-f86b-419f-b794-02319abe8637',
     domainName: 'hasura.io',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 17_000,
     name: 'Hasura',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '576 Folsom St., Floor 3, San Francisco, CA 94105',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -988,8 +988,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'hasura',
-      url: null,
+      url: 'https://www.linkedin.com/company/hasura',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -1016,13 +1016,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: 'f33dc242-5518-4553-9433-42d8eb82834b',
     domainName: 'wework.com',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 2_000,
     name: 'Wework',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '575 Lexington Ave 16th Floor, New York',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -1036,8 +1036,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'wework',
-      url: null,
+      url: 'https://www.linkedin.com/company/wework',
     },
     opportunities: {
       __typename: 'OpportunityConnection',
@@ -1064,13 +1064,13 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     id: 'fe256b39-3ec3-4fe3-8997-b76aa0bfa408',
     domainName: 'linkedin.com',
     updatedAt: '2023-11-23T15:38:03.699Z',
-    employees: null,
+    employees: 20_000,
     name: 'Linkedin',
     favorites: {
       __typename: 'FavoriteConnection',
       edges: [],
     },
-    address: '',
+    address: '315 Montgomery St, 13th Fl. San Francisco, CA 94104',
     accountOwner: null,
     people: {
       __typename: 'PersonConnection',
@@ -1145,8 +1145,8 @@ export const SIGN_IN_BACKGROUND_MOCK_COMPANIES = [
     idealCustomerProfile: null,
     linkedinLink: {
       __typename: 'Link',
-      label: null,
+      label: 'linkedin',
-      url: null,
+      url: 'https://www.linkedin.com/company/linkedin',
     },
     opportunities: {
       __typename: 'OpportunityConnection',

packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerSectionTitle.tsx

@@ -20,9 +20,9 @@ export const NavigationDrawerSectionTitle = ({
   label,
 }: NavigationDrawerSectionTitleProps) => {
   const loading = useIsPrefetchLoading();
-  return loading ? (
+
-    <NavigationDrawerSectionTitleSkeletonLoader />
+  if (loading) {
-  ) : (
+    return <NavigationDrawerSectionTitleSkeletonLoader />;
-    <StyledTitle>{label}</StyledTitle>
+  }
-  );
+  return <StyledTitle>{label}</StyledTitle>;
 };