Skip to content

Commit 9357917

Browse files
committed
feat(item): use preview metadata for saves
1 parent 40e0f68 commit 9357917

File tree

4 files changed

+106
-16
lines changed

4 files changed

+106
-16
lines changed

clients/web/src/common/api/derivers/item.js

+28-7
Original file line numberDiff line numberDiff line change
@@ -202,7 +202,7 @@ export function deriveItemData({
202202
}) {
203203
return {
204204
...item,
205-
authors: itemEnrichment?.authors || item?.authors || false,
205+
authors: item?.preview?.authors || itemEnrichment?.authors || item?.authors || false,
206206
title: title({ item, itemEnrichment, node }),
207207
thumbnail: thumbnail({ item, itemEnrichment }),
208208
excerpt: excerpt({ item, itemEnrichment }),
@@ -239,6 +239,7 @@ function title({ item, itemEnrichment, node }) {
239239
const file = urlToUse?.substring(urlToUse.lastIndexOf('/') + 1)
240240
const fileName = file ? file.replace(/\.[^/.]+$/, '') : false
241241
return (
242+
item?.preview?.title ||
242243
node?.title ||
243244
itemEnrichment?.title ||
244245
item?.collection?.title ||
@@ -258,8 +259,14 @@ function title({ item, itemEnrichment, node }) {
258259
* @returns {string:url} The most appropriate image to show as a thumbnail
259260
*/
260261
function thumbnail({ item, itemEnrichment }) {
262+
const previewImage = item?.preview?.image?.cachedImages[0]?.url
261263
const passedImage =
262-
itemEnrichment?.thumbnail || item?.thumbnail || item?.topImageUrl || item?.image?.url || false
264+
previewImage ||
265+
itemEnrichment?.thumbnail ||
266+
item?.thumbnail ||
267+
item?.topImageUrl ||
268+
item?.image?.url ||
269+
false
263270
if (passedImage) return passedImage
264271

265272
const firstImage = item?.images?.[Object.keys(item?.images)[0]]?.src
@@ -278,6 +285,7 @@ function publisher({ item, itemEnrichment, passedPublisher }) {
278285
const syndicatedPublisher = item?.syndicatedArticle?.publisher?.name
279286
//prettier-ignore
280287
return (
288+
item?.preview?.domain?.name || // Preview Metadata
281289
syndicatedPublisher || // Syndicated - provided by curation
282290
passedPublisher || // Collections - hardcoded as 'Pocket'
283291
itemEnrichment?.publisher || // Home - curatedInfo: provided by curation || Collection - publisher: provided by curation
@@ -296,7 +304,13 @@ function publisher({ item, itemEnrichment, passedPublisher }) {
296304
* @returns {string} The most appropriate excerpt to show
297305
*/
298306
function excerpt({ item, itemEnrichment }) {
299-
return itemEnrichment?.excerpt || item?.collection?.excerpt || item?.excerpt || null
307+
return (
308+
item?.preview?.excerpt ||
309+
itemEnrichment?.excerpt ||
310+
item?.collection?.excerpt ||
311+
item?.excerpt ||
312+
null
313+
)
300314
}
301315

302316
/**
@@ -326,7 +340,7 @@ function isReadable({ item }) {
326340
* @returns {string} The url that opens to a non-pocket site
327341
*/
328342
function externalUrl({ item, itemEnrichment, utmId = 'pocket_saves' }) {
329-
const urlToUse = itemEnrichment?.url || item?.givenUrl || item?.resolvedUrl
343+
const urlToUse = item?.preview?.url || itemEnrichment?.url || item?.givenUrl || item?.resolvedUrl
330344
const linkWithUTM = replaceUTM(urlToUse, utmId)
331345
return linkWithUTM
332346
}
@@ -337,7 +351,7 @@ function externalUrl({ item, itemEnrichment, utmId = 'pocket_saves' }) {
337351
* @returns {string} The url that should be saved or opened
338352
*/
339353
function saveUrl({ item, itemEnrichment }) {
340-
return itemEnrichment?.url || item?.givenUrl || item?.resolvedUrl || false
354+
return item?.preview?.url || itemEnrichment?.url || item?.givenUrl || item?.resolvedUrl || false
341355
}
342356

343357
/** ANALYTICS URL
@@ -346,7 +360,14 @@ function saveUrl({ item, itemEnrichment }) {
346360
* @returns {string} The url that should be passed to analytics
347361
*/
348362
function analyticsUrl({ node, item, itemEnrichment }) {
349-
return node?.url || item?.givenUrl || item?.resolvedUrl || itemEnrichment?.url || false
363+
return (
364+
item?.preview?.url ||
365+
node?.url ||
366+
item?.givenUrl ||
367+
item?.resolvedUrl ||
368+
itemEnrichment?.url ||
369+
false
370+
)
350371
}
351372

352373
/** READ URl
@@ -379,7 +400,7 @@ export function readUrl({ item, node, itemEnrichment, status }) {
379400
if (!readable) return external
380401

381402
// Otherwise we are gonna open it in reader view
382-
const itemId = item?.readerSlug || node?.id || item?.itemId
403+
const itemId = item?.shareId || node?.id || item?.itemId
383404
return `/read/${itemId}`
384405
}
385406

clients/web/src/common/api/fragments/fragment.item.js

+1
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ export const FRAGMENT_ITEM = gql`
44
fragment ItemDetails on Item {
55
isArticle
66
title
7+
shareId: id
78
itemId
89
readerSlug
910
resolvedId

clients/web/src/common/api/queries/get-saved-items.js

+61-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { requestGQL } from 'common/utilities/request/request'
22
import { gql } from 'common/utilities/gql/gql'
33
import { FRAGMENT_ITEM } from 'common/api/fragments/fragment.item'
4+
import { FRAGMENT_ITEM_PREVIEW } from '../fragments/fragment.preview'
45
import { itemFiltersFromGraph } from './get-saved-items.filters'
56
import { actionToCamelCase } from 'common/utilities/strings/strings'
67

@@ -20,7 +21,6 @@ const getSavedItemsQuery = gql`
2021
url
2122
_createdAt
2223
_updatedAt
23-
id
2424
status
2525
isFavorite
2626
favoritedAt
@@ -48,15 +48,73 @@ const getSavedItemsQuery = gql`
4848
}
4949
${FRAGMENT_ITEM}
5050
`
51-
export async function getSavedItems({ actionType, sortOrder = 'DESC', tagNames, pagination }) {
51+
52+
const getSavedItemsPreviewMetadataQuery = gql`
53+
query GetSavedItems(
54+
$filter: SavedItemsFilter
55+
$sort: SavedItemsSort
56+
$pagination: PaginationInput
57+
) {
58+
user {
59+
savedItems(filter: $filter, sort: $sort, pagination: $pagination) {
60+
edges {
61+
cursor
62+
node {
63+
_createdAt
64+
_updatedAt
65+
status
66+
isFavorite
67+
favoritedAt
68+
isArchived
69+
archivedAt
70+
tags {
71+
id
72+
name
73+
}
74+
item {
75+
... on Item {
76+
isArticle
77+
hasImage
78+
hasVideo
79+
timeToRead
80+
shareId: id
81+
itemId
82+
preview {
83+
...ItemPreview
84+
}
85+
}
86+
}
87+
}
88+
}
89+
pageInfo {
90+
hasNextPage
91+
hasPreviousPage
92+
startCursor
93+
endCursor
94+
}
95+
totalCount
96+
}
97+
}
98+
}
99+
${FRAGMENT_ITEM_PREVIEW}
100+
`
101+
102+
export async function getSavedItems({
103+
actionType,
104+
sortOrder = 'DESC',
105+
tagNames,
106+
pagination,
107+
usePreviewMetaData
108+
}) {
109+
const query = usePreviewMetaData ? getSavedItemsPreviewMetadataQuery : getSavedItemsQuery
52110
const requestDetails = itemFiltersFromGraph[actionType]
53111
if (!requestDetails) throw new MalformedItemRequestError()
54112

55113
const { filter, sort } = requestDetails
56114
const variables = { filter: { ...filter, tagNames }, sort: { ...sort, sortOrder }, pagination }
57115
const operationName = actionToCamelCase(actionType)
58116

59-
return requestGQL({ query: getSavedItemsQuery, operationName, variables })
117+
return requestGQL({ query, operationName, variables })
60118
.then(handleResponse)
61119
.catch((error) => console.error(error))
62120
}

clients/web/src/connectors/items/items-saved.state.js

+16-6
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { put, takeEvery } from 'redux-saga/effects'
1+
import { put, takeEvery, select } from 'redux-saga/effects'
22
import { getSavedItems } from 'common/api/queries/get-saved-items'
33
import { getSavedItemsTagged } from 'common/api/queries/get-saved-items-tagged'
44
import { getSavedItemsSearch } from 'common/api/queries/get-saved-items-search'
@@ -81,14 +81,24 @@ export const itemsSavedSagas = [
8181
takeEvery(ITEMS_SAVED_UPDATE_REQUEST, savedItemUpdateRequest)
8282
]
8383

84+
/** SAGA :: SELECTORS
85+
--------------------------------------------------------------- */
86+
const getFlags = (state) => state.features
87+
8488
/** SAGA :: RESPONDERS
8589
--------------------------------------------------------------- */
8690
function* savedItemRequest(action) {
8791
try {
92+
const features = yield select(getFlags)
93+
const previewMetaDataFlag = features['preview.metadata'] ?? {}
94+
const usePreviewMetaData =
95+
(previewMetaDataFlag?.active && previewMetaDataFlag?.assigned) || false
96+
8897
const { actionType, sortOrder, pagination, count } = action
8998
const { pageInfo, edges, totalCount } = yield getSavedItems({
9099
actionType,
91100
sortOrder,
101+
usePreviewMetaData,
92102
count,
93103
pagination
94104
}) || {}
@@ -99,7 +109,7 @@ function* savedItemRequest(action) {
99109
const savedItemIds = edges
100110
.filter(validateEdge)
101111
.filter(removeStarterArticle)
102-
.map((edge) => edge?.node?.id)
112+
.map((edge) => edge?.node?.item?.itemId)
103113

104114
const nodes = edges.reduce(getNodeFromEdge, {})
105115
const itemsById = edges.reduce(getItemFromEdge, {})
@@ -208,25 +218,25 @@ const getNodeFromEdge = (previous, current) => {
208218
const cursor = current.cursor
209219
const { item, ...node } = current.node
210220
if (node.status === 'DELETED') return previous // REMOVE DELETED ITEMS FROM THE RESPONSE
211-
return { ...previous, [node.id]: { cursor, ...node } }
221+
return { ...previous, [item.itemId]: { cursor, ...node } }
212222
}
213223

214224
const getItemFromEdge = (previous, current) => {
215225
const { item, node } = deriveSavedItem(current.node)
216226
if (node.status === 'DELETED') return previous
217-
return { ...previous, [node.id]: item } // REMOVE DELETED ITEMS FROM THE RESPONSE
227+
return { ...previous, [item.itemId]: item } // REMOVE DELETED ITEMS FROM THE RESPONSE
218228
}
219229

220230
const getSearchNodeFromEdge = (previous, current) => {
221231
const { item, ...node } = current.node.savedItem
222232
if (node.status === 'DELETED') return previous
223-
return { ...previous, [node.id]: node } // REMOVE DELETED ITEMS FROM THE RESPONSE
233+
return { ...previous, [item.itemId]: node } // REMOVE DELETED ITEMS FROM THE RESPONSE
224234
}
225235

226236
const getSearchItemFromEdge = (previous, current) => {
227237
const { item, node } = deriveSavedItem(current.node.savedItem)
228238
if (node.status === 'DELETED') return previous
229-
return { ...previous, [node.id]: item } // REMOVE DELETED ITEMS FROM THE RESPONSE
239+
return { ...previous, [item.itemId]: item } // REMOVE DELETED ITEMS FROM THE RESPONSE
230240
}
231241

232242
/**

0 commit comments

Comments
 (0)