perf: improved resize of text editor resizing console height

src/renderer/App.vue

@@ -151,10 +151,10 @@ onMounted(() => {
     .connection-panel-wrapper {
       height: calc(100vh - #{$excluding-size});
       width: 100%;
-      padding-top: 2rem;
+      padding-top: 10vh;
       display: flex;
       justify-content: center;
-      align-items: center;
+      align-items: flex-start;
       overflow: auto;
     }
   }

src/renderer/components/TheFooter.vue

@@ -12,7 +12,7 @@
       <div class="footer-right-elements">
          <ul class="footer-elements">
             <li
-               v-if="workspace !== 'NEW'"
+               v-if="workspace.connectionStatus === 'connected' "
                class="footer-element footer-link"
                @click="toggleConsole"
             >
@@ -63,14 +63,15 @@ interface DatabaseInfos {// TODO: temp
 const applicationStore = useApplicationStore();
 const workspacesStore = useWorkspacesStore();
 
-const { getSelected: workspace } = storeToRefs(workspacesStore);
+const { getSelected: workspaceUid } = storeToRefs(workspacesStore);
 const { toggleConsole } = useConsoleStore();
 
 const { showSettingModal } = applicationStore;
 const { getWorkspace } = workspacesStore;
 
+const workspace = computed(() => getWorkspace(workspaceUid.value));
 const version: ComputedRef<DatabaseInfos> = computed(() => {
-   return getWorkspace(workspace.value) ? getWorkspace(workspace.value).version : null;
+   return getWorkspace(workspaceUid.value) ? workspace.value.version : null;
 });
 
 const versionString = computed(() => {

src/renderer/components/Workspace.vue

@@ -279,6 +279,12 @@
                            <span>{{ $t('message.processesList') }}</span>
                         </a>
                      </li>
+                     <li class="menu-item">
+                        <a class="c-hand p-vcentered" @click="toggleConsole">
+                           <i class="mdi mdi-console-line mr-1 tool-icon" />
+                           <span>{{ $t('word.console') }}</span>
+                        </a>
+                     </li>
                      <li
                         v-if="workspace.customizations.variables"
                         class="menu-item"
@@ -455,7 +461,6 @@
       </div>
       <div v-else class="connection-panel-wrapper p-relative">
          <WorkspaceEditConnectionPanel :connection="connection" />
-         <WorkspaceQueryConsole v-if="isConsoleOpen" :uid="workspace.uid" />
       </div>
       <ModalProcessesList
          v-if="isProcessesModal"
@@ -522,7 +527,10 @@ const {
    selectPrevTab
 } = workspacesStore;
 
-const { isConsoleOpen } = storeToRefs(useConsoleStore());
+const consoleStore = useConsoleStore();
+
+const { isConsoleOpen } = storeToRefs(consoleStore);
+const { toggleConsole } = consoleStore;
 
 const props = defineProps({
    connection: Object as Prop<ConnectionParams>

src/renderer/components/WorkspaceEditConnectionPanel.vue

@@ -551,7 +551,8 @@ localConnection.value = JSON.parse(JSON.stringify(props.connection));
 .connection-panel {
   margin-left: auto;
   margin-right: auto;
-  margin-bottom: 1rem;
+  margin-bottom: .5rem;
+  margin-top: 1.5rem;
 
   .panel {
     min-width: 450px;

src/renderer/components/WorkspaceQueryConsole.vue

@@ -14,13 +14,14 @@
       >
          <div class="query-console-header">
             <div>{{ t('word.console') }}</div>
-            <i class="mdi mdi-close c-hand" @click="resizeConsole(0)" />
+            <button class="btn btn-clear mr-1" @click="resizeConsole(0)" />
          </div>
          <div ref="queryConsoleBody" class="query-console-body">
             <div
                v-for="(wLog, i) in workspaceLogs"
                :key="i"
                class="query-console-log"
+               tabindex="0"
             >
                <span class="type-datetime">{{ moment(wLog.date).format('YYYY-MM-DD HH:mm:ss') }}</span>: <span class="type-string">{{ wLog.sql }}</span>
             </div>
@@ -136,7 +137,8 @@ onMounted(() => {
             padding: 1px 3px;
             user-select: text;
             border-radius: $border-radius;
-            &:hover {
+            &:hover,
+            &:focus {
                background: $bg-color-gray;
             }
          }

src/renderer/components/WorkspaceTabNewFunction.vue

@@ -179,6 +179,8 @@
 import { Component, computed, onBeforeUnmount, onMounted, onUnmounted, Ref, ref, watch } from 'vue';
 import { Ace } from 'ace-builds';
 import Functions from '@/ipc-api/Functions';
+import { storeToRefs } from 'pinia';
+import { useConsoleStore } from '@/stores/console';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
 import BaseLoader from '@/components/BaseLoader.vue';
@@ -200,6 +202,7 @@ const props = defineProps({
 
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { consoleHeight } = storeToRefs(useConsoleStore());
 
 const {
    getWorkspace,
@@ -274,8 +277,12 @@ const clearChanges = () => {
 
 const resizeQueryEditor = () => {
    if (queryEditor.value) {
+      let sizeToSubtract = 0;
       const footer = document.getElementById('footer');
-      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - footer.offsetHeight;
+      if (footer) sizeToSubtract += footer.offsetHeight;
+      sizeToSubtract += consoleHeight.value;
+
+      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - sizeToSubtract;
       editorHeight.value = size;
       queryEditor.value.editor.resize();
    }
@@ -311,6 +318,10 @@ watch(isChanged, (val) => {
    setUnsavedChanges({ uid: props.connection.uid, tUid: props.tabUid, isChanged: val });
 });
 
+watch(consoleHeight, () => {
+   resizeQueryEditor();
+});
+
 originalFunction.value = {
    sql: customizations.value.functionSql,
    language: customizations.value.languages ? customizations.value.languages[0] : null,

src/renderer/components/WorkspaceTabNewRoutine.vue

@@ -151,6 +151,8 @@
 import { Component, computed, onBeforeUnmount, onMounted, onUnmounted, Ref, ref, watch } from 'vue';
 import { Ace } from 'ace-builds';
 import Routines from '@/ipc-api/Routines';
+import { storeToRefs } from 'pinia';
+import { useConsoleStore } from '@/stores/console';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
 import QueryEditor from '@/components/QueryEditor.vue';
@@ -169,6 +171,7 @@ const props = defineProps({
 
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { consoleHeight } = storeToRefs(useConsoleStore());
 
 const {
    getWorkspace,
@@ -243,8 +246,12 @@ const clearChanges = () => {
 
 const resizeQueryEditor = () => {
    if (queryEditor.value) {
+      let sizeToSubtract = 0;
       const footer = document.getElementById('footer');
-      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - footer.offsetHeight;
+      if (footer) sizeToSubtract += footer.offsetHeight;
+      sizeToSubtract += consoleHeight.value;
+
+      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - sizeToSubtract;
       editorHeight.value = size;
       queryEditor.value.editor.resize();
    }
@@ -280,6 +287,10 @@ watch(isChanged, (val) => {
    setUnsavedChanges({ uid: props.connection.uid, tUid: props.tabUid, isChanged: val });
 });
 
+watch(consoleHeight, () => {
+   resizeQueryEditor();
+});
+
 originalRoutine.value = {
    sql: customizations.value.functionSql,
    language: customizations.value.languages ? customizations.value.languages[0] : null,

src/renderer/components/WorkspaceTabNewScheduler.vue

@@ -129,6 +129,8 @@ import { Component, computed, onBeforeUnmount, onMounted, onUnmounted, Prop, Ref
 import { Ace } from 'ace-builds';
 import { ConnectionParams, EventInfos } from 'common/interfaces/antares';
 import { useI18n } from 'vue-i18n';
+import { storeToRefs } from 'pinia';
+import { useConsoleStore } from '@/stores/console';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
 import BaseLoader from '@/components/BaseLoader.vue';
@@ -149,6 +151,7 @@ const props = defineProps({
 
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { consoleHeight } = storeToRefs(useConsoleStore());
 
 const {
    getWorkspace,
@@ -233,8 +236,12 @@ const clearChanges = () => {
 
 const resizeQueryEditor = () => {
    if (queryEditor.value) {
+      let sizeToSubtract = 0;
       const footer = document.getElementById('footer');
-      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - footer.offsetHeight;
+      if (footer) sizeToSubtract += footer.offsetHeight;
+      sizeToSubtract += consoleHeight.value;
+
+      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - sizeToSubtract;
       editorHeight.value = size;
       queryEditor.value.editor.resize();
    }
@@ -270,6 +277,10 @@ watch(isChanged, (val) => {
    setUnsavedChanges({ uid: props.connection.uid, tUid: props.tabUid, isChanged: val });
 });
 
+watch(consoleHeight, () => {
+   resizeQueryEditor();
+});
+
 originalScheduler.value = {
    definer: '',
    sql: 'BEGIN\r\n\r\nEND',

src/renderer/components/WorkspaceTabNewTrigger.vue

@@ -30,7 +30,7 @@
             </div>
          </div>
       </div>
-      <div class="container">
+      <div class="px-2">
          <div class="columns">
             <div class="column col-auto">
                <div class="form-group">
@@ -118,8 +118,10 @@
 import { Component, computed, onBeforeUnmount, onMounted, onUnmounted, Ref, ref, watch } from 'vue';
 import { Ace } from 'ace-builds';
 import { useI18n } from 'vue-i18n';
+import { storeToRefs } from 'pinia';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
+import { useConsoleStore } from '@/stores/console';
 import QueryEditor from '@/components/QueryEditor.vue';
 import BaseLoader from '@/components/BaseLoader.vue';
 import Triggers from '@/ipc-api/Triggers';
@@ -137,6 +139,7 @@ const props = defineProps({
 
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { consoleHeight } = storeToRefs(useConsoleStore());
 
 const {
    getWorkspace,
@@ -254,8 +257,12 @@ const clearChanges = () => {
 
 const resizeQueryEditor = () => {
    if (queryEditor.value) {
+      let sizeToSubtract = 0;
       const footer = document.getElementById('footer');
-      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - footer.offsetHeight;
+      if (footer) sizeToSubtract += footer.offsetHeight;
+      sizeToSubtract += consoleHeight.value;
+
+      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - sizeToSubtract;
       editorHeight.value = size;
       queryEditor.value.editor.resize();
    }
@@ -264,7 +271,7 @@ const resizeQueryEditor = () => {
 const onKey = (e: KeyboardEvent) => {
    if (props.isSelected) {
       e.stopPropagation();
-      if (e.ctrlKey && e.keyCode === 83) { // CTRL + S
+      if (e.ctrlKey && e.key === 's') { // CTRL + S
          if (isChanged.value)
             saveChanges();
       }
@@ -288,6 +295,10 @@ originalTrigger.value = {
    name: ''
 };
 
+watch(consoleHeight, () => {
+   resizeQueryEditor();
+});
+
 localTrigger.value = JSON.parse(JSON.stringify(originalTrigger.value));
 
 setTimeout(() => {

src/renderer/components/WorkspaceTabNewTriggerFunction.vue

@@ -99,6 +99,8 @@ import { Ace } from 'ace-builds';
 import { useI18n } from 'vue-i18n';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
+import { storeToRefs } from 'pinia';
+import { useConsoleStore } from '@/stores/console';
 import BaseLoader from '@/components/BaseLoader.vue';
 import QueryEditor from '@/components/QueryEditor.vue';
 import Functions from '@/ipc-api/Functions';
@@ -116,6 +118,7 @@ const props = defineProps({
 
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { consoleHeight } = storeToRefs(useConsoleStore());
 
 const {
    getWorkspace,
@@ -189,8 +192,12 @@ const clearChanges = () => {
 
 const resizeQueryEditor = () => {
    if (queryEditor.value) {
+      let sizeToSubtract = 0;
       const footer = document.getElementById('footer');
-      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - footer.offsetHeight;
+      if (footer) sizeToSubtract += footer.offsetHeight;
+      sizeToSubtract += consoleHeight.value;
+
+      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - sizeToSubtract;
       editorHeight.value = size;
       queryEditor.value.editor.resize();
    }
@@ -212,6 +219,18 @@ originalFunction.value = {
    name: ''
 };
 
+watch(() => props.isSelected, (val) => {
+   if (val) changeBreadcrumbs({ schema: props.schema });
+});
+
+watch(isChanged, (val) => {
+   setUnsavedChanges({ uid: props.connection.uid, tUid: props.tabUid, isChanged: val });
+});
+
+watch(consoleHeight, () => {
+   resizeQueryEditor();
+});
+
 localFunction.value = JSON.parse(JSON.stringify(originalFunction.value));
 
 setTimeout(() => {
@@ -238,12 +257,4 @@ onUnmounted(() => {
 onBeforeUnmount(() => {
    window.removeEventListener('keydown', onKey);
 });
-
-watch(() => props.isSelected, (val) => {
-   if (val) changeBreadcrumbs({ schema: props.schema });
-});
-
-watch(isChanged, (val) => {
-   setUnsavedChanges({ uid: props.connection.uid, tUid: props.tabUid, isChanged: val });
-});
 </script>

src/renderer/components/WorkspaceTabNewView.vue

@@ -107,6 +107,8 @@
 import { Component, computed, onBeforeUnmount, onMounted, onUnmounted, Ref, ref, watch } from 'vue';
 import { Ace } from 'ace-builds';
 import { useI18n } from 'vue-i18n';
+import { storeToRefs } from 'pinia';
+import { useConsoleStore } from '@/stores/console';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
 import BaseLoader from '@/components/BaseLoader.vue';
@@ -126,6 +128,7 @@ const props = defineProps({
 
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { consoleHeight } = storeToRefs(useConsoleStore());
 
 const {
    getWorkspace,
@@ -202,8 +205,12 @@ const clearChanges = () => {
 
 const resizeQueryEditor = () => {
    if (queryEditor.value) {
+      let sizeToSubtract = 0;
       const footer = document.getElementById('footer');
-      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - footer.offsetHeight;
+      if (footer) sizeToSubtract += footer.offsetHeight;
+      sizeToSubtract += consoleHeight.value;
+
+      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - sizeToSubtract;
       editorHeight.value = size;
       queryEditor.value.editor.resize();
    }
@@ -233,6 +240,10 @@ watch(isChanged, (val) => {
    setUnsavedChanges({ uid: props.connection.uid, tUid: props.tabUid, isChanged: val });
 });
 
+watch(consoleHeight, () => {
+   resizeQueryEditor();
+});
+
 originalView.value = {
    algorithm: 'UNDEFINED',
    definer: '',

src/renderer/components/WorkspaceTabPropsFunction.vue

@@ -194,6 +194,8 @@
 <script setup lang="ts">
 import { Component, computed, onBeforeUnmount, onMounted, onUnmounted, Ref, ref, watch } from 'vue';
 import { Ace } from 'ace-builds';
+import { storeToRefs } from 'pinia';
+import { useConsoleStore } from '@/stores/console';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
 import { uidGen } from 'common/libs/uidGen';
@@ -218,6 +220,7 @@ const props = defineProps({
 
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { consoleHeight } = storeToRefs(useConsoleStore());
 
 const {
    getWorkspace,
@@ -344,8 +347,12 @@ const clearChanges = () => {
 
 const resizeQueryEditor = () => {
    if (queryEditor.value) {
+      let sizeToSubtract = 0;
       const footer = document.getElementById('footer');
-      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - footer.offsetHeight;
+      if (footer) sizeToSubtract += footer.offsetHeight;
+      sizeToSubtract += consoleHeight.value;
+
+      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - sizeToSubtract;
       editorHeight.value = size;
       queryEditor.value.editor.resize();
    }
@@ -443,6 +450,10 @@ watch(isChanged, (val) => {
    setUnsavedChanges({ uid: props.connection.uid, tUid: props.tabUid, isChanged: val });
 });
 
+watch(consoleHeight, () => {
+   resizeQueryEditor();
+});
+
 (async () => {
    await getFunctionData();
    queryEditor.value.editor.session.setValue(localFunction.value.sql);

src/renderer/components/WorkspaceTabPropsRoutine.vue

@@ -168,6 +168,8 @@ import { Component, computed, onUnmounted, onBeforeUnmount, onMounted, Ref, ref,
 import { AlterRoutineParams, FunctionParam, RoutineInfos } from 'common/interfaces/antares';
 import { Ace } from 'ace-builds';
 import { useI18n } from 'vue-i18n';
+import { storeToRefs } from 'pinia';
+import { useConsoleStore } from '@/stores/console';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
 import { uidGen } from 'common/libs/uidGen';
@@ -190,6 +192,7 @@ const props = defineProps({
 
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { consoleHeight } = storeToRefs(useConsoleStore());
 
 const {
    getWorkspace,
@@ -316,8 +319,12 @@ const clearChanges = () => {
 
 const resizeQueryEditor = () => {
    if (queryEditor.value) {
+      let sizeToSubtract = 0;
       const footer = document.getElementById('footer');
-      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - footer.offsetHeight;
+      if (footer) sizeToSubtract += footer.offsetHeight;
+      sizeToSubtract += consoleHeight.value;
+
+      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - sizeToSubtract;
       editorHeight.value = size;
       queryEditor.value.editor.resize();
    }
@@ -413,6 +420,10 @@ watch(isChanged, (val) => {
    setUnsavedChanges({ uid: props.connection.uid, tUid: props.tabUid, isChanged: val });
 });
 
+watch(consoleHeight, () => {
+   resizeQueryEditor();
+});
+
 (async () => {
    await getRoutineData();
    queryEditor.value.editor.session.setValue(localRoutine.value.sql);

src/renderer/components/WorkspaceTabPropsScheduler.vue

@@ -127,6 +127,8 @@ import { AlterEventParams, EventInfos } from 'common/interfaces/antares';
 import { Component, computed, onBeforeUnmount, onMounted, onUnmounted, Ref, ref, watch } from 'vue';
 import { Ace } from 'ace-builds';
 import { useI18n } from 'vue-i18n';
+import { storeToRefs } from 'pinia';
+import { useConsoleStore } from '@/stores/console';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
 import BaseLoader from '@/components/BaseLoader.vue';
@@ -147,6 +149,7 @@ const props = defineProps({
 
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { consoleHeight } = storeToRefs(useConsoleStore());
 
 const {
    getWorkspace,
@@ -269,8 +272,12 @@ const clearChanges = () => {
 
 const resizeQueryEditor = () => {
    if (queryEditor.value) {
+      let sizeToSubtract = 0;
       const footer = document.getElementById('footer');
-      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - footer.offsetHeight;
+      if (footer) sizeToSubtract += footer.offsetHeight;
+      sizeToSubtract += consoleHeight.value;
+
+      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - sizeToSubtract;
       editorHeight.value = size;
       queryEditor.value.editor.resize();
    }
@@ -331,6 +338,10 @@ watch(isChanged, (val) => {
    setUnsavedChanges({ uid: props.connection.uid, tUid: props.tabUid, isChanged: val });
 });
 
+watch(consoleHeight, () => {
+   resizeQueryEditor();
+});
+
 (async () => {
    await getSchedulerData();
    queryEditor.value.editor.session.setValue(localScheduler.value.sql);

src/renderer/components/WorkspaceTabPropsTableFields.vue

@@ -126,8 +126,10 @@
 
 <script setup lang="ts">
 import { Component, computed, onMounted, onUnmounted, onUpdated, Prop, ref, Ref, watch } from 'vue';
+import { storeToRefs } from 'pinia';
 import { useI18n } from 'vue-i18n';
 import { useWorkspacesStore } from '@/stores/workspaces';
+import { useConsoleStore } from '@/stores/console';
 import * as Draggable from 'vuedraggable';
 import TableRow from '@/components/WorkspaceTabPropsTableRow.vue';
 import TableContext from '@/components/WorkspaceTabPropsTableContext.vue';
@@ -150,9 +152,12 @@ const props = defineProps({
 const emit = defineEmits(['add-new-index', 'add-to-index', 'rename-field', 'duplicate-field', 'remove-field']);
 
 const workspacesStore = useWorkspacesStore();
+const consoleStore = useConsoleStore();
 
 const { getWorkspace } = workspacesStore;
 
+const { consoleHeight } = storeToRefs(consoleStore);
+
 const tableWrapper: Ref<HTMLDivElement> = ref(null);
 const propTable: Ref<HTMLDivElement> = ref(null);
 const resultTable: Ref<Component> = ref(null);
@@ -172,8 +177,13 @@ const resizeResults = () => {
       const el = tableWrapper.value;
 
       if (el) {
+         let sizeToSubtract = 0;
          const footer = document.getElementById('footer');
-         const size = window.innerHeight - el.getBoundingClientRect().top - footer.offsetHeight;
+         if (footer) sizeToSubtract += footer.offsetHeight;
+
+         sizeToSubtract += consoleHeight.value;
+
+         const size = window.innerHeight - el.getBoundingClientRect().top - sizeToSubtract;
          resultsSize.value = size;
       }
    }
@@ -216,6 +226,10 @@ watch(fieldsLength, () => {
    refreshScroller();
 });
 
+watch(consoleHeight, () => {
+   resizeResults();
+});
+
 onUpdated(() => {
    if (propTable.value)
       refreshScroller();

src/renderer/components/WorkspaceTabPropsTrigger.vue

@@ -30,7 +30,7 @@
             </div>
          </div>
       </div>
-      <div class="container">
+      <div class="px-2">
          <div class="columns">
             <div class="column col-auto">
                <div class="form-group">
@@ -118,6 +118,8 @@
 import { Component, computed, onBeforeUnmount, onMounted, onUnmounted, Ref, ref, watch } from 'vue';
 import { Ace } from 'ace-builds';
 import { useI18n } from 'vue-i18n';
+import { storeToRefs } from 'pinia';
+import { useConsoleStore } from '@/stores/console';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
 import QueryEditor from '@/components/QueryEditor.vue';
@@ -139,6 +141,7 @@ const props = defineProps({
 
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { consoleHeight } = storeToRefs(useConsoleStore());
 
 const {
    getWorkspace,
@@ -304,8 +307,12 @@ const clearChanges = () => {
 
 const resizeQueryEditor = () => {
    if (queryEditor.value) {
+      let sizeToSubtract = 0;
       const footer = document.getElementById('footer');
-      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - footer.offsetHeight;
+      if (footer) sizeToSubtract += footer.offsetHeight;
+      sizeToSubtract += consoleHeight.value;
+
+      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - sizeToSubtract;
       editorHeight.value = size;
       queryEditor.value.editor.resize();
    }
@@ -345,6 +352,10 @@ watch(isChanged, (val) => {
    setUnsavedChanges({ uid: props.connection.uid, tUid: props.tabUid, isChanged: val });
 });
 
+watch(consoleHeight, () => {
+   resizeQueryEditor();
+});
+
 (async () => {
    await getTriggerData();
    queryEditor.value.editor.session.setValue(localTrigger.value.sql);

src/renderer/components/WorkspaceTabPropsTriggerFunction.vue

@@ -84,8 +84,10 @@
 import { Component, computed, onBeforeUnmount, onMounted, onUnmounted, Ref, ref, watch } from 'vue';
 import { Ace } from 'ace-builds';
 import { useI18n } from 'vue-i18n';
+import { storeToRefs } from 'pinia';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
+import { useConsoleStore } from '@/stores/console';
 import BaseLoader from '@/components/BaseLoader.vue';
 import QueryEditor from '@/components/QueryEditor.vue';
 import Functions from '@/ipc-api/Functions';
@@ -104,6 +106,7 @@ const props = defineProps({
 
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
+const { consoleHeight } = storeToRefs(useConsoleStore());
 
 const {
    getWorkspace,
@@ -209,8 +212,12 @@ const clearChanges = () => {
 
 const resizeQueryEditor = () => {
    if (queryEditor.value) {
+      let sizeToSubtract = 0;
       const footer = document.getElementById('footer');
-      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - footer.offsetHeight;
+      if (footer) sizeToSubtract += footer.offsetHeight;
+      sizeToSubtract += consoleHeight.value;
+
+      const size = window.innerHeight - queryEditor.value.$el.getBoundingClientRect().top - sizeToSubtract;
       editorHeight.value = size;
       queryEditor.value.editor.resize();
    }
@@ -242,6 +249,10 @@ watch(() => props.function, async () => {
    }
 });
 
+watch(consoleHeight, () => {
+   resizeQueryEditor();
+});
+
 watch(() => props.isSelected, (val) => {
    if (val) changeBreadcrumbs({ schema: props.schema });
 });

src/renderer/components/WorkspaceTabQuery.vue

@@ -12,6 +12,7 @@
       <div class="workspace-query-runner column col-12">
          <QueryEditor
             v-show="isSelected"
+            id="query-editor"
             ref="queryEditor"
             v-model="query"
             :auto-focus="true"
@@ -187,18 +188,20 @@
 import { Component, computed, onBeforeUnmount, onMounted, Prop, ref, Ref, watch } from 'vue';
 import { Ace } from 'ace-builds';
 import { useI18n } from 'vue-i18n';
+import { storeToRefs } from 'pinia';
 import { format } from 'sql-formatter';
 import { ConnectionParams } from 'common/interfaces/antares';
 import { useHistoryStore } from '@/stores/history';
 import { useNotificationsStore } from '@/stores/notifications';
 import { useWorkspacesStore } from '@/stores/workspaces';
+import { useResultTables } from '@/composables/useResultTables';
+import { useConsoleStore } from '@/stores/console';
 import Schema from '@/ipc-api/Schema';
 import QueryEditor from '@/components/QueryEditor.vue';
 import BaseLoader from '@/components/BaseLoader.vue';
 import WorkspaceTabQueryTable from '@/components/WorkspaceTabQueryTable.vue';
 import WorkspaceTabQueryEmptyState from '@/components/WorkspaceTabQueryEmptyState.vue';
 import ModalHistory from '@/components/ModalHistory.vue';
-import { useResultTables } from '@/composables/useResultTables';
 import BaseSelect from '@/components/BaseSelect.vue';
 
 const { t } = useI18n();
@@ -223,6 +226,8 @@ const { saveHistory } = useHistoryStore();
 const { addNotification } = useNotificationsStore();
 const workspacesStore = useWorkspacesStore();
 
+const { consoleHeight } = storeToRefs(useConsoleStore());
+
 const {
    getWorkspace,
    changeBreadcrumbs,
@@ -365,7 +370,7 @@ const resize = (e: MouseEvent) => {
    const el = queryEditor.value.$el;
    const queryFooterHeight = queryAreaFooter.value.clientHeight;
    const bottom = e.pageY || resizer.value.getBoundingClientRect().bottom;
-   const maxHeight = window.innerHeight - 100 - queryFooterHeight;
+   const maxHeight = window.innerHeight - 100 - queryFooterHeight - consoleHeight.value;
    let localEditorHeight = bottom - el.getBoundingClientRect().top;
    if (localEditorHeight > maxHeight) localEditorHeight = maxHeight;
    if (localEditorHeight < 50) localEditorHeight = 50;
@@ -375,6 +380,7 @@ const resize = (e: MouseEvent) => {
 const resizeResults = () => queryTable.value.resizeResults();
 
 const onWindowResize = (e: MouseEvent) => {
+   if (!queryEditor.value) return;
    const el = queryEditor.value.$el;
    const queryFooterHeight = queryAreaFooter.value.clientHeight;
    const bottom = e.pageY || resizer.value.getBoundingClientRect().bottom;

src/renderer/stores/workspaces.ts

@@ -100,6 +100,15 @@ export const useWorkspacesStore = defineStore('workspaces', {
       getSelected: state => {
          if (!state.workspaces.length) return 'NEW';
          if (state.selectedWorkspace) return state.selectedWorkspace;
+         const connectionsStore = useConnectionsStore();
+         if (connectionsStore.lastConnections.length) {
+            return connectionsStore.lastConnections.sort((a, b) => {
+               if (a.time < b.time) return 1;
+               else if (a.time > b.time) return -1;
+               return 0;
+            })[0].uid;
+         }
+
          return state.workspaces[0].uid;
       },
       getWorkspace: state => (uid: string) => {