Additions

src/main/ipc-handlers/connection.js

@@ -30,7 +30,6 @@ export default () => {
    });
 
    ipcMain.handle('connect', async (event, conn) => {
-      let structure;
       const connection = knex({
          client: conn.client,
          connection: {
@@ -46,14 +45,13 @@ export default () => {
       });
 
       try {
-         structure = await InformationSchema.getStructure(connection);
+         const structure = await InformationSchema.getStructure(connection);
+         connections[conn.uid] = connection;
+         return { status: 'success', response: structure };
       }
       catch (err) {
          return { status: 'error', response: err.toString() };
       }
-
-      connections[conn.uid] = connection;
-      return { status: 'success', response: structure };
    });
 
    ipcMain.handle('disconnect', (event, uid) => {
@@ -63,12 +61,12 @@ export default () => {
 
    ipcMain.handle('refresh', async (event, uid) => {
       try {
-         structure = await InformationSchema.getStructure(connection);
+         const structure = await InformationSchema.getStructure(connections[uid]);
+         return { status: 'success', response: structure };
       }
       catch (err) {
+         console.log(err);
          return { status: 'error', response: err.toString() };
       }
-
-      return { status: 'success', response: structure };
    });
 };

src/renderer/components/DatabaseExploreBar.vue

@@ -2,16 +2,21 @@
    <div class="workspace-explorebar column">
       <div class="workspace-explorebar-header">
          <span class="workspace-explorebar-title">{{ connection.user }}@{{ connection.host }}:{{ connection.port }}</span>
-         <span v-if="isConnected" class="workspace-explorebar-tools">
-            <i class="material-icons md-18 c-hand mr-1" title="Refresh">cached</i>
+         <span v-if="workspace.connected" class="workspace-explorebar-tools">
             <i
                class="material-icons md-18 c-hand"
+               :class="{'rotate':isRefreshing}"
+               title="Refresh"
+               @click="refresh"
+            >refresh</i>
+            <i
+               class="material-icons md-18 c-hand mr-1 ml-2"
                title="Disconnect"
                @click="disconnectWorkspace(connection.uid)"
             >exit_to_app</i>
          </span>
       </div>
-      <DatabaseConnectPanel v-if="!isConnected" :connection="connection" />
+      <DatabaseConnectPanel v-if="!workspace.connected" :connection="connection" />
    </div>
 </template>
 
@@ -27,18 +32,29 @@ export default {
    props: {
       connection: Object
    },
+   data () {
+      return {
+         isRefreshing: false
+      };
+   },
    computed: {
       ...mapGetters({
-         connected: 'workspaces/getConnected'
+         getWorkspace: 'workspaces/getWorkspace'
       }),
-      isConnected () {
-         return this.connected.includes(this.connection.uid);
+      workspace () {
+         return this.getWorkspace(this.connection.uid);
       }
    },
    methods: {
       ...mapActions({
-         disconnectWorkspace: 'workspaces/removeConnected'
-      })
+         disconnectWorkspace: 'workspaces/removeConnected',
+         refreshStructure: 'workspaces/refreshStructure'
+      }),
+      async refresh () {
+         this.isRefreshing = true;
+         await this.refreshStructure(this.connection.uid);
+         this.isRefreshing = false;
+      }
    }
 };
 </script>
@@ -76,14 +92,23 @@ export default {
             white-space: nowrap;
             overflow: hidden;
             text-overflow: ellipsis;
+            display: flex;
+            align-items: center;
          }
 
-         .workspace-explorebar-tools > i{
-            opacity: .6;
-            transition: opacity .2s;;
+         .workspace-explorebar-tools {
+               display: flex;
+               align-items: center;
 
-            &:hover{
-               opacity: 1;
+               > i{
+                  opacity: .6;
+                  transition: opacity .2s;
+                  display: flex;
+                  align-items: center;
+
+               &:hover{
+                  opacity: 1;
+               }
             }
          }
       }

src/renderer/components/DatabaseWorkspace.vue

@@ -2,7 +2,7 @@
    <div v-show="selectedWorkspace === connection.uid" class="workspace column columns">
       <DatabaseExploreBar :connection="connection" />
       <div class="workspace-tabs column">
-         <pre>{{ JSON.stringify(connection, null, 3) }}</pre>
+         <pre>{{ JSON.stringify(workspace.structure, null, 3) }}</pre>
       </div>
    </div>
 </template>
@@ -23,8 +23,11 @@ export default {
    computed: {
       ...mapGetters({
          selectedWorkspace: 'workspaces/getSelected',
-         getConnected: 'workspaces/getConnected'
-      })
+         getWorkspace: 'workspaces/getWorkspace'
+      }),
+      workspace () {
+         return this.getWorkspace(this.connection.uid);
+      }
    },
    async created () {
       this.addWorkspace(this.connection.uid);
@@ -47,5 +50,10 @@ export default {
    .workspace{
       padding: 0;
       margin: 0;
+
+      .workspace-tabs{
+         overflow: auto;
+         height: calc(100vh - #{$footer-height});
+      }
    }
 </style>

src/renderer/components/TheNotificationsBoard.vue

@@ -41,7 +41,7 @@ export default {
    #notifications-board{
       position: absolute;
       z-index: 9;
-      right: .8rem;
+      right: 1rem;
       bottom: $footer-height+1rem;
    }
 </style>

src/renderer/scss/main.scss

@@ -50,6 +50,20 @@ body{
    }
 }
 
+// Animations
+@keyframes rotation {
+   from {
+     transform: rotate(0deg);
+   }
+   to {
+     transform: rotate(359deg);
+   }
+} 
+
+.rotate {
+   animation: rotation .8s infinite linear;
+}
+
 /*Override*/
 .modal{
    .modal-overlay,

src/renderer/store/modules/workspaces.store.js

@@ -6,7 +6,6 @@ export default {
    strict: true,
    state: {
       workspaces: [],
-      connected_workspaces: [], // TODO: move to state.workspaces
       selected_workspace: null
    },
    getters: {
@@ -15,20 +14,28 @@ export default {
          if (state.workspaces.length) return state.workspaces[0].uid;
          return null;
       },
-      getWorkspaces: state => state.workspaces,
-      getConnected: state => state.connected_workspaces
+      getWorkspace: state => uid => {
+         const workspace = state.workspaces.filter(workspace => workspace.uid === uid);
+         return workspace.length ? workspace[0] : {};
+      },
+      getConnected: state => {
+         return state.workspaces
+            .filter(workspace => workspace.connected)
+            .map(workspace => workspace.uid);
+      }
    },
    mutations: {
       SELECT_WORKSPACE (state, uid) {
          state.selected_workspace = uid;
       },
       ADD_CONNECTED (state, { uid, structure }) {
-         state.connected_workspaces.push(uid);
-         state.workspaces = state.workspaces.map(workspace => workspace.uid === uid ? { ...workspace, structure } : workspace);
+         state.workspaces = state.workspaces.map(workspace => workspace.uid === uid ? { ...workspace, structure, connected: true } : workspace);
       },
       REMOVE_CONNECTED (state, uid) {
-         state.connected_workspaces = state.connected_workspaces.filter(value => value !== uid);
-         state.workspaces = state.workspaces.map(workspace => workspace.uid === uid ? { ...workspace, structure: {} } : workspace);
+         state.workspaces = state.workspaces.map(workspace => workspace.uid === uid ? { ...workspace, structure: {}, connected: false } : workspace);
+      },
+      REFRESH_STRUCTURE (state, uid) {
+         state.workspaces = state.workspaces.map(workspace => workspace.uid === uid ? { ...workspace, structure } : workspace);
       },
       ADD_WORKSPACE (state, workspace) {
          state.workspaces.push(workspace);
@@ -50,6 +57,18 @@ export default {
             dispatch('notifications/addNotification', { status: 'error', message: err.stack }, { root: true });
          }
       },
+      async refreshStructure ({ dispatch, commit }, uid) {
+         try {
+            const { status, response } = await Connection.refresh(uid);
+            if (status === 'error')
+               dispatch('notifications/addNotification', { status, message: response }, { root: true });
+            else
+               commit('REFRESH_STRUCTURE', { uid, structure: response });
+         }
+         catch (err) {
+            dispatch('notifications/addNotification', { status: 'error', message: err.stack }, { root: true });
+         }
+      },
       async removeConnected ({ commit }, uid) {
          Connection.disconnect(uid);
          commit('REMOVE_CONNECTED', uid);