From d2ff1438e2eaac4b286166bcca44127c30418288 Mon Sep 17 00:00:00 2001
From: Alicia Sykes <alicia@omg.lol>
Date: Thu, 30 Dec 2021 21:20:35 +0000
Subject: [PATCH] :zap: Adds proxying support into Pi-Hole widgets (#391)

---
 src/components/Widgets/PiHoleStats.vue      | 12 +++--------
 src/components/Widgets/PiHoleTopQueries.vue | 13 +++---------
 src/components/Widgets/PiHoleTraffic.vue    | 23 +++++++++++++--------
 3 files changed, 20 insertions(+), 28 deletions(-)

diff --git a/src/components/Widgets/PiHoleStats.vue b/src/components/Widgets/PiHoleStats.vue
index 9d9ba730..2cd36897 100644
--- a/src/components/Widgets/PiHoleStats.vue
+++ b/src/components/Widgets/PiHoleStats.vue
@@ -18,7 +18,7 @@
 </template>
 
 <script>
-import axios from 'axios';
+// import axios from 'axios';
 import WidgetMixin from '@/mixins/WidgetMixin';
 import ChartingMixin from '@/mixins/ChartingMixin';
 import { capitalize } from '@/utils/MiscHelpers';
@@ -55,15 +55,9 @@ export default {
   methods: {
     /* Make GET request to local pi-hole instance */
     fetchData() {
-      axios.get(this.endpoint)
+      this.makeRequest(this.endpoint)
         .then((response) => {
-          this.processData(response.data);
-        })
-        .catch((dataFetchError) => {
-          this.error('Unable to fetch data', dataFetchError);
-        })
-        .finally(() => {
-          this.finishLoading();
+          this.processData(response);
         });
     },
     /* Assign data variables to the returned data */
diff --git a/src/components/Widgets/PiHoleTopQueries.vue b/src/components/Widgets/PiHoleTopQueries.vue
index d3334eb7..b72b2426 100644
--- a/src/components/Widgets/PiHoleTopQueries.vue
+++ b/src/components/Widgets/PiHoleTopQueries.vue
@@ -11,7 +11,6 @@
 </template>
 
 <script>
-import axios from 'axios';
 import WidgetMixin from '@/mixins/WidgetMixin';
 import { showNumAsThousand } from '@/utils/MiscHelpers';
 
@@ -46,19 +45,13 @@ export default {
   methods: {
     /* Make GET request to local pi-hole instance */
     fetchData() {
-      axios.get(this.endpoint)
+      this.makeRequest(this.endpoint)
         .then((response) => {
-          if (Array.isArray(response.data)) {
+          if (Array.isArray(response)) {
             this.error('Got success, but found no results, possible authorization error');
           } else {
-            this.processData(response.data);
+            this.processData(response);
           }
-        })
-        .catch((dataFetchError) => {
-          this.error('Unable to fetch data', dataFetchError);
-        })
-        .finally(() => {
-          this.finishLoading();
         });
     },
     /* Assign data variables to the returned data */
diff --git a/src/components/Widgets/PiHoleTraffic.vue b/src/components/Widgets/PiHoleTraffic.vue
index 1046e3ce..a2de61d1 100644
--- a/src/components/Widgets/PiHoleTraffic.vue
+++ b/src/components/Widgets/PiHoleTraffic.vue
@@ -3,7 +3,6 @@
 </template>
 
 <script>
-import axios from 'axios';
 import WidgetMixin from '@/mixins/WidgetMixin';
 import ChartingMixin from '@/mixins/ChartingMixin';
 
@@ -31,17 +30,23 @@ export default {
   methods: {
     /* Make GET request to local pi-hole instance */
     fetchData() {
-      axios.get(this.endpoint)
+      this.makeRequest(this.endpoint)
         .then((response) => {
-          this.processData(response.data);
-        })
-        .catch((dataFetchError) => {
-          this.error('Unable to fetch data', dataFetchError);
-        })
-        .finally(() => {
-          this.finishLoading();
+          if (this.validate(response)) {
+            this.processData(response);
+          }
         });
     },
+    validate(response) {
+      if (!response.ads_over_time || !response.domains_over_time) {
+        this.error('Expected data was not returned from Pi-Hole');
+        return false;
+      } else if (response.ads_over_time.length < 1) {
+        this.error('Request completed succesfully, but no data in Pi-Hole yet');
+        return false;
+      }
+      return true;
+    },
     /* Assign data variables to the returned data */
     processData(data) {
       const timeData = [];