Skip to content

Commit

Permalink
Merge pull request #14602 from artsy/remove-coll-profile-notifs
Browse files Browse the repository at this point in the history
feat: remove collector profile update prompt activities from Notifications
  • Loading branch information
mzikherman authored Oct 2, 2024
2 parents 9ee31c3 + 95fd638 commit a98e32a
Show file tree
Hide file tree
Showing 13 changed files with 215 additions and 939 deletions.
7 changes: 0 additions & 7 deletions src/Components/Notifications/Notification.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,6 @@ import createLogger from "Utils/logger"
import { NotificationErrorMessage } from "Components/Notifications/NotificationErrorMessage"
import { useClientQuery } from "Utils/Hooks/useClientQuery"
import { PartnerShowOpenedNotification } from "Components/Notifications/PartnerShowOpenedNotification"
import { NotificationCollectorProfileUpdatePrompt } from "Components/Notifications/NotificationCollectorProfileUpdatePrompt"

const logger = createLogger("NotificationItem")

Expand Down Expand Up @@ -125,11 +124,6 @@ const Notification: React.FC<NotificationProps> = ({ notificationId }) => {
case "VIEWING_ROOM_PUBLISHED":
return <ViewingRoomPublishedNotification notification={notification} />

case "COLLECTOR_PROFILE_UPDATE_PROMPT":
return (
<NotificationCollectorProfileUpdatePrompt notification={notification} />
)

default:
return null
}
Expand Down Expand Up @@ -160,7 +154,6 @@ const notificationQuery = graphql`
...PartnerOfferCreatedNotification_notification
...PartnerShowOpenedNotification_notification
...ViewingRoomPublishedNotification_notification
...NotificationCollectorProfileUpdatePrompt_notification
id
internalID
notificationType
Expand Down

This file was deleted.

187 changes: 82 additions & 105 deletions src/Components/Notifications/NotificationItem.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@ import { __internal__useMatchMedia } from "Utils/Hooks/useMatchMedia"
import { Media } from "Utils/Responsive"
import styled from "styled-components"
import { themeGet } from "@styled-system/theme-get"
import { NotificationItemCollectorProfileUpdatePrompt } from "Components/Notifications/NotificationItemCollectorProfileUpdatePrompt"
import { NotificationItemUnreadIndicator } from "Components/Notifications/NotificationItemUnreadIndicator"

const logger = createLogger("NotificationItem")
Expand All @@ -30,9 +29,6 @@ const NotificationItem: FC<NotificationItemProps> = ({
notification,
mode,
}) => {
const {
state: { currentNotificationId },
} = useNotificationsContext()
const { tracking } = useNotificationsTracking()
const { markAsRead } = useMarkNotificationAsRead()

Expand All @@ -45,117 +41,99 @@ const NotificationItem: FC<NotificationItemProps> = ({
tracking.clickedActivityPanelNotificationItem(notification.notificationType)
}

const isActive = currentNotificationId === notification.internalID

if (!notification.item) return null

switch (notification.item.__typename) {
case "CollectorProfileUpdatePromptNotificationItem": {
return (
<NotificationItemCollectorProfileUpdatePrompt
isActive={isActive}
isUnread={notification.isUnread}
notificationItem={notification.item}
onClick={handleClick}
/>
)
}
const remainingArtworksCount = notification.objectsCount - 4
const shouldDisplayCounts =
isArtworksBasedNotification(notification.notificationType) &&
remainingArtworksCount > 0

// FIXME: Simplify by returning unique components for each notification type
default: {
const remainingArtworksCount = notification.objectsCount - 4
const shouldDisplayCounts =
isArtworksBasedNotification(notification.notificationType) &&
remainingArtworksCount > 0
const subTitle = getNotificationSubTitle(notification)

const subTitle = getNotificationSubTitle(notification)

return (
<NotificationItemWrapper
item={notification}
mode={mode}
onClick={handleClick}
>
<Flex
flex={1}
flexDirection={
notification.notificationType === "PARTNER_OFFER_CREATED"
? "row"
: "column"
}
>
{!!notification.previewImages.length && (
<Flex flexDirection="row" alignItems="center" mb={0.5}>
<Flex flex={1}>
<Join separator={<Spacer x={1} />}>
{notification.previewImages.map((image, index) => {
if (!image.resized) return null

return (
<Image
key={index}
srcSet={image.resized.srcSet}
alt=""
height={58}
lazyLoad
placeHolderURL={image.blurhashDataURL ?? undefined}
/>
)
})}
</Join>
<Spacer x={1} />
</Flex>

{shouldDisplayCounts && (
<Text
variant="xs"
color="black60"
aria-label="Remaining artworks count"
ml={1}
>
+ {remainingArtworksCount}
</Text>
)}
</Flex>
)}
return (
<NotificationItemWrapper
item={notification}
mode={mode}
onClick={handleClick}
>
<Flex
flex={1}
flexDirection={
notification.notificationType === "PARTNER_OFFER_CREATED"
? "row"
: "column"
}
>
{!!notification.previewImages.length && (
<Flex flexDirection="row" alignItems="center" mb={0.5}>
<Flex flex={1}>
<Join separator={<Spacer x={1} />}>
{notification.previewImages.map((image, index) => {
if (!image.resized) return null

return (
<Image
key={index}
srcSet={image.resized.srcSet}
alt=""
height={58}
lazyLoad
placeHolderURL={image.blurhashDataURL ?? undefined}
/>
)
})}
</Join>
<Spacer x={1} />
</Flex>

<Flex flexDirection="column">
{shouldDisplayCounts && (
<Text
variant="xs"
color="blue100"
backgroundColor="blue10"
px={0.5}
alignSelf="flex-start"
borderRadius={3}
color="black60"
aria-label="Remaining artworks count"
ml={1}
>
{getNotificationPrelude(notification)}
</Text>

<Text fontWeight="bold" variant="sm-display">
{notification.headline}
+ {remainingArtworksCount}
</Text>

{!!subTitle && <Text variant="xs">{subTitle}</Text>}

<Flex flexDirection="row" gap={0.5}>
<NotificationTypeLabel notification={notification} />
{notification.item?.__typename ===
"PartnerOfferCreatedNotificationItem" &&
notification.item.expiresAt && (
<ExpiresInTimer
expiresAt={notification.item.expiresAt}
available={notification.item.available}
/>
)}
</Flex>
</Flex>
)}
</Flex>
)}

<Flex flexDirection="column">
<Text
variant="xs"
color="blue100"
backgroundColor="blue10"
px={0.5}
alignSelf="flex-start"
borderRadius={3}
>
{getNotificationPrelude(notification)}
</Text>

<Text fontWeight="bold" variant="sm-display">
{notification.headline}
</Text>

{!!subTitle && <Text variant="xs">{subTitle}</Text>}

<Flex flexDirection="row" gap={0.5}>
<NotificationTypeLabel notification={notification} />
{notification.item?.__typename ===
"PartnerOfferCreatedNotificationItem" &&
notification.item.expiresAt && (
<ExpiresInTimer
expiresAt={notification.item.expiresAt}
available={notification.item.available}
/>
)}
</Flex>
</Flex>
</Flex>

{notification.isUnread && <NotificationItemUnreadIndicator ml={1} />}
</NotificationItemWrapper>
)
}
}
{notification.isUnread && <NotificationItemUnreadIndicator ml={1} />}
</NotificationItemWrapper>
)
}

export const NotificationItemFragmentContainer = createFragmentContainer(
Expand All @@ -172,7 +150,6 @@ export const NotificationItemFragmentContainer = createFragmentContainer(
notificationType
objectsCount
item {
...NotificationItemCollectorProfileUpdatePrompt_notificationItem
__typename
... on PartnerOfferCreatedNotificationItem {
available
Expand Down
Loading

0 comments on commit a98e32a

Please sign in to comment.