diff --git a/packages/web/components/patterns/CardMenu.tsx b/packages/web/components/patterns/CardMenu.tsx index 5176d2a0f..229da3c98 100644 --- a/packages/web/components/patterns/CardMenu.tsx +++ b/packages/web/components/patterns/CardMenu.tsx @@ -14,6 +14,7 @@ export type CardMenuDropdownAction = | 'snooze' | 'set-labels' | 'showOriginal' + | 'unsubscribe' type CardMenuProps = { item: LibraryItemNode @@ -81,6 +82,14 @@ export function CardMenu(props: CardMenuProps): JSX.Element { }} title="Remove" /> + {!!props.item.subscription && ( + { + props.actionHandler('unsubscribe') + }} + title="Unsubscribe" + /> + )} ) } diff --git a/packages/web/components/patterns/LibraryCards/CardTypes.tsx b/packages/web/components/patterns/LibraryCards/CardTypes.tsx index 4a2b856ac..160439ee2 100644 --- a/packages/web/components/patterns/LibraryCards/CardTypes.tsx +++ b/packages/web/components/patterns/LibraryCards/CardTypes.tsx @@ -13,6 +13,7 @@ export type LinkedItemCardAction = | 'share' | 'snooze' | 'set-labels' + | 'unsubscribe' export type LinkedItemCardProps = { item: LibraryItemNode diff --git a/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx b/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx index 6f5edbd0e..92f132a26 100644 --- a/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx +++ b/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx @@ -296,6 +296,9 @@ export function HomeFeedContainer(props: HomeFeedContainerProps): JSX.Element { case 'set-labels': setLabelsTarget(item) break + case 'unsubscribe': + performActionOnItem('unsubscribe', item) + break } } diff --git a/packages/web/lib/networking/queries/useGetLibraryItemsQuery.tsx b/packages/web/lib/networking/queries/useGetLibraryItemsQuery.tsx index 89f45aa79..bdbfe4a9a 100644 --- a/packages/web/lib/networking/queries/useGetLibraryItemsQuery.tsx +++ b/packages/web/lib/networking/queries/useGetLibraryItemsQuery.tsx @@ -5,6 +5,7 @@ import type { PageType, State } from '../fragments/articleFragment' import { ContentReader } from '../fragments/articleFragment' import { setLinkArchivedMutation } from '../mutations/setLinkArchivedMutation' import { deleteLinkMutation } from '../mutations/deleteLinkMutation' +import { unsubscribeMutation } from '../mutations/unsubscribeMutation' import { articleReadingProgressMutation } from '../mutations/articleReadingProgressMutation' import { Label } from './../fragments/labelFragment' import { showErrorToast, showSuccessToast } from '../../toastHelpers' @@ -35,6 +36,7 @@ type LibraryItemAction = | 'mark-read' | 'mark-unread' | 'refresh' + | 'unsubscribe' export type LibraryItemsData = { search: LibraryItems @@ -76,6 +78,8 @@ export type LibraryItemNode = { state: State pageType: PageType siteName?: string + subscription?: string, + readAt?: string } export type PageInfo = { @@ -127,6 +131,8 @@ export function useGetLibraryItemsQuery({ annotation state siteName + subscription + readAt } } pageInfo { @@ -305,6 +311,26 @@ export function useGetLibraryItemsQuery({ readingProgressAnchorIndex: 0, }) break + case 'unsubscribe': + if (!!item.node.subscription) { + updateData({ + cursor: item.cursor, + node: { + ...item.node, + subscription: undefined, + }, + }) + unsubscribeMutation(item.node.subscription).then((res) => { + if (res) { + showSuccessToast('Unsubscribed successfully', { position: 'bottom-right' }) + } else { + showErrorToast('Error unsubscribing', { + position: 'bottom-right', + }) + } + }) + } + break case 'refresh': await mutate() }