remove node & check prev link exists

Author: Carlos Rufo

src/components/LinkList.js

@@ -31,20 +31,18 @@ export const FEED_QUERY = gql`
 const NEW_LINKS_SUBSCRIPTION = gql`
   subscription {
     newLink {
-      node {
+      id
+      url
+      description
+      createdAt
+      postedBy {
         id
-        url
-        description
-        createdAt
-        postedBy {
+        name
+      }
+      votes {
+        id
+        user {
           id
-          name
-        }
-        votes {
-          id
-          user {
-            id
-          }
         }
       }
     }
@@ -54,28 +52,26 @@ const NEW_LINKS_SUBSCRIPTION = gql`
 const NEW_VOTES_SUBSCRIPTION = gql`
   subscription {
     newVote {
-      node {
+      id
+      link {
         id
-        link {
+        url
+        description
+        createdAt
+        postedBy {
           id
-          url
-          description
-          createdAt
-          postedBy {
-            id
-            name
-          }
-          votes {
-            id
-            user {
-              id
-            }
-          }
+          name
         }
-        user {
+        votes {
           id
+          user {
+            id
+          }
         }
       }
+      user {
+        id
+      }
     }
   }
 `
@@ -84,15 +80,15 @@ class LinkList extends Component {
   _updateCacheAfterVote = (store, createVote, linkId) => {
     const isNewPage = this.props.location.pathname.includes('new')
     const page = parseInt(this.props.match.params.page, 10)
-  
+
     const skip = isNewPage ? (page - 1) * LINKS_PER_PAGE : 0
     const first = isNewPage ? LINKS_PER_PAGE : 100
     const orderBy = isNewPage ? 'createdAt_DESC' : null
     const data = store.readQuery({
       query: FEED_QUERY,
-      variables: { first, skip, orderBy }
+      variables: { first, skip, orderBy },
     })
-  
+
     const votedLink = data.feed.links.find(link => link.id === linkId)
     votedLink.votes = createVote.link.votes
     store.writeQuery({ query: FEED_QUERY, data })
@@ -103,29 +99,29 @@ class LinkList extends Component {
       document: NEW_LINKS_SUBSCRIPTION,
       updateQuery: (prev, { subscriptionData }) => {
         if (!subscriptionData.data) return prev
-        const newLink = subscriptionData.data.newLink.node
-  
+        const newLink = subscriptionData.data.newLink
+        const exists = prev.feed.links.find(({ id }) => id === newLink.id)
+        if (exists) return prev
         return Object.assign({}, prev, {
           feed: {
             links: [newLink, ...prev.feed.links],
             count: prev.feed.links.length + 1,
-            __typename: prev.feed.__typename
-          }
+            __typename: prev.feed.__typename,
+          },
         })
-      }
+      },
     })
   }
 
   _subscribeToNewVotes = subscribeToMore => {
     subscribeToMore({
-      document: NEW_VOTES_SUBSCRIPTION
+      document: NEW_VOTES_SUBSCRIPTION,
     })
   }
-
   _getQueryVariables = () => {
     const isNewPage = this.props.location.pathname.includes('new')
     const page = parseInt(this.props.match.params.page, 10)
-  
+
     const skip = isNewPage ? (page - 1) * LINKS_PER_PAGE : 0
     const first = isNewPage ? LINKS_PER_PAGE : 100
     const orderBy = isNewPage ? 'createdAt_DESC' : null
@@ -141,15 +137,14 @@ class LinkList extends Component {
     rankedLinks.sort((l1, l2) => l2.votes.length - l1.votes.length)
     return rankedLinks
   }
-
   _nextPage = data => {
     const page = parseInt(this.props.match.params.page, 10)
     if (page <= data.feed.count / LINKS_PER_PAGE) {
       const nextPage = page + 1
       this.props.history.push(`/new/${nextPage}`)
     }
   }
-  
+
   _previousPage = () => {
     const page = parseInt(this.props.match.params.page, 10)
     if (page > 1) {
@@ -164,16 +159,16 @@ class LinkList extends Component {
         {({ loading, error, data, subscribeToMore }) => {
           if (loading) return <div>Fetching</div>
           if (error) return <div>Error</div>
-  
+
           this._subscribeToNewLinks(subscribeToMore)
           this._subscribeToNewVotes(subscribeToMore)
-  
+
           const linksToRender = this._getLinksToRender(data)
           const isNewPage = this.props.location.pathname.includes('new')
           const pageIndex = this.props.match.params.page
             ? (this.props.match.params.page - 1) * LINKS_PER_PAGE
             : 0
-  
+
           return (
             <Fragment>
               {linksToRender.map((link, index) => (
@@ -202,4 +197,4 @@ class LinkList extends Component {
   }
 }
 
-export default LinkList
+export default LinkList