diff --git a/webclient/src/Feed.js b/webclient/src/Feed.js index 51bacac..bb16a52 100644 --- a/webclient/src/Feed.js +++ b/webclient/src/Feed.js @@ -12,32 +12,53 @@ function Feed({ updateCache }) { fetch('/api') .then(res => res.json()) .then( - (result) => { - const updated = !stories || stories[0].id !== result.stories[0].id; + async (result) => { + const newApiStories = result.stories; + + const updated = !stories || !stories.length || stories[0].id !== newApiStories[0].id; console.log('New stories available:', updated); if (!updated) return; - //setStories(result.stories); - //localStorage.setItem('stories', JSON.stringify(result.stories)); + const existingStoryIds = new Set(stories ? stories.map(s => s.id) : []); - //localForage.clear(); - //result.stories.forEach((x, i) => { - // fetch('/api/' + x.id) - // .then(res => res.json()) - // .then(result => { - // localForage.setItem(x.id, result.story) - // .then(console.log('preloaded', x.id, x.title)); - // updateCache(x.id, result.story); - // }, error => {} - // ); - //}); + for (const newStory of [...newApiStories].reverse()) { + if (existingStoryIds.has(newStory.id)) { + continue; + } + + try { + const storyRes = await fetch('/api/' + newStory.id); + if (!storyRes.ok) throw new Error('Story fetch failed'); + const storyResult = await storyRes.json(); + const fullStory = storyResult.story; + + await localForage.setItem(fullStory.id, fullStory); + console.log('preloaded', fullStory.id, fullStory.title); + updateCache(fullStory.id, fullStory); + + setStories(prevStories => { + const currentStories = Array.isArray(prevStories) ? prevStories : []; + const updatedStories = [newStory, ...currentStories]; + const poppedStory = updatedStories.pop(); + + if (poppedStory) { + localForage.removeItem(poppedStory.id); + } + + localStorage.setItem('stories', JSON.stringify(updatedStories)); + return updatedStories; + }); + } catch (error) { + console.log('Skipping story due to fetch error', newStory.id, error); + } + } }, (error) => { setError(true); } ); - }, [updateCache]); + }, [updateCache, stories]); return (