From 8cd76e711c9328254d498b4f9afa221311f5a487 Mon Sep 17 00:00:00 2001 From: Fabio Di Stasio Date: Thu, 8 Jul 2021 17:43:33 +0200 Subject: [PATCH] feat(UI): new connection add panel --- src/renderer/App.vue | 23 +- src/renderer/components/SettingBarContext.vue | 8 +- src/renderer/components/TheSettingBar.vue | 4 +- src/renderer/components/TheTitleBar.vue | 1 + .../WorkspaceAddConnectionPanel.vue | 517 ++++++++++++++++++ .../WorkspaceEditConnectionPanel.vue | 6 +- .../{ => old}/ModalNewConnection.vue | 0 .../components/{ => old}/TheAppWelcome.vue | 0 .../store/modules/connections.store.js | 1 + .../store/modules/workspaces.store.js | 7 +- 10 files changed, 545 insertions(+), 22 deletions(-) create mode 100644 src/renderer/components/WorkspaceAddConnectionPanel.vue rename src/renderer/components/{ => old}/ModalNewConnection.vue (100%) rename src/renderer/components/{ => old}/TheAppWelcome.vue (100%) diff --git a/src/renderer/App.vue b/src/renderer/App.vue index ee5bb60f..2c57f3da 100644 --- a/src/renderer/App.vue +++ b/src/renderer/App.vue @@ -4,22 +4,21 @@
- -
+
+
+ + + + + +
- - - - - - -
@@ -36,9 +35,8 @@ export default { TheSettingBar: () => import(/* webpackChunkName: "TheSettingBar" */'@/components/TheSettingBar'), TheFooter: () => import(/* webpackChunkName: "TheFooter" */'@/components/TheFooter'), TheNotificationsBoard: () => import(/* webpackChunkName: "TheNotificationsBoard" */'@/components/TheNotificationsBoard'), - TheAppWelcome: () => import(/* webpackChunkName: "TheAppWelcome" */'@/components/TheAppWelcome'), Workspace: () => import(/* webpackChunkName: "Workspace" */'@/components/Workspace'), - ModalNewConnection: () => import(/* webpackChunkName: "ModalNewConnection" */'@/components/ModalNewConnection'), + WorkspaceAddConnectionPanel: () => import(/* webpackChunkName: "WorkspaceAddConnectionPanel" */'@/components/WorkspaceAddConnectionPanel'), ModalSettings: () => import(/* webpackChunkName: "ModalSettings" */'@/components/ModalSettings'), TheScratchpad: () => import(/* webpackChunkName: "TheScratchpad" */'@/components/TheScratchpad'), ModalDiscardChanges: () => import(/* webpackChunkName: "ModalDiscardChanges" */'@/components/ModalDiscardChanges'), @@ -49,9 +47,8 @@ export default { }, computed: { ...mapGetters({ + selectedWorkspace: 'workspaces/getSelected', isLoading: 'application/isLoading', - isNewConnModal: 'application/isNewModal', - isEditModal: 'application/isEditModal', isSettingModal: 'application/isSettingModal', isScratchpad: 'application/isScratchpad', connections: 'connections/getConnections', diff --git a/src/renderer/components/SettingBarContext.vue b/src/renderer/components/SettingBarContext.vue index c709beaa..a729585f 100644 --- a/src/renderer/components/SettingBarContext.vue +++ b/src/renderer/components/SettingBarContext.vue @@ -49,7 +49,8 @@ export default { }, computed: { ...mapGetters({ - getConnectionName: 'connections/getConnectionName' + getConnectionName: 'connections/getConnectionName', + selectedWorkspace: 'workspaces/getSelected' }), connectionName () { return this.getConnectionName(this.contextConnection.uid); @@ -57,9 +58,12 @@ export default { }, methods: { ...mapActions({ - deleteConnection: 'connections/deleteConnection' + deleteConnection: 'connections/deleteConnection', + selectWorkspace: 'workspaces/selectWorkspace' }), confirmDeleteConnection () { + if (this.selectedWorkspace === this.contextConnection.uid) + this.selectWorkspace(); this.deleteConnection(this.contextConnection); this.closeContext(); }, diff --git a/src/renderer/components/TheSettingBar.vue b/src/renderer/components/TheSettingBar.vue index d10b39d6..1a765f0c 100644 --- a/src/renderer/components/TheSettingBar.vue +++ b/src/renderer/components/TheSettingBar.vue @@ -25,7 +25,8 @@
  • @@ -92,7 +93,6 @@ export default { methods: { ...mapActions({ updateConnections: 'connections/updateConnections', - showNewConnModal: 'application/showNewConnModal', showSettingModal: 'application/showSettingModal', showScratchpad: 'application/showScratchpad', selectWorkspace: 'workspaces/selectWorkspace' diff --git a/src/renderer/components/TheTitleBar.vue b/src/renderer/components/TheTitleBar.vue index f919a94b..73a29dfd 100644 --- a/src/renderer/components/TheTitleBar.vue +++ b/src/renderer/components/TheTitleBar.vue @@ -58,6 +58,7 @@ export default { }), windowTitle () { if (!this.selectedWorkspace) return ''; + if (this.selectedWorkspace === 'NEW') return this.$t('message.createNewConnection'); const connectionName = this.getConnectionName(this.selectedWorkspace); const workspace = this.getWorkspace(this.selectedWorkspace); diff --git a/src/renderer/components/WorkspaceAddConnectionPanel.vue b/src/renderer/components/WorkspaceAddConnectionPanel.vue new file mode 100644 index 00000000..08dcb2c9 --- /dev/null +++ b/src/renderer/components/WorkspaceAddConnectionPanel.vue @@ -0,0 +1,517 @@ + + + + + diff --git a/src/renderer/components/WorkspaceEditConnectionPanel.vue b/src/renderer/components/WorkspaceEditConnectionPanel.vue index 99e8bccd..632ce8fb 100644 --- a/src/renderer/components/WorkspaceEditConnectionPanel.vue +++ b/src/renderer/components/WorkspaceEditConnectionPanel.vue @@ -340,7 +340,7 @@ import customizations from 'common/customizations'; import Connection from '@/ipc-api/Connection'; import ModalAskCredentials from '@/components/ModalAskCredentials'; import BaseUploadInput from '@/components/BaseUploadInput'; -// TODO: errori attivando ssh/ssl + export default { name: 'WorkspaceEditConnectionPanel', components: { @@ -388,10 +388,10 @@ export default { await this.saveConnection(); this.isConnecting = true; - if (this.connection.ask) + if (this.localConnection.ask) this.isAsking = true; else { - await this.connectWorkspace(this.connection); + await this.connectWorkspace(this.localConnection); this.isConnecting = false; } }, diff --git a/src/renderer/components/ModalNewConnection.vue b/src/renderer/components/old/ModalNewConnection.vue similarity index 100% rename from src/renderer/components/ModalNewConnection.vue rename to src/renderer/components/old/ModalNewConnection.vue diff --git a/src/renderer/components/TheAppWelcome.vue b/src/renderer/components/old/TheAppWelcome.vue similarity index 100% rename from src/renderer/components/TheAppWelcome.vue rename to src/renderer/components/old/TheAppWelcome.vue diff --git a/src/renderer/store/modules/connections.store.js b/src/renderer/store/modules/connections.store.js index 7fe14ce7..a7c331d3 100644 --- a/src/renderer/store/modules/connections.store.js +++ b/src/renderer/store/modules/connections.store.js @@ -23,6 +23,7 @@ export default { getConnections: state => state.connections, getConnectionName: state => uid => { const connection = state.connections.filter(connection => connection.uid === uid)[0]; + if (!connection) return ''; return connection.name ? connection.name : connection.ask diff --git a/src/renderer/store/modules/workspaces.store.js b/src/renderer/store/modules/workspaces.store.js index 87170119..b4affcd6 100644 --- a/src/renderer/store/modules/workspaces.store.js +++ b/src/renderer/store/modules/workspaces.store.js @@ -20,7 +20,7 @@ export default { getSelected: state => { if (state.selected_workspace) return state.selected_workspace; if (state.workspaces.length) return state.workspaces[0].uid; - return null; + return 'NEW'; }, getWorkspace: state => uid => { return state.workspaces.find(workspace => workspace.uid === uid); @@ -52,7 +52,10 @@ export default { }, mutations: { SELECT_WORKSPACE (state, uid) { - state.selected_workspace = uid; + if (!uid) + state.selected_workspace = state.workspaces.length ? state.workspaces[0].uid : 'NEW'; + else + state.selected_workspace = uid; }, SET_CONNECTED (state, payload) { const { uid, client, dataTypes, indexTypes, customizations, structure, version } = payload;