admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Remove useless skelettonLoader (#11096)

Browse Source 
## 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"
/>
This commit is contained in:
martmull
2025-03-21 16:19:45 +01:00
committed by GitHub
parent c961d3a60d
commit 6a412a531f
2 changed files with 3 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
packages/twenty-front/src/modules/object-record/record-show/components/SummaryCard.tsx
View File

@ -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={{

36
packages/twenty-front/src/modules/ui/layout/show-page/components/ShowPageSummaryCardSkeletonLoader.tsx
View File

@ -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>
);
};