From 5f5fcf68249df6cd83a1e3087e9309bc4f8840cb Mon Sep 17 00:00:00 2001
From: Knut Ahlers <knut@ahlers.me>
Date: Sat, 13 Jul 2024 13:08:37 +0200
Subject: [PATCH] Simplify fetch-code

Signed-off-by: Knut Ahlers <knut@ahlers.me>
---
 src/components/botauth.vue                 | 17 +++++++----------
 src/components/dashboard/activeRaffles.vue |  3 +--
 src/components/dashboard/healthcheck.vue   |  3 +--
 src/components/dashboard/scopes.vue        |  3 +--
 src/global.d.ts                            |  2 ++
 src/main.ts                                |  8 ++++++++
 6 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/src/components/botauth.vue b/src/components/botauth.vue
index f96b921..003deb0 100644
--- a/src/components/botauth.vue
+++ b/src/components/botauth.vue
@@ -81,25 +81,22 @@ export default defineComponent({
         })
     },
 
-    fetchAuthURLs(): Promise<void> {
-      return fetch('config-editor/auth-urls', this.$root?.fetchOpts)
-        .then((resp: Response) => this.$root?.parseResponseFromJSON(resp))
+    fetchAuthURLs(): Promise<void> | undefined {
+      return this.$root?.fetchJSON('config-editor/auth-urls')
         .then((data: any) => {
           this.authURLs = data
         })
     },
 
-    fetchBotProfile(user: string): Promise<void> {
-      return fetch(`config-editor/user?user=${user}`, this.$root?.fetchOpts)
-        .then((resp: Response) => this.$root?.parseResponseFromJSON(resp))
+    fetchBotProfile(user: string): Promise<void> | undefined {
+      return this.$root?.fetchJSON(`config-editor/user?user=${user}`)
         .then((data: any) => {
           this.botProfile = data
         })
     },
 
-    fetchGeneralConfig(): Promise<void> {
-      return fetch('config-editor/general', this.$root?.fetchOpts)
-        .then((resp: Response) => this.$root?.parseResponseFromJSON(resp))
+    fetchGeneralConfig(): Promise<void> | undefined {
+      return this.$root?.fetchJSON('config-editor/general')
         .then((data: any) => {
           this.generalConfig = data
         })
@@ -109,7 +106,7 @@ export default defineComponent({
   mounted() {
     this.fetchAuthURLs()
     this.fetchGeneralConfig()
-      .then(() => this.fetchBotProfile(this.generalConfig.bot_name))
+      ?.then(() => this.fetchBotProfile(this.generalConfig.bot_name))
   },
 
   name: 'TwitchBotEditorBotAuth',
diff --git a/src/components/dashboard/activeRaffles.vue b/src/components/dashboard/activeRaffles.vue
index 69f3b43..3d5e3d6 100644
--- a/src/components/dashboard/activeRaffles.vue
+++ b/src/components/dashboard/activeRaffles.vue
@@ -31,8 +31,7 @@ export default defineComponent({
 
   methods: {
     fetchRaffleCount(): void {
-      fetch('raffle/', this.$root?.fetchOpts)
-        .then((resp: Response) => this.$root?.parseResponseFromJSON(resp))
+      this.$root?.fetchJSON('raffle/')
         .then((data: any) => {
           this.activeRaffles = data.filter((raffle: any) => raffle.status === 'active').length
           this.loading = false
diff --git a/src/components/dashboard/healthcheck.vue b/src/components/dashboard/healthcheck.vue
index d1376b8..8f7bb62 100644
--- a/src/components/dashboard/healthcheck.vue
+++ b/src/components/dashboard/healthcheck.vue
@@ -41,8 +41,7 @@ export default defineComponent({
 
   methods: {
     fetchStatus(): void {
-      fetch('status/status.json?fail-status=200')
-        .then((resp: Response) => resp.json())
+      this.$root?.fetchJSON('status/status.json?fail-status=200')
         .then((data: any) => {
           this.status = data
         })
diff --git a/src/components/dashboard/scopes.vue b/src/components/dashboard/scopes.vue
index de82fa6..be0e2ef 100644
--- a/src/components/dashboard/scopes.vue
+++ b/src/components/dashboard/scopes.vue
@@ -42,8 +42,7 @@ export default defineComponent({
 
   methods: {
     fetchGeneralConfig(): void {
-      fetch('config-editor/general', this.$root?.fetchOpts)
-        .then((resp: Response) => this.$root?.parseResponseFromJSON(resp))
+      this.$root?.fetchJSON('config-editor/general')
         .then((data: any) => {
           this.botScopes = data.channel_scopes[data.bot_name] || []
           this.loading = false
diff --git a/src/global.d.ts b/src/global.d.ts
index d4e555e..8a8c3c0 100644
--- a/src/global.d.ts
+++ b/src/global.d.ts
@@ -14,6 +14,7 @@ type EditorVars = {
   Version: string
 }
 
+type FetchJSONFunction = (path: string, opts: Object = {}) => Promise<any>
 type ParseResponseFunction = (resp: Response) => Promise<any>
 type TickerRegisterFunction = (id: string, func: TimerHandler, intervalMs: number) => void
 type TickerUnregisterFunction = (id: string) => void
@@ -31,6 +32,7 @@ declare module '@vue/runtime-core' {
 
     // On the $root
     check403: CheckAccessFunction
+    fetchJSON: FetchJSONFunction
     fetchOpts: RequestInit
     parseResponseFromJSON: ParseResponseFunction
     registerTicker: TickerRegisterFunction
diff --git a/src/main.ts b/src/main.ts
index 59e233f..2c1c8ed 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -74,6 +74,14 @@ const app = createApp({
       return resp
     },
 
+    fetchJSON(path: string, opts: Object = {}): Promise<any> {
+      return fetch(path, {
+        ...this.fetchOpts,
+        ...opts,
+      })
+        .then((resp: Response) => this.parseResponseFromJSON(resp))
+    },
+
     loadVars(): Promise<void | Response> {
       return fetch('editor/vars.json')
         .then((resp: Response) => resp.json())