From 138de8d041afeaf65ab0882db971b042e4fe5299 Mon Sep 17 00:00:00 2001
From: Christian Bager Bach Houmann <christian@bagerbach.com>
Date: Fri, 8 Jul 2022 14:39:39 +0200
Subject: [PATCH] feat: cache episodes in feed

---
 src/store/index.ts                    |  4 +++-
 src/ui/PodcastView/PodcastView.svelte | 28 +++++++++++++++++++++------
 2 files changed, 25 insertions(+), 7 deletions(-)

diff --git a/src/store/index.ts b/src/store/index.ts
index 622aaf6..8025737 100644
--- a/src/store/index.ts
+++ b/src/store/index.ts
@@ -12,4 +12,6 @@ export const isPaused = writable<boolean>(true);
 export const playedEpisodes = writable<{
     [key: string]: PlayedEpisode;
 }>({});
-export const savedFeeds = writable<{[podcastName: string]: PodcastFeed}>({});
\ No newline at end of file
+export const savedFeeds = writable<{[podcastName: string]: PodcastFeed}>({});
+
+export const episodeCache = writable<{[podcastName: string]: Episode[]}>({});
\ No newline at end of file
diff --git a/src/ui/PodcastView/PodcastView.svelte b/src/ui/PodcastView/PodcastView.svelte
index c03213b..d2f3e56 100644
--- a/src/ui/PodcastView/PodcastView.svelte
+++ b/src/ui/PodcastView/PodcastView.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { PodcastFeed } from "src/types/PodcastFeed";
 	import FeedGrid from "./PodcastGrid.svelte";
-	import { currentEpisode, savedFeeds } from "src/store";
+	import { currentEpisode, savedFeeds, episodeCache } from "src/store";
 	import EpisodePlayer from "./EpisodePlayer.svelte";
 	import EpisodeList from "./EpisodeList.svelte";
 	import { Episode } from "src/types/Episode";
@@ -20,13 +20,26 @@
 		feeds = Object.values(storeValue);
 	});
 
-	function handleclickPodcast(event: CustomEvent<{ feed: PodcastFeed }>) {
+	async function fetchEpisodes(feed: PodcastFeed): Promise<Episode[]> {
+		return await (new FeedParser(feed).parse(feed.url));
+	}
+
+	function handleClickPodcast(event: CustomEvent<{ feed: PodcastFeed }>) {
+		episodeList = [];
+
 		const { feed } = event.detail;
 		selectedFeed = feed;
 
-		new FeedParser(feed).parse(feed.url).then((episodes) => {
-			episodeList = episodes;
-		});
+		const cachedEpisodesInFeed = $episodeCache[feed.title];
+
+		if (cachedEpisodesInFeed && cachedEpisodesInFeed.length > 0) {
+			episodeList = cachedEpisodesInFeed;
+		} else {
+			fetchEpisodes(feed).then(episodes => {
+				episodeList = episodes;
+				episodeCache.update(cache => ({ ...cache, [feed.title]: episodes }));
+			});
+		}
 
 		viewState = ViewState.EpisodeList;
 	}
@@ -57,7 +70,10 @@
 			on:clickEpisode={handleClickEpisode}
 		/>
 	{:else if viewState === ViewState.PodcastGrid}
-		<FeedGrid feeds={feeds} on:clickPodcast={handleclickPodcast} />
+		<FeedGrid 
+			feeds={feeds} 
+			on:clickPodcast={handleClickPodcast} 
+		/>
 	{/if}
 </div>