From da561ca58b2416a3f59dc199bc93e5c9bf701839 Mon Sep 17 00:00:00 2001
From: Jackson Harper <jacksonh@gmail.com>
Date: Wed, 13 Apr 2022 13:38:36 -0700
Subject: [PATCH] Query for labels with library items. Display properly on the
 home feed

---
 .../LibraryCards/GridLinkedItemCard.tsx       |  4 +--
 .../queries/useGetLibraryItemsQuery.tsx       | 29 +++++++++++++++++--
 2 files changed, 29 insertions(+), 4 deletions(-)

diff --git a/packages/web/components/patterns/LibraryCards/GridLinkedItemCard.tsx b/packages/web/components/patterns/LibraryCards/GridLinkedItemCard.tsx
index bb60b4c37..5d61e35b4 100644
--- a/packages/web/components/patterns/LibraryCards/GridLinkedItemCard.tsx
+++ b/packages/web/components/patterns/LibraryCards/GridLinkedItemCard.tsx
@@ -155,8 +155,8 @@ export function GridLinkedItemCard(props: LinkedItemCardProps): JSX.Element {
         )}
       </HStack>
       <HStack css={{ mt: '8px' }}>
-        {props.item.labels?.map(({ description, color }, index) => (
-          <LabelChip key={index} text={description || ''} color={color} />
+        {props.item.labels?.map(({ name, color }, index) => (
+          <LabelChip key={index} text={name || ''} color={color} />
         ))}
       </HStack>
     </VStack>
diff --git a/packages/web/lib/networking/queries/useGetLibraryItemsQuery.tsx b/packages/web/lib/networking/queries/useGetLibraryItemsQuery.tsx
index ad02f5e96..a12a19219 100644
--- a/packages/web/lib/networking/queries/useGetLibraryItemsQuery.tsx
+++ b/packages/web/lib/networking/queries/useGetLibraryItemsQuery.tsx
@@ -6,7 +6,7 @@ import { articleFragment } from '../fragments/articleFragment'
 import { setLinkArchivedMutation } from '../mutations/setLinkArchivedMutation'
 import { deleteLinkMutation } from '../mutations/deleteLinkMutation'
 import { articleReadingProgressMutation } from '../mutations/articleReadingProgressMutation'
-import { Label } from './../fragments/labelFragment'
+import { Label, labelFragment } from './../fragments/labelFragment'
 import { showErrorToast, showSuccessToast } from '../../toastHelpers'
 
 export type LibraryItemsQueryInput = {
@@ -67,6 +67,30 @@ export type PageInfo = {
   totalCount: number
 }
 
+const libraryItemFragment = gql`
+  fragment ArticleFields on Article {
+    id
+    title
+    url
+    author
+    image
+    savedAt
+    createdAt
+    publishedAt
+    contentReader
+    originalArticleUrl
+    readingProgressPercent
+    readingProgressAnchorIndex
+    slug
+    isArchived
+    description
+    linkId
+    labels {
+      ...LabelFields
+    }
+  }
+`
+
 export function useGetLibraryItemsQuery({
   limit,
   sortDescending,
@@ -109,7 +133,8 @@ export function useGetLibraryItemsQuery({
         }
       }
     }
-    ${articleFragment}
+    ${libraryItemFragment}
+    ${labelFragment}
   `
 
   const variables = {