Fix missing icon in favourites adder

resources/components/favourites/save.html

@@ -6,7 +6,7 @@
                    :class="{ 'is-invalid': errors.name.length > 0 }" id="favourite_add_name"
                    v-model="name" v-autofocus/>
             <button class="btn btn-sm btn-dark" type="submit">
-                <ui-icon class="add" />
+                <ui-icon icon="add" />
             </button>
             <div v-if="errors.name.length > 0" class="invalid-feedback">
                 <p v-for="error in errors.name">{{ error }}</p>

resources/components/ui/icon.html

@@ -1,4 +1,4 @@
-<fa v-bind="definition" v-if="type === 'simple'"/>
+<fa v-bind="attrs" v-if="type === 'simple'"/>
 <fa-layers v-else-if="type === 'stacked'">
     <fa :icon="props.icon" v-bind="props" v-for="(props, index) in definition.icons" :key="index"/>
 </fa-layers>

resources/ts/components/ui/icon.ts

@@ -15,7 +15,7 @@ import {
     faInfoCircle,
     faMapMarkerAlt,
     faMoon,
-    faQuestionCircle,
+    faQuestionCircle, faQuestionSquare,
     faSearch,
     faSign,
     faStar,
@@ -60,6 +60,7 @@ const messageTypeIcons: Dictionary<Icon> = {
 
 const definitions: Dictionary<Icon> = {
     'favourite': simple(faStar),
+    'unknown': simple(faQuestionSquare),
     'add': simple(faCheck),
     'add-all': simple(faCheckDouble),
     'remove-stop': simple(faTimes),
@@ -113,14 +114,20 @@ export class UiIcon extends Vue {
         validator: value => typeof value === "object" || Object.keys(definitions).includes(value),
         required: true,
     })
-    icon: keyof typeof definitions;
+    icon: string | IconDefinition;
 
-    get definition() {
-        return {...(typeof this.icon === "string" ? definitions[this.icon] : { icon: this.icon }), ...this.$attrs};
+    get definition(): Icon {
+        return typeof this.icon === "string"
+            ? definitions[this.icon] || definitions['unknown']
+            : { icon: this.icon as IconDefinition, type: "simple" };
+    }
+
+    get attrs() {
+        return { ...this.definition, ...this.$attrs };
     }
 
     get type() {
-        return definitions[this.icon].type;
+        return this.definition.type;
     }
 }