Fix RSS Hiding

packages/web/components/templates/discoverFeed/DiscoverContainer.tsx

@@ -85,6 +85,7 @@ export function DiscoverContainer(): JSX.Element {
     hasMore,
     setPage,
     page,
+    hideDiscoverArticleMutation
   } = useGetDiscoverFeedItems(topics[0], selectedFeed, 10,discoverVisibility == 'SHOW_ALL')
   const handleFetchMore = useCallback(() => {
     if (isLoading || !hasMore) {
@@ -216,6 +217,7 @@ export function DiscoverContainer(): JSX.Element {
           handleLinkSubmission={handleSaveDiscover}
           items={discoverItems ?? []}
           viewer={viewer.viewerData?.me}
+          hideDiscoverArticle={hideDiscoverArticleMutation}
         />
         {showAddLinkModal && (
           <AddLinkModal

packages/web/components/templates/discoverFeed/DiscoverFeed/DiscoverFeed.tsx

@@ -8,6 +8,10 @@ import { HeaderText } from "../DiscoverHeader/HeaderText"
 import React from "react"
 import { DiscoverVisibilityType, TopicTabData } from "../DiscoverContainer"
 import { DiscoverFeedItem } from "../../../../lib/networking/queries/useGetDiscoverFeedItems"
+import {
+  HideDiscoverArticleInput,
+  HideDiscoverArticleOutput
+} from '../../../../lib/networking/queries/useGetDiscoverFeeds'
 
 type DiscoverItemFeedProps = {
   items: DiscoverFeedItem[]
@@ -22,7 +26,11 @@ type DiscoverItemFeedProps = {
     timezone: string,
     locale: string
   ) => Promise<SaveDiscoverArticleOutput | undefined>
+  hideDiscoverArticle: (
+    input: HideDiscoverArticleInput
+  ) => Promise<HideDiscoverArticleOutput | undefined>
 }
+
 export const DiscoverItemFeed = (props: DiscoverItemFeedProps) => {
   return (
     <>

packages/web/components/templates/discoverFeed/DiscoverItems/DiscoverItemCard.tsx

@@ -4,11 +4,11 @@ import { DiscoverGridCard } from './DiscoverItemGridCard'
 import { DiscoverItemListCard } from './DiscoverItemListCard'
 import { SaveDiscoverArticleOutput } from "../../../../lib/networking/mutations/saveDiscoverArticle"
 import { deleteDiscoverArticleMutation } from "../../../../lib/networking/mutations/deleteDiscoverArticle"
-import { hideDiscoverArticleMutation } from "../../../../lib/networking/mutations/hideDiscoverArticle"
 import { showErrorToast, showSuccessToast } from "../../../../lib/toastHelpers"
 import { useState } from "react"
 import { DiscoverFeedItem } from "../../../../lib/networking/queries/useGetDiscoverFeedItems"
 import { DiscoverVisibilityType } from "../DiscoverContainer"
+import { HideDiscoverArticleOutput } from '../../../../lib/networking/queries/useGetDiscoverFeeds'
 
 export type DiscoverItemCardProps = {
   item: DiscoverFeedItem
@@ -16,7 +16,7 @@ export type DiscoverItemCardProps = {
   visibility: DiscoverVisibilityType
   viewer?: UserBasicData
   isHovered?: boolean
-  hideDiscoverItem(item: DiscoverFeedItem): void
+  hideDiscoverItem(item: DiscoverFeedItem, setHidden: boolean): Promise<HideDiscoverArticleOutput | undefined>
   handleLinkSubmission: (
     link: string,
     timezone: string,
@@ -56,14 +56,11 @@ export function DiscoverItemCard(props: DiscoverItemCardProps): JSX.Element | nu
   }
 
   const setHiddenDiscoverItem = (item: DiscoverFeedItem, setHidden: boolean) : Promise<void> => {
-    return hideDiscoverArticleMutation({ discoverArticleId: item.id, setHidden })
+    return props.hideDiscoverItem(item, setHidden)
       .then(it => {
         if (it?.hideDiscoverArticle.id) {
           showSuccessToast(`Discover Article ${setHidden ? 'Hidden' : 'Unhidden'}`, { position: 'bottom-right' })
           setArticleHidden(setHidden)
-          if (props.visibility == 'HIDE_HIDDEN') {
-            props.hideDiscoverItem(item)
-          }
         } else {
           showErrorToast('Unable to hide Article', { position: 'bottom-right' })
         }

packages/web/components/templates/discoverFeed/DiscoverItems/DiscoverItems.tsx

@@ -6,6 +6,10 @@ import { SaveDiscoverArticleOutput } from "../../../../lib/networking/mutations/
 import { DiscoverFeedItem } from "../../../../lib/networking/queries/useGetDiscoverFeedItems"
 import { DiscoverVisibilityType } from "../DiscoverContainer"
 import { useEffect, useState } from "react"
+import {
+  HideDiscoverArticleInput,
+  HideDiscoverArticleOutput
+} from '../../../../lib/networking/queries/useGetDiscoverFeeds'
 
 type DiscoverItemsProps = {
   items: DiscoverFeedItem[]
@@ -17,14 +21,17 @@ type DiscoverItemsProps = {
     timezone: string,
     locale: string
   ) => Promise<SaveDiscoverArticleOutput | undefined>
+  hideDiscoverArticle: (
+    input: HideDiscoverArticleInput
+  ) => Promise<HideDiscoverArticleOutput | undefined>
 }
 
 export function DiscoverItems(props: DiscoverItemsProps): JSX.Element {
   const [discoverItems, setDiscoveryItems] = useState(props.items);
 
-  const hideDiscoverItem = (item: DiscoverFeedItem) => {
-    const hiddenDiscoveryList = discoverItems.filter(it => it.id != item.id);
-    setDiscoveryItems(hiddenDiscoveryList);
+  const hideDiscoverItem = (item: DiscoverFeedItem, setHidden: boolean) => {
+
+    return props.hideDiscoverArticle({ discoverArticleId: item.id, setHidden});
   }
 
   useEffect(() => {

packages/web/lib/networking/mutations/hideDiscoverArticle.ts

@@ -1,35 +0,0 @@
-import { gql } from 'graphql-request'
-import { gqlFetcher } from '../networkHelpers'
-
-export type HideDiscoverArticleInput = {
-  discoverArticleId: string
-  setHidden: boolean
-}
-
-export type HideDiscoverArticleOutput = {
-  hideDiscoverArticle: { id: string }
-}
-
-export async function hideDiscoverArticleMutation(
-  input: HideDiscoverArticleInput
-): Promise<HideDiscoverArticleOutput | undefined> {
-  const mutation = gql`
-    mutation HideDiscoverArticle($input: HideDiscoverArticleInput!) {
-      hideDiscoverArticle(input: $input) {
-        ... on HideDiscoverArticleSuccess {
-          id
-        }
-
-        ... on HideDiscoverArticleError {
-          errorCodes
-        }
-      }
-    }
-  `
-
-  const data = (await gqlFetcher(mutation, {
-    input,
-  })) as HideDiscoverArticleOutput
-
-  return data
-}

packages/web/lib/networking/queries/useGetDiscoverFeedItems.tsx

@@ -1,7 +1,8 @@
 import { gql } from 'graphql-request'
-import { publicGqlFetcher } from '../networkHelpers'
+import { gqlFetcher, publicGqlFetcher } from '../networkHelpers'
 import { useEffect, useState } from 'react'
 import { TopicTabData } from '../../../components/templates/discoverFeed/DiscoverContainer'
+import { HideDiscoverArticleInput, HideDiscoverArticleOutput } from './useGetDiscoverFeeds'
 
 const OMNIVORE_COMMUNITY_ID = '8217d320-aa5a-11ee-bbfe-a7cde356f524'
 
@@ -31,7 +32,10 @@ type DiscoverItemResponse = {
   activeTopic: TopicTabData
   hasMore: boolean
   page: number
-  setPage: (page: number) => void
+  setPage: (page: number) => void,
+  hideDiscoverArticleMutation :(
+    input: HideDiscoverArticleInput
+  ) => Promise<HideDiscoverArticleOutput | undefined>
 }
 
 export function useGetDiscoverFeedItems(
@@ -115,6 +119,41 @@ export function useGetDiscoverFeedItems(
     })
   }, [page])
 
+  const hideDiscoverArticleMutation = async(
+    input: HideDiscoverArticleInput
+  ): Promise<HideDiscoverArticleOutput | undefined> => {
+    const mutation = gql`
+    mutation HideDiscoverArticle($input: HideDiscoverArticleInput!) {
+      hideDiscoverArticle(input: $input) {
+        ... on HideDiscoverArticleSuccess {
+          id
+        }
+
+        ... on HideDiscoverArticleError {
+          errorCodes
+        }
+      }
+    }
+  `
+
+    const data = (await gqlFetcher(mutation, {
+      input,
+    })) as HideDiscoverArticleOutput
+
+    const hiddenDiscoveryList = discoverItems.
+      map(it => {
+        if (it.id == data.hideDiscoverArticle.id) {
+          return { ...it, hidden: input.setHidden }
+        }
+
+        return it
+    })
+
+    setDiscoverItems(hiddenDiscoveryList)
+
+    return data
+  }
+
   return {
     setTopic,
     activeTopic,
@@ -123,5 +162,6 @@ export function useGetDiscoverFeedItems(
     hasMore,
     page,
     setPage,
+    hideDiscoverArticleMutation
   }
 }

packages/web/lib/networking/queries/useGetDiscoverFeeds.tsx

@@ -1,13 +1,14 @@
 import { gql } from 'graphql-request'
 import useSWR from 'swr'
-import { makeGqlFetcher } from '../networkHelpers'
+import { gqlFetcher, makeGqlFetcher } from '../networkHelpers'
 
 type DiscoverFeedsQueryResponse = {
   error: any
   isLoading: boolean
   isValidating: boolean
   feeds: DiscoverFeed[]
-  revalidate: () => void
+  revalidate: () => void,
+
 }
 
 export type DiscoverFeed = {
@@ -20,6 +21,15 @@ export type DiscoverFeed = {
   type: 'rss' | 'atom'
 }
 
+export type HideDiscoverArticleInput = {
+  discoverArticleId: string
+  setHidden: boolean
+}
+
+export type HideDiscoverArticleOutput = {
+  hideDiscoverArticle: { id: string }
+}
+
 export function useGetDiscoverFeeds(): DiscoverFeedsQueryResponse {
   const query = gql`
     query GetDiscoverFeeds {