From be4408e395fb885aa50a64169e4b7c21c9b55529 Mon Sep 17 00:00:00 2001
From: David Quezada <david.quezada.m@gmail.com>
Date: Tue, 9 Nov 2021 15:12:18 -0300
Subject: [PATCH] Issue 4, Button to random episode (#12)

* Issue 4, Button to random episode

* Changed to button

* Removed ?randomEpisode query param

* Changed getRandomEpisode to use randomElement

Co-authored-by: David Quezada <davidquezada@David-Quezadas-MacBook-Pro.local>
Co-authored-by: Kalle Jillheden <kalle.jillheden@gmail.com>
---
 src/libs/episodes-repo.ts              |  5 +++++
 src/sections/EpisodeListSection.svelte | 13 ++++++++++++-
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/src/libs/episodes-repo.ts b/src/libs/episodes-repo.ts
index 8912e1c..dfe1dc5 100644
--- a/src/libs/episodes-repo.ts
+++ b/src/libs/episodes-repo.ts
@@ -1,4 +1,5 @@
 import type { LinkOrHref } from "./link";
+import { randomElement } from "./util";
 
 export interface EpisodeRawData {
   readonly id: string;
@@ -42,6 +43,10 @@ export function getEpisodeByNumber(episodeNumber: string): EpisodeData {
   return episodeMapByNumber.get(episodeNumber);
 }
 
+export function getRandomEpisode(): EpisodeData {
+  return randomElement(episodeDatas);
+}
+
 export function getAllEpisodeData(): EpisodeData[] {
   return episodeDatas;
 }
diff --git a/src/sections/EpisodeListSection.svelte b/src/sections/EpisodeListSection.svelte
index ca16e27..59c187d 100644
--- a/src/sections/EpisodeListSection.svelte
+++ b/src/sections/EpisodeListSection.svelte
@@ -1,9 +1,15 @@
 <script lang="ts">
   import Section from "./base/Section.svelte";
-  import { getAllEpisodeData } from "../libs/episodes-repo";
+  import { getAllEpisodeData, getRandomEpisode } from "../libs/episodes-repo";
   import Link from "../Link.svelte";
+  import { navigate } from "../libs/util";
 
   export let currentEpisodeId: string = null;
+
+  function onClickRandomEpisode() {
+    const epi = getRandomEpisode();
+    navigate(`?episode=${epi.number}`);
+  }
 </script>
 
 <Section title="Episodes">
@@ -17,6 +23,11 @@
         {/if}
       </li>
     {/each}
+    <li>
+      <button class="link" on:click={onClickRandomEpisode}
+        >??: Random episode</button
+      >
+    </li>
   </ol>
 </Section>