Adding external config support

README.md

@@ -85,6 +85,10 @@ Title, icons, links, colors, and services can be configured in the `config.yml`
 # Homepage configuration
 # See https://fontawesome.com/icons for icons options
 
+# Optional: Use external configuration file. 
+# Using this will ignore remaining config in this file
+# externalConfig: https://example.com/server-luci/config.yaml
+
 title: "App dashboard"
 subtitle: "Homer"
 logo: "assets/homer.png"

src/App.vue

@@ -63,7 +63,7 @@
               </h2>
               <Service
                 v-for="item in group.items"
-                :key="item.url"
+                :key="item.name"
                 v-bind:item="item"
                 class="column is-one-third-widescreen"
               />
@@ -153,19 +153,28 @@ export default {
     document.title = `${this.config.title} | ${this.config.subtitle}`;
   },
   methods: {
-    getConfig: function () {
+    getConfig: function (path = "config.yml") {
-      return fetch("config.yml")
+      return fetch(path).then((response) => {
-        .then((response) => {
         if (!response.ok) {
           throw Error(response.statusText);
         }
-          return response.text().then((body) => {
+
+        const that = this;
+        return response
+          .text()
+          .then((body) => {
             return jsyaml.load(body);
-          });
+          })
+          .then(function (config) {
+            if (config.externalConfig) {
+              return that.getConfig(config.externalConfig);
+            }
+            return config;
           })
           .catch((error) => {
             return this.handleErrors("⚠️ Error loading configuration", error);
           });
+      });
     },
     matchesFilter: function (item) {
       return (