feat: context menu option to duplicate connections

src/renderer/components/SettingBarContext.vue

@@ -3,6 +3,9 @@
       :context-event="contextEvent"
       @close-context="$emit('close-context')"
    >
+      <div class="context-element" @click="duplicateConnection">
+         <span class="d-flex"><i class="mdi mdi-18px mdi-content-duplicate text-light pr-1" /> {{ $t('word.duplicate') }}</span>
+      </div>
       <div class="context-element" @click="showConfirmModal">
          <span class="d-flex"><i class="mdi mdi-18px mdi-delete text-light pr-1" /> {{ $t('word.delete') }}</span>
       </div>
@@ -28,6 +31,7 @@
 
 <script>
 import { mapActions, mapGetters } from 'vuex';
+import { uidGen } from 'common/libs/uidGen';
 import BaseContextMenu from '@/components/BaseContextMenu';
 import ConfirmModal from '@/components/BaseConfirmModal';
 
@@ -58,6 +62,7 @@ export default {
    },
    methods: {
       ...mapActions({
+         addConnection: 'connections/addConnection',
          deleteConnection: 'connections/deleteConnection',
          selectWorkspace: 'workspaces/selectWorkspace'
       }),
@@ -67,6 +72,17 @@ export default {
          this.deleteConnection(this.contextConnection);
          this.closeContext();
       },
+      duplicateConnection () {
+         let connectionCopy = Object.assign({}, this.contextConnection);
+         connectionCopy = {
+            ...connectionCopy,
+            uid: uidGen('C'),
+            name: connectionCopy.name ? `${connectionCopy.name}_copy` : ''
+         };
+
+         this.addConnection(connectionCopy);
+         this.closeContext();
+      },
       showConfirmModal () {
          this.isConfirmModal = true;
       },

src/renderer/components/WorkspaceAddConnectionPanel.vue

@@ -401,15 +401,11 @@ export default {
    },
    created () {
       this.setDefaults();
-      window.addEventListener('keydown', this.onKey);
 
       setTimeout(() => {
-         this.$refs.firstInput.focus();
+         if (this.$refs.firstInput) this.$refs.firstInput.focus();
       }, 20);
    },
-   beforeDestroy () {
-      window.removeEventListener('keydown', this.onKey);
-   },
    methods: {
       ...mapActions({
          addConnection: 'connections/addConnection',

src/renderer/components/WorkspaceEditConnectionPanel.vue

@@ -377,12 +377,13 @@ export default {
          return JSON.stringify(this.connection) !== JSON.stringify(this.localConnection);
       }
    },
+   watch: {
+      connection () {
+         this.localConnection = JSON.parse(JSON.stringify(this.connection));
+      }
+   },
    created () {
       this.localConnection = JSON.parse(JSON.stringify(this.connection));
-      window.addEventListener('keydown', this.onKey);
-   },
-   beforeDestroy () {
-      window.removeEventListener('keydown', this.onKey);
    },
    methods: {
       ...mapActions({

src/renderer/i18n/en-US.js

@@ -114,7 +114,8 @@ module.exports = {
       row: 'Row | Rows',
       cell: 'Cell | Cells',
       triggerFunction: 'Trigger function | Trigger functions',
-      all: 'All'
+      all: 'All',
+      duplicate: 'Duplicate'
    },
    message: {
       appWelcome: 'Welcome to Antares SQL Client!',