From 35e9c8d4bf0fe6a83acdcca7717163915c0eb8a6 Mon Sep 17 00:00:00 2001
From: Robert Axelsen <raxelsen@sipwise.com>
Date: Mon, 25 Mar 2019 11:17:11 +0100
Subject: [PATCH] TT#47518 Get alerted about invalid soundsets

Change-Id: Ia6c5e2e8b0e1aec80623c4b61fb73ab7a31931ca
---
 .../PbxConfiguration/CscPbxSoundGroup.vue     | 13 +++++--
 .../PbxConfiguration/CscPbxSoundItem.vue      | 13 ++++++-
 .../pages/PbxConfiguration/CscPbxSoundSet.vue | 39 +++++++++++++++++--
 .../PbxConfiguration/CscPbxSoundSets.vue      | 10 ++++-
 src/locales/en.json                           |  4 +-
 src/store/pbx-config/getters.js               | 16 ++++++++
 src/themes/app.common.styl                    |  6 +++
 7 files changed, 91 insertions(+), 10 deletions(-)

diff --git a/src/components/pages/PbxConfiguration/CscPbxSoundGroup.vue b/src/components/pages/PbxConfiguration/CscPbxSoundGroup.vue
index 54dc762e..148297fb 100644
--- a/src/components/pages/PbxConfiguration/CscPbxSoundGroup.vue
+++ b/src/components/pages/PbxConfiguration/CscPbxSoundGroup.vue
@@ -1,6 +1,7 @@
 <template>
     <q-collapsible
         :label="groupLabel"
+        :class="groupLabelClasses"
     >
         <q-list
             striped-odd
@@ -34,7 +35,8 @@
         name: 'csc-pbx-sound-group',
         props: {
             group: Object,
-            groupLabel: String
+            groupLabel: String,
+            invalidGroup: Boolean
         },
         components: {
             CscPbxSoundItem,
@@ -52,9 +54,14 @@
             return {
             }
         },
-        mounted() {
-        },
         computed: {
+            groupLabelClasses() {
+                let classes = [];
+                if (this.invalidGroup) {
+                    classes.push('csc-collapsible-label-warning');
+                }
+                return classes;
+            }
         },
         methods: {
         },
diff --git a/src/components/pages/PbxConfiguration/CscPbxSoundItem.vue b/src/components/pages/PbxConfiguration/CscPbxSoundItem.vue
index ac412ef4..50bd19ea 100644
--- a/src/components/pages/PbxConfiguration/CscPbxSoundItem.vue
+++ b/src/components/pages/PbxConfiguration/CscPbxSoundItem.vue
@@ -1,7 +1,7 @@
 <template>
     <q-item
         highlight
-        class="csc-sound-item"
+        :class="itemClasses"
     >
         <q-item-main>
             <csc-sound-file-upload
@@ -16,6 +16,7 @@
                 :uploaded="file"
                 :disable="true"
                 @init="initSoundFileAudio"
+                :invalid="isInvalid"
             >
                 <div
                     slot="additional"
@@ -105,6 +106,16 @@
             },
             soundFileFormat() {
                 return this.platform.mozilla ? 'ogg' : 'mp3';
+            },
+            isInvalid() {
+                return !this.file;
+            },
+            itemClasses() {
+                let classes = ['csc-sound-item'];
+                if(this.isInvalid) {
+                    classes.push('csc-item-invalid');
+                }
+                return classes;
             }
         },
         methods: {
diff --git a/src/components/pages/PbxConfiguration/CscPbxSoundSet.vue b/src/components/pages/PbxConfiguration/CscPbxSoundSet.vue
index 35251e5b..01e41b2a 100644
--- a/src/components/pages/PbxConfiguration/CscPbxSoundSet.vue
+++ b/src/components/pages/PbxConfiguration/CscPbxSoundSet.vue
@@ -90,6 +90,7 @@
                 </div>
                 <csc-pbx-sound-group
                     v-for="(group, index) in set.groups"
+                    :invalid-group="invalidGroup(group)"
                     :group="group"
                     :group-label="groupLabel(group.name)"
                     :key="index"
@@ -101,6 +102,17 @@
             class="csc-list-actions-pinned"
         >
             <q-item-tile>
+                <q-btn
+                    v-if="invalid"
+                    icon="info"
+                    :big="mobile"
+                    color="negative"
+                    flat
+                >
+                    <q-tooltip>
+                        {{ tooltipLabel }}
+                    </q-tooltip>
+                </q-btn>
                 <q-btn
                     v-show="expanded"
                     icon="delete"
@@ -140,7 +152,8 @@
         QInput,
         QInnerLoading,
         QSpinnerMat,
-        QToggle
+        QToggle,
+        QTooltip
     } from 'quasar-framework'
     import {
         maxLength
@@ -156,7 +169,9 @@
         props: {
             set: Object,
             mobile: Boolean,
-            loading: Boolean
+            loading: Boolean,
+            invalid: Boolean,
+            invalidCount: Number
         },
         components: {
             CscPbxSoundGroup,
@@ -170,7 +185,8 @@
             QInput,
             QInnerLoading,
             QSpinnerMat,
-            QToggle
+            QToggle,
+            QTooltip
         },
         data () {
             return {
@@ -338,6 +354,14 @@
                 else {
                     return this.set.description;
                 }
+            },
+            tooltipLabel() {
+                if (this.invalidCount === 1) {
+                    return this.$t('pbxConfig.invalidFileTooltip', { amount: this.invalidCount });
+                }
+                else if (this.invalidCount > 1) {
+                    return this.$t('pbxConfig.invalidFilesTooltip', { amount: this.invalidCount });
+                }
             }
         },
         methods: {
@@ -383,6 +407,15 @@
                 else {
                     this.$emit('save-contract-default', this.setModel);
                 }
+            },
+            invalidGroup(group) {
+                let count = 0;
+                group.handles.forEach((handle) => {
+                    if (handle.filename.length === 0) {
+                        count++;
+                    }
+                });
+                return count > 0;
             }
         },
         watch: {
diff --git a/src/components/pages/PbxConfiguration/CscPbxSoundSets.vue b/src/components/pages/PbxConfiguration/CscPbxSoundSets.vue
index 7d6fc328..736f43d2 100644
--- a/src/components/pages/PbxConfiguration/CscPbxSoundSets.vue
+++ b/src/components/pages/PbxConfiguration/CscPbxSoundSets.vue
@@ -48,6 +48,8 @@
                 :key="set.id"
                 :set="set"
                 :mobile="isMobile"
+                :invalid="isSoundSetInvalid(set.id)"
+                :invalid-count="soundSetInvalidCount(set.id)"
                 @remove="removeSoundSetDialog"
                 @save-name="saveSoundSetName"
                 @save-description="saveSoundSetDescription"
@@ -119,7 +121,8 @@
                 'isListLoadingVisible',
                 'isAdding',
                 'addState',
-                'lastAddedSoundSet'
+                'lastAddedSoundSet',
+                'soundSetInvalidCount'
             ]),
             isMobile() {
                 return !!Platform.is.mobile;
@@ -130,7 +133,7 @@
                         set: this.currentRemovingSoundSet.name
                     });
                 }
-            }
+            },
         },
         methods: {
             removeSoundSetDialog(soundSet) {
@@ -166,6 +169,9 @@
             },
             addSoundSet(soundSet) {
                 this.$store.dispatch('pbxConfig/createSoundSet', soundSet);
+            },
+            isSoundSetInvalid(setId) {
+                return this.soundSetInvalidCount(setId) > 0;
             }
         },
         watch: {
diff --git a/src/locales/en.json b/src/locales/en.json
index 315a1141..1c611583 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -450,7 +450,9 @@
         "loadFiles": "Load Files",
         "createSoundSet": "Create sound set",
         "addSoundSet": "Add Sound Set",
-        "language": "Language"
+        "language": "Language",
+        "invalidFileTooltip": "This sound set is incomplete ({amount} file is missing)",
+        "invalidFilesTooltip": "This sound set is incomplete ({amount} files are missing)"
     },
     "callBlocking": {
         "privacyEnabledToast": "Your number is hidden to the callee",
diff --git a/src/store/pbx-config/getters.js b/src/store/pbx-config/getters.js
index 7b7918e1..841bbcfc 100644
--- a/src/store/pbx-config/getters.js
+++ b/src/store/pbx-config/getters.js
@@ -369,5 +369,21 @@ export default {
             let regex = /[-_]/g;
             return _.capitalize(name.replace(regex, ' '));
         }
+    },
+    soundSetInvalidCount(state) {
+        return (id) => {
+            let count = 0;
+            let soundSet = _.get(state, 'soundSets', {})[id];
+            if (soundSet.hasOwnProperty('groups')) {
+                soundSet.groups.forEach((group) => {
+                    group.handles.forEach((handle) => {
+                        if (handle.filename.length === 0) {
+                            count++;
+                        }
+                    })
+                });
+            }
+            return count;
+        }
     }
 }
diff --git a/src/themes/app.common.styl b/src/themes/app.common.styl
index ccebdf8b..512e0b89 100644
--- a/src/themes/app.common.styl
+++ b/src/themes/app.common.styl
@@ -227,3 +227,9 @@ input.q-input-target
         background alpha(white, 0.04)
     .q-item-link:hover
         background alpha(white, 0.10)
+
+.csc-collapsible-label-warning
+    .q-item-link
+        border-left .2rem solid $negative
+    .csc-item-invalid
+        border-bottom .2rem solid $negative