fix: adjust SellWithArtsyRecentlySold rail card height (#11188)

artsy · Nov 25, 2024 · 0065ee9 · 0065ee9
1 parent 0e9cb52
commit 0065ee9
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 15 deletions.
diff --git a/src/app/Components/ArtworkRail/ArtworkRailCard.tsx b/src/app/Components/ArtworkRail/ArtworkRailCard.tsx
@@ -43,7 +43,7 @@ export const ArtworkRailCard: React.FC<ArtworkRailCardProps> = ({
   hideCuratorsPickSignal = false,
   lotLabel,
   showPartnerName = false,
-  metaContainerStyles,
+  containerHeight,
   onPress,
   SalePriceComponent,
   showSaveIcon = false,
@@ -108,7 +108,9 @@ export const ArtworkRailCard: React.FC<ArtworkRailCardProps> = ({
             testID={testID}
           >
             <Flex
-              height={ARTWORK_RAIL_CARD_IMAGE_HEIGHT + artworkRailCardMetaDataHeight}
+              height={
+                containerHeight ?? ARTWORK_RAIL_CARD_IMAGE_HEIGHT + artworkRailCardMetaDataHeight
+              }
               justifyContent="flex-start"
             >
               <ArtworkRailCardImage artwork={artwork} />
@@ -127,7 +129,6 @@ export const ArtworkRailCard: React.FC<ArtworkRailCardProps> = ({
                 hideCuratorsPickSignal={hideCuratorsPickSignal}
                 hideIncreasedInterestSignal={hideIncreasedInterestSignal}
                 lotLabel={lotLabel}
-                metaContainerStyles={metaContainerStyles}
                 SalePriceComponent={SalePriceComponent}
                 showPartnerName={showPartnerName}
                 showSaveIcon={showSaveIcon}

diff --git a/src/app/Components/ArtworkRail/ArtworkRailCardMeta.tsx b/src/app/Components/ArtworkRail/ArtworkRailCardMeta.tsx
@@ -23,7 +23,7 @@ export interface ArtworkRailCardCommonProps extends ArtworkActionTrackingProps {
   hideIncreasedInterestSignal?: boolean
   hideCuratorsPickSignal?: boolean
   lotLabel?: string | null
-  metaContainerStyles?: {}
+  containerHeight?: number
   showSaveIcon?: boolean
   showPartnerName?: boolean
   /**
@@ -54,7 +54,6 @@ export const ArtworkRailCardMeta: React.FC<ArtworkRailCardMetaProps> = ({
   hideCuratorsPickSignal = false,
   hideIncreasedInterestSignal = false,
   lotLabel,
-  metaContainerStyles,
   SalePriceComponent,
   showPartnerName = false,
   showSaveIcon = false,
@@ -128,13 +127,7 @@ export const ArtworkRailCardMeta: React.FC<ArtworkRailCardMetaProps> = ({
     !sale?.isAuction && !displayLimitedTimeOfferSignal && !!collectorSignals
 
   return (
-    <Flex
-      style={{
-        ...metaContainerStyles,
-      }}
-      flexDirection="row"
-      justifyContent="space-between"
-    >
+    <Flex flexDirection="row" justifyContent="space-between">
       <Flex flex={1}>
         {!!lotLabel && (
           <Text lineHeight="20px" color={secondaryColor} numberOfLines={1}>

diff --git a/src/app/Scenes/SellWithArtsy/Components/SellWithArtsyRecentlySold.tsx b/src/app/Scenes/SellWithArtsy/Components/SellWithArtsyRecentlySold.tsx
@@ -10,6 +10,7 @@ import {
   ARTWORK_RAIL_CARD_MINIMUM_WIDTH,
   ArtworkRailCard,
 } from "app/Components/ArtworkRail/ArtworkRailCard"
+import { ARTWORK_RAIL_CARD_IMAGE_HEIGHT } from "app/Components/ArtworkRail/ArtworkRailCardImage"
 import { PrefetchFlashList } from "app/Components/PrefetchFlashList"
 import { navigate } from "app/system/navigation/navigate"
 import { extractNodes } from "app/utils/extractNodes"
@@ -104,9 +105,8 @@ const RecentlySoldArtworksRail: React.FC<RecentlySoldArtworksRailProps> = ({
           onPress={() => {
             onPress?.(item, index)
           }}
-          metaContainerStyles={{
-            height: PixelRatio.getFontScale() * 100,
-          }}
+          // adding 20 to make sure the estimated section is not cut off when displayed in two lines
+          containerHeight={ARTWORK_RAIL_CARD_IMAGE_HEIGHT + PixelRatio.getFontScale() * 100 + 20}
           showPartnerName={showPartnerName}
           SalePriceComponent={
             <RecentlySoldCardSection