feat: add feedback form close option

Signed-off-by: Pranav C <pranavxc@gmail.com>

packages/nc-gui/components/feedbackForm.vue

@@ -1,21 +1,51 @@
 <template>
-  <iframe
+  <div v-if="!feedbackFormHidden" class="nc-feedback-form-wrapper">
-    src="https://docs.google.com/forms/d/e/1FAIpQLSeTlAfZjszgr53lArz3NvUEnJGOT9JtG9NAU5d0oQwunDS2Pw/viewform?embedded=true"
+    <v-icon class="nc-close-icon" large @click="feedbackFormHidden = true">
-    width="100%"
+      mdi-close-circle-outline
-    height="500"
+    </v-icon>
-    frameborder="0"
+
-    marginheight="0"
+    <iframe
-    marginwidth="0"
+      src="https://docs.google.com/forms/d/e/1FAIpQLSeTlAfZjszgr53lArz3NvUEnJGOT9JtG9NAU5d0oQwunDS2Pw/viewform?embedded=true"
-  >Loading…
+      width="100%"
-  </iframe>
+      height="500"
+      frameborder="0"
+      marginheight="0"
+      marginwidth="0"
+    >Loading…
+    </iframe>
+  </div>
+  <div v-else />
 </template>
 
 <script>
 export default {
-  name: 'FeedbackForm'
+  name: 'FeedbackForm',
+  computed: {
+    feedbackFormHidden: {
+      get() {
+        return this.$store.state.windows.feedbackFormHidden
+      },
+      set(val) {
+        this.$store.commit('windows/MutFeedbackFormHidden', val)
+      }
+    }
+  }
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+.nc-feedback-form-wrapper {
+  width: 100%;
+  position: relative;
+
+  iframe {
+    margin: 0 auto;
+  }
 
+  .nc-close-icon {
+    position: absolute;
+    top: 5px;
+    right: 10px;
+  }
+}
 </style>

packages/nc-gui/components/utils/language.vue

@@ -6,7 +6,7 @@
           mdi-translate
         </v-icon>
       </template>
-      <v-list dense>
+      <v-list dense class="nc-language-list">
         <v-list-item-group
           v-model="language"
         >
@@ -116,6 +116,14 @@ export default {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
-
+::v-deep {
+  .nc-language-list {
+    max-height: 90vh;
+    overflow: auto;
+     .v-list-item{
+      min-height: 30px !important;
+    }
+  }
+}
 </style>

packages/nc-gui/store/windows.js

@@ -38,7 +38,8 @@ export const state = () => ({
   screensaver: true,
   autoApplyFilter: true,
   apiLoading: false,
-  includeM2M: false
+  includeM2M: false,
+  feedbackFormHidden: false
 })
 
 export const mutations = {
@@ -51,6 +52,9 @@ export const mutations = {
   MutToggleLogWindow(state, show) {
     state.logWindow = !state.logWindow
   },
+  MutFeedbackFormHidden(state, show) {
+    state.feedbackFormHidden = show
+  },
   MutScreensaver(state, show) {
     state.screensaver = show
   },