@appscode/design-system 1.0.43-alpha.189 → 1.0.43-alpha.190

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appscode/design-system",
-  "version": "1.0.43-alpha.189",
+  "version": "1.0.43-alpha.190",
   "description": "A design system for Appscode websites and dashboards made using Bulma",
   "main": "main.scss",
   "scripts": {

package/vue-components/v2/editor/FilteredFileEditor.vue

@@ -13,6 +13,7 @@
                 v-for="(previewYaml, idx) in filteredYamls"
                 :key="previewYaml.name + idx"
                 :class="{ 'is-active': activeKey === previewYaml.uid }"
+                data-testid="filtered-file-editor-file-name"
               >
                 <a @click.prevent="setActivePreview(previewYaml.uid)">
                   <span>
@@ -32,7 +33,7 @@
             />
           </div>
         </div>
-        <div class="right-content">
+        <div class="right-content" data-testid="filtered-file-editor-content">
           <div class="right-content">
             <resource-loader
               v-if="isPreviewLoading"
@@ -67,69 +68,69 @@ export default {
       loading: Preloader,
       delay: 200,
       error: Banner,
-      timeout: 100000
+      timeout: 100000,
     }),
     ResourceLoader: () => import("./../loaders/ResourceLoader.vue"),
-    SidebarLoader: () => import("./../loaders/SidebarLoader.vue")
+    SidebarLoader: () => import("./../loaders/SidebarLoader.vue"),
   },
   props: {
     searchText: {
       type: String,
-      default: ""
+      default: "",
     },
     toggleHideValue: {
       type: Boolean,
-      default: true
+      default: true,
     },
     isPreviewLoading: {
       type: Boolean,
-      default: false
+      default: false,
     },
     isEditorReadOnly: {
       type: Boolean,
-      default: false
+      default: false,
     },
     previewYamls: {
       type: Array,
       default: () => {
         [];
-      }
+      },
     },
     showMinimap: {
       type: Boolean,
-      default: false
+      default: false,
     },
     editorHeight: {
       type: Number,
-      default: 60
+      default: 60,
     },
     loaderColor: {
       type: Object,
       default: () => {
         return {};
-      }
+      },
     },
     theme: {
       type: String,
-      default: "light"
-    }
+      default: "light",
+    },
   },
   data() {
     return {
       activeKey: "",
-      hideValue: ""
+      hideValue: "",
     };
   },
   computed: {
     activeFile() {
       const activeFile = this.filteredYamls.find(
-        element => element.uid === this.activeKey
+        (element) => element.uid === this.activeKey
       );
       return activeFile || { content: "", format: "yaml" };
     },
     originalValue() {
       const activeFile = this.filteredYamls.find(
-        element => element.uid === this.activeKey
+        (element) => element.uid === this.activeKey
       );
       return (activeFile && activeFile.initContent) || "";
     },
@@ -145,16 +146,16 @@ export default {
     filteredYamls() {
       if (this.searchText) {
         return this.previewYamls.filter(
-          element => JSON.stringify(element).search(this.searchText) > -1
+          (element) => JSON.stringify(element).search(this.searchText) > -1
         );
       } else return this.previewYamls;
     },
     isKeyAvailable() {
-      const val = this.previewYamls.find(element => {
+      const val = this.previewYamls.find((element) => {
         return element.uid === this.activeKey;
       });
       return val === undefined ? false : true;
-    }
+    },
   },
   methods: {
     initActivePreview() {
@@ -168,7 +169,7 @@ export default {
       this.activeKey = uid;
       this.hideValue = this.activeFile.isSecret;
       this.$emit("setActiveKey", this.activeKey);
-    }
+    },
   },
   watch: {
     previewYamls: {
@@ -178,11 +179,11 @@ export default {
         if (n.length) {
           this.initActivePreview();
         }
-      }
+      },
     },
     toggleHideValue(n) {
       this.hideValue = n;
-    }
-  }
+    },
+  },
 };
 </script>