fix(editor): update height

src/renderer/components/editor/TheEditor.vue

@@ -35,6 +35,7 @@ import './module-resolver'
 import type { Language } from '@shared/types/renderer/editor'
 import { languages } from './languages'
 import { useAppStore } from '@/store/app'
+import { useSnippetStore } from '@/store/snippets'
 
 interface Props {
   lang: Language
@@ -56,6 +57,7 @@ const props = withDefaults(defineProps<Props>(), {
 const emit = defineEmits<Emits>()
 
 const appStore = useAppStore()
+const snippetStore = useSnippetStore()
 
 const editorRef = ref()
 const cursorPosition = reactive({
@@ -69,7 +71,29 @@ const localLang = computed({
   set: v => emit('update:lang', v)
 })
 
-const footerHeight = appStore.sizes.editor.footerHeight + 'px'
+const forceRefresh = ref()
+
+const editorHeight = computed(() => {
+  // eslint-disable-next-line no-unused-expressions
+  forceRefresh.value
+
+  let result =
+    appStore.sizes.editor.titleHeight +
+    appStore.sizes.titlebar +
+    appStore.sizes.editor.footerHeight
+
+  if (snippetStore.isFragmentsShow) {
+    result += appStore.sizes.editor.fragmentsHeight
+  }
+
+  if (snippetStore.isTagsShow) {
+    result += appStore.sizes.editor.tagsHeight
+  }
+
+  return window.innerHeight - result + 'px'
+})
+
+const footerHeight = computed(() => appStore.sizes.editor.footerHeight + 'px')
 
 const init = async () => {
   editor = ace.edit(editorRef.value, {
@@ -83,9 +107,11 @@ const init = async () => {
   setValue()
   setLang()
 
-  // Удаляем все шорткаты
+  // Удаляем некторые шорткаты
   // @ts-ignore
-  editor.keyBinding.$defaultHandler.commandKeyBinding = {}
+  editor.commands.removeCommand('find')
+  editor.commands.removeCommand('gotoline')
+  editor.commands.removeCommand('showSettingsMenu')
 
   // События
   editor.on('change', () => {
@@ -137,16 +163,20 @@ watch(
   () => props.modelValue,
   () => setValue()
 )
+
+window.addEventListener('resize', () => {
+  forceRefresh.value = Math.random()
+})
 </script>
 
 <style lang="scss" scoped>
 .editor {
   padding-top: 4px;
   .main {
-    height: calc(100% - v-bind(footerHeight));
+    height: v-bind(editorHeight);
   }
   .footer {
-    height: 30px;
+    height: v-bind(footerHeight);
     display: flex;
     align-items: center;
     justify-content: space-between;

src/renderer/components/snippets/SnippetsView.vue

@@ -27,13 +27,11 @@
 </template>
 
 <script setup lang="ts">
-import { useAppStore } from '@/store/app'
 import { useSnippetStore } from '@/store/snippets'
 import { useDebounceFn } from '@vueuse/core'
 import { computed } from 'vue'
 
 const snippetStore = useSnippetStore()
-const appStore = useAppStore()
 
 const snippet = computed({
   get: () => snippetStore.currentContent || '',
@@ -52,20 +50,6 @@ const lang = computed({
   }
 })
 
-const viewHeight = computed(() => {
-  let result = appStore.sizes.editor.titleHeight
-
-  if (snippetStore.isFragmentsShow) {
-    result += appStore.sizes.editor.fragmentsHeight
-  }
-
-  if (snippetStore.isTagsShow) {
-    result += appStore.sizes.editor.tagsHeight
-  }
-
-  return result + 'px'
-})
-
 const isShowPlaceholder = computed(() => {
   return (
     snippetStore.selectedMultiple.length || snippetStore.snippets.length === 0
@@ -77,11 +61,8 @@ const isShowPlaceholder = computed(() => {
 .snippets-view {
   overflow: hidden;
   padding-top: var(--title-bar-height);
-  display: grid;
-  grid-template-rows: v-bind(viewHeight) 1fr;
-  &.is-one-row {
-    grid-template-rows: 1fr;
-  }
+  display: flex;
+  flex-flow: column;
 }
 .placeholder {
   display: flex;

src/renderer/store/app.ts

@@ -2,17 +2,17 @@ import type { State } from '@shared/types/renderer/store/app'
 import { defineStore } from 'pinia'
 
 export const useAppStore = defineStore('app', {
-  state: () =>
-    ({
-      theme: 'light',
-      showTags: true,
-      sizes: {
-        editor: {
-          titleHeight: 30,
-          fragmentsHeight: 25,
-          tagsHeight: 40,
-          footerHeight: 30
-        }
+  state: (): State => ({
+    theme: 'light',
+    showTags: true,
+    sizes: {
+      titlebar: 15,
+      editor: {
+        titleHeight: 30,
+        fragmentsHeight: 25,
+        tagsHeight: 40,
+        footerHeight: 30
       }
-    } as State)
+    }
+  })
 })

src/shared/types/renderer/store/app.d.ts

@@ -1,4 +1,5 @@
 export interface AppSizes {
+  titlebar: number
   editor: {
     titleHeight: number
     fragmentsHeight: number