Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: address new save and follow issues #11102

Merged
merged 9 commits into from
Nov 19, 2024
8 changes: 8 additions & 0 deletions src/app/Components/ArtworkGrids/ArtworkGridItem.tests.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -628,6 +628,14 @@ describe("ArtworkGridItem", () => {
expect(screen.queryByTestId("follow-icon-empty")).not.toBeOnTheScreen()
expect(screen.queryByTestId("follow-icon-filled")).not.toBeOnTheScreen()
})

it("does not render Follow CTA if hideSaveIcon is true", () => {
renderWithRelay({}, { hideFollowIcon: true })

// do not render Follow CTA
expect(screen.queryByTestId("follow-icon-empty")).not.toBeOnTheScreen()
expect(screen.queryByTestId("follow-icon-filled")).not.toBeOnTheScreen()
})
})
})

Expand Down
5 changes: 4 additions & 1 deletion src/app/Components/ArtworkGrids/ArtworkGridItem.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -66,6 +66,7 @@ export interface ArtworkProps extends ArtworkActionTrackingProps {
hideRegisterBySignal?: boolean
hideSaleInfo?: boolean
hideSaveIcon?: boolean
hideFollowIcon?: boolean
/** Pass Tap to override generic ing, used for home tracking in rails */
itemIndex?: number
lotLabelTextStyle?: TextProps
Expand Down Expand Up @@ -103,6 +104,7 @@ export const Artwork: React.FC<ArtworkProps> = ({
hideRegisterBySignal = false,
hideSaleInfo = false,
hideSaveIcon = false,
hideFollowIcon = false,
itemIndex,
lotLabelTextStyle,
onPress,
Expand Down Expand Up @@ -359,7 +361,7 @@ export const Artwork: React.FC<ArtworkProps> = ({
numberOfLines={1}
{...titleTextStyle}
>
<Text lineHeight="18px" variant="xs" weight="regular" italic>
<Text lineHeight="18px" variant="xs" weight="regular">
{artwork.title}
</Text>
{artwork.date ? `, ${artwork.date}` : ""}
Expand Down Expand Up @@ -442,6 +444,7 @@ export const Artwork: React.FC<ArtworkProps> = ({
<ArtworkItemCTAs
artwork={artwork}
showSaveIcon={!hideSaveIcon}
showFollowIcon={!hideFollowIcon}
contextModule={contextModule}
contextScreen={contextScreen}
contextScreenOwnerId={contextScreenOwnerId}
Expand Down
1 change: 1 addition & 0 deletions src/app/Components/ArtworkGrids/MasonryArtworkGridItem.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@ interface MasonryArtworkGridItemProps {
partnerOffer?: PartnerOffer | null
priceOfferMessage?: PriceOfferMessage
hideSaveIcon?: boolean
hideFollowIcon?: boolean
hideSaleInfo?: boolean
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ interface MasonryInfiniteScrollArtworkGridProps extends MasonryFlashListOmittedP
hasMore?: boolean
hideSaleInfo?: boolean
hideSaveIcon?: boolean
hideFollowIcon?: boolean
isLoading?: boolean
loadMore?: (pageSize: number) => void
onPress?: (artworkID: string) => void
Expand All @@ -46,6 +47,7 @@ interface MasonryInfiniteScrollArtworkGridProps extends MasonryFlashListOmittedP
* a masonry grid in a Tab surface, use Tabs.Masonry instead.
*
*/

export const MasonryInfiniteScrollArtworkGrid: React.FC<MasonryInfiniteScrollArtworkGridProps> = ({
animated = false,
artworks,
Expand All @@ -57,6 +59,7 @@ export const MasonryInfiniteScrollArtworkGrid: React.FC<MasonryInfiniteScrollArt
hasMore,
hideSaleInfo,
hideSaveIcon,
hideFollowIcon,
isLoading,
ListEmptyComponent,
ListHeaderComponent,
Expand Down Expand Up @@ -102,6 +105,7 @@ export const MasonryInfiniteScrollArtworkGrid: React.FC<MasonryInfiniteScrollArt
onPress={onPress}
hideSaleInfo={hideSaleInfo}
hideSaveIcon={hideSaveIcon}
hideFollowIcon={hideFollowIcon}
/>
),
[rest.numColumns]
Expand Down
2 changes: 1 addition & 1 deletion src/app/Components/ArtworkRail/ArtworkRailCardMeta.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -152,7 +152,7 @@ export const ArtworkRailCardMeta: React.FC<ArtworkRailCardMetaProps> = ({

{!!title && (
<RNText numberOfLines={1} ellipsizeMode="tail">
<Text lineHeight="20px" color={secondaryTextColor} variant="xs" fontStyle="italic">
<Text lineHeight="20px" color={secondaryTextColor} variant="xs">
{title}
{!!date && (
<Text lineHeight="20px" color={secondaryTextColor} variant="xs">
Expand Down
2 changes: 1 addition & 1 deletion src/app/Components/constants.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ export const FAIR2_EXHIBITORS_PAGE_SIZE = 10
export const SHOW2_ARTWORKS_PAGE_SIZE = 30
export const SAVED_SERCHES_PAGE_SIZE = 20
export const HEART_ICON_SIZE = 22
export const ARTWORK_RAIL_CARD_CTA_ICON_SIZE = 16
export const ARTWORK_RAIL_CARD_CTA_ICON_SIZE = 18
export const ICON_HIT_SLOP = {
top: 5,
right: 5,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,7 @@ export const NotificationArtworkList: FC<NotificationArtworkListProps> = ({
onScroll={scrollHandler}
partnerOffer={partnerOffer}
priceOfferMessage={priceOfferMessage}
hideFollowIcon
/>
</Flex>
)
Expand Down
8 changes: 8 additions & 0 deletions src/app/Scenes/Artwork/Components/ArtworkItemCTAs.tests.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -94,6 +94,14 @@ describe("ArtworkItemCTAs", () => {
expect(screen.queryByTestId("follow-icon-empty")).not.toBeOnTheScreen()
expect(screen.queryByTestId("follow-icon-filled")).not.toBeOnTheScreen()
})

it("does not render Follow CTA if showFollowIcon is false", () => {
renderWithRelay({}, { showFollowIcon: false })

// do not render Follow CTA
expect(screen.queryByTestId("follow-icon-empty")).not.toBeOnTheScreen()
expect(screen.queryByTestId("follow-icon-filled")).not.toBeOnTheScreen()
})
})

describe("variant-c", () => {
Expand Down
9 changes: 7 additions & 2 deletions src/app/Scenes/Artwork/Components/ArtworkItemCTAs.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,11 +26,16 @@ import { useTracking } from "react-tracking"
interface ArtworkItemCTAsProps extends ArtworkActionTrackingProps {
artwork: ArtworkItemCTAs_artwork$key
showSaveIcon?: boolean
showFollowIcon?: boolean
}

export const ArtworkItemCTAs: React.FC<ArtworkItemCTAsProps> = ({
artwork: artworkProp,
showSaveIcon = false,
/**
* Show follow icon by default, but allow it to be hidden on specific grids
*/
showFollowIcon = true,
contextModule,
contextScreen,
contextScreenOwnerId,
Expand Down Expand Up @@ -112,7 +117,7 @@ export const ArtworkItemCTAs: React.FC<ArtworkItemCTAsProps> = ({
)}

{!!sale?.isAuction && !!collectorSignals?.auction?.lotWatcherCount && (
<Text pl={0.5} variant="xxs" numberOfLines={1} textAlign="center">
<Text lineHeight="12px" pl={0.5} variant="xxs" numberOfLines={1} textAlign="center">
{collectorSignals.auction.lotWatcherCount}
</Text>
)}
Expand Down Expand Up @@ -148,7 +153,7 @@ export const ArtworkItemCTAs: React.FC<ArtworkItemCTAsProps> = ({
<Flex flexDirection="row">
<Join separator={<Spacer x={1} />}>
{saveCTA}
{followCTA}
{!!showFollowIcon && followCTA}
</Join>
</Flex>
)
Expand Down
2 changes: 1 addition & 1 deletion src/app/Scenes/Artwork/Components/ArtworkSaveButton.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ const SaveButtonIcon: React.FC<IconProps> = ({ isSaved }) => {
return (
<HeartFillIcon
accessibilityLabel="Saved icon"
fill={!showNewSaveCTA ? "black100" : "blue100"}
fill={showNewSaveCTA ? "black100" : "blue100"}
/>
)
}
Expand Down