From 6a412a531fb01daf06baed4694bda0b47f2b433c Mon Sep 17 00:00:00 2001
From: martmull <martmull@hotmail.fr>
Date: Fri, 21 Mar 2025 16:19:45 +0100
Subject: [PATCH] Remove useless skelettonLoader (#11096)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## After

![image](https://github.com/user-attachments/assets/772e9a8c-5df2-4bfd-95ea-5854022e82e0)
<img width="825" alt="Capture d’écran 2025-03-21 à 15 43 14"
src="https://github.com/user-attachments/assets/87818683-9cb0-4264-a6c3-f0420b0ae34d"
/>
---
 .../record-show/components/SummaryCard.tsx    |  9 ++---
 .../ShowPageSummaryCardSkeletonLoader.tsx     | 36 -------------------
 2 files changed, 3 insertions(+), 42 deletions(-)
 delete mode 100644 packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageSummaryCardSkeletonLoader.tsx

diff --git a/packages/twenty-front/src/modules/object-record/record-show/components/SummaryCard.tsx b/packages/twenty-front/src/modules/object-record/record-show/components/SummaryCard.tsx
index f5aac9de8..13f10430e 100644
--- a/packages/twenty-front/src/modules/object-record/record-show/components/SummaryCard.tsx
+++ b/packages/twenty-front/src/modules/object-record/record-show/components/SummaryCard.tsx
@@ -8,7 +8,6 @@ import { recordStoreFamilySelector } from '@/object-record/record-store/states/s
 import { recordStoreIdentifierFamilySelector } from '@/object-record/record-store/states/selectors/recordStoreIdentifierSelector';
 import { RecordTitleCell } from '@/object-record/record-title-cell/components/RecordTitleCell';
 import { ShowPageSummaryCard } from '@/ui/layout/show-page/components/ShowPageSummaryCard';
-import { ShowPageSummaryCardSkeletonLoader } from '@/ui/layout/show-page/components/ShowPageSummaryCardSkeletonLoader';
 import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
 import { useRecoilValue } from 'recoil';
 import { isDefined } from 'twenty-shared';
@@ -55,10 +54,6 @@ export const SummaryCard = ({
     }),
   );
 
-  if (!isDefined(recordCreatedAt)) {
-    return <ShowPageSummaryCardSkeletonLoader />;
-  }
-
   return (
     <ShowPageSummaryCard
       isMobile={isMobile}
@@ -68,7 +63,9 @@ export const SummaryCard = ({
       iconColor={IconColor}
       avatarPlaceholder={recordIdentifier?.name ?? ''}
       date={recordCreatedAt ?? ''}
-      loading={isPrefetchLoading || recordLoading}
+      loading={
+        isPrefetchLoading || recordLoading || !isDefined(recordCreatedAt)
+      }
       title={
         <FieldContext.Provider
           value={{
diff --git a/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageSummaryCardSkeletonLoader.tsx b/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageSummaryCardSkeletonLoader.tsx
deleted file mode 100644
index 51b15f506..000000000
--- a/packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageSummaryCardSkeletonLoader.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { SKELETON_LOADER_HEIGHT_SIZES } from '@/activities/components/SkeletonLoader';
-import { useTheme } from '@emotion/react';
-import styled from '@emotion/styled';
-import Skeleton, { SkeletonTheme } from 'react-loading-skeleton';
-
-const StyledContainer = styled.div`
-  display: flex;
-  gap: ${({ theme }) => theme.spacing(4)};
-  height: ${({ theme }) => theme.spacing(19)};
-  margin: ${({ theme }) => theme.spacing(4)};
-`;
-
-const StyledRectangularSkeleton = styled(Skeleton)`
-  height: ${({ theme }) => theme.spacing(4)};
-  width: ${({ theme }) => theme.spacing(24)};
-  margin: ${({ theme }) => theme.spacing(1)};
-  border-radius: ${({ theme }) => theme.border.radius.sm};
-`;
-
-export const ShowPageSummaryCardSkeletonLoader = () => {
-  const theme = useTheme();
-  return (
-    <SkeletonTheme
-      baseColor={theme.background.tertiary}
-      highlightColor={theme.background.transparent.lighter}
-    >
-      <StyledContainer>
-        <Skeleton
-          height={SKELETON_LOADER_HEIGHT_SIZES.standard.xl}
-          width={40}
-        />
-        <StyledRectangularSkeleton />
-      </StyledContainer>
-    </SkeletonTheme>
-  );
-};