Merge pull request #18 from Arattian/dev-feature

Database delete modal added. Table boolean values display fixed.

package.json

@@ -38,7 +38,7 @@
     "@vue/cli-service": "3.3.1",
     "@vue/test-utils": "^1.0.0-beta.28",
     "babel-core": "^7.0.0-bridge.0",
-    "electron": "^4.0.1",
+    "electron": "^4.0.2",
     "element-theme-dark": "^1.0.2",
     "pug": "^2.0.3",
     "pug-plain-loader": "^1.0.0",

src/App.vue

@@ -171,12 +171,18 @@
     background #2c323a !important
     color #fff !important
 
+  .jsoneditor-tree input[type='checkbox']
+    display none !important
+
   .jsoneditor-search div.jsoneditor-frame
     background #2c323a !important
     color #fff !important
     border-radius 2px !important
     border 1px solid #121820 !important
 
+  .el-table__fixed::before, .el-table__fixed-right::before
+    background-color #222932 !important
+
   .jsoneditor-next
     display none !important
 

src/components/ConnectDatabase.vue

@@ -12,7 +12,7 @@
               el-option(v-for="(region, index) in regionList" :key="index" :label="region" :value="region")
           el-form-item(label="Access Key Id" required)
             el-input(v-model="configs.accessKeyId" placeholder="AWS access key id")
-          el-form-item(label="Secret Access Key" required)
+          el-form-item(label="Secret Access Key" @keyup.enter.native="submitRemoteForm" required)
             el-input(v-model="configs.secretAccessKey" placeholder="AWS secret access key")
         ActionButtons(
           :cancelHandler="setToDefault"
@@ -27,7 +27,7 @@
               template(slot="append")
                 el-color-picker(v-model="submitForm.color" size="mini")
           el-form-item(label="Localhost Port" required)
-            el-input(placeholder="port" v-model="submitForm.port")
+            el-input(placeholder="port" @keyup.enter.native="submitLocalForm" v-model="submitForm.port")
               template(slot="prepend") http://localhost:
         ActionButtons(
           :cancelHandler="setToDefault"

src/components/SidebarDatabases.vue

@@ -9,17 +9,29 @@
       .item-content(@click='elementHandler(db.name)')
         v-icon(name="database" class="db-icon")
         span {{db.name}}
-      .item-delete(@click="removeHandler(db)")
+      .item-delete(@click="toggleDeleteModal(db)")
         i(class="el-icon-delete delete")
 </template>
 
 <script lang="ts">
   import { Vue, Component, Prop } from 'vue-property-decorator';
   @Component
   export default class SidebarDatabases extends Vue {
+    public $confirm: any = this.$confirm;
     @Prop(Function) private removeHandler: any;
     @Prop(Function) private elementHandler: any;
     @Prop(Array) private databaseList!: any[];
+    private toggleDeleteModal(db: any) {
+      this.$confirm('Are you sure, you want to delete database from list?', 'Warning', {
+        confirmButtonText: 'Delete',
+        cancelButtonText: 'Cancel',
+        type: 'warning',
+        confirmButtonClass: 'el-button el-button--danger is-plain',
+        cancelButtonClass: 'el-button el-button--primary is-plain',
+      }).then(() => {
+        this.removeHandler(db);
+      }).catch(() => true);
+    }
   }
 </script>
 

src/store/modules/records/actions.ts

@@ -124,7 +124,6 @@ async function removeSelected({
       return;
     }
     // If there was unprocessed items, retry deleting.
-    // console.log(response.UnprocessedItems);
     if (state.retry < 5 && response.UnprocessedItems.currentTable) {
       commit('setGroupDeleteItems', response.UnprocessedItems.currentTable);
       dispatch('removeSelected');

src/store/modules/records/mutations.ts

@@ -56,6 +56,10 @@ async function selectRows(state: RecordModuleState, val: any) {
     }
     newSelection.push(requestItem);
   }
+  /*
+    Splitting selected rows, into arrays of maximum 25 rows, for sending them
+    with batchWrite function.
+  */
   const chunk = 25;
   for (let i = 0; i < newSelection.length; i += chunk) {
     state.groupDelete.push(newSelection.slice(i, i + chunk));
@@ -89,6 +93,11 @@ function setHeader(state: RecordModuleState) {
       }
       if (typeof row[key] === 'object') {
         row[key] = JSON.stringify(row[key]);
+      } else if (
+        typeof row[key] === 'boolean' ||
+        typeof row[key] === 'undefined'
+      ) {
+        row[key] += '';
       }
     }
   }