🐛 Add working refresh button

src/pages/catlinez/catlinez.stories.ts

@@ -1,7 +1,11 @@
 import "./catlinez.css";
 import { displayHeader } from "../../components/header/header";
 import { createElement } from "../../utils/createElement";
-import { getRandomCat, getRandomHeadlineGerman } from "../../utils/api";
+import {
+  getRandomCat,
+  getRandomHeadlineGerman,
+  randomNumber,
+} from "../../utils/api";
 import { displayCat } from "../../components/cat/randomcat";
 import { displayGermanHeadline } from "../../components/headline/headline";
 
@@ -11,25 +15,25 @@ export default {
 };
 
 export const catlinez = (args, { loaded: { cat, headline } }) => {
-  const test = displayCat(cat);
+  const catElement = displayCat(cat);
+  const headlineElement = displayGermanHeadline(headline);
 
   const randomButton = createElement("button", {
     className: "randomButton",
     innerText: "Refresh",
     onclick: async () => {
-      location.reload();
-      // buildCatlinez.replaceChild(test, buildCatlinez.childNodes[1]);
+      const cat = await getRandomCat();
+      const headline = await getRandomHeadlineGerman();
+      const catElement = displayCat(cat);
+      const headlineElement = displayGermanHeadline(headline);
+      buildCatlinez.replaceChild(catElement, buildCatlinez.childNodes[1]);
+      buildCatlinez.replaceChild(headlineElement, buildCatlinez.childNodes[2]);
     },
   });
 
   const buildCatlinez = createElement("div", {
     className: "catlinez__container",
-    childs: [
-      displayHeader(),
-      test,
-      displayGermanHeadline(headline),
-      randomButton,
-    ],
+    childs: [displayHeader(), catElement, headlineElement, randomButton],
   });
 
   return buildCatlinez;

src/utils/api.ts

@@ -59,9 +59,13 @@ export type Headline = {
   link: string;
 };
 
-const randomHeadline = Math.floor(Math.random() * 30);
+export function randomNumber() {
+  const num = Math.floor(Math.random() * 30);
+  return num;
+}
 
 function convertToText(headline: News): Headline {
+  const randomHeadline = randomNumber();
   return {
     headline: headline.news[randomHeadline].title,
     link: headline.news[randomHeadline].url,