settings modal minimization API

src/components/settings_modal/settings_modal.js

@@ -64,11 +64,6 @@ const SettingsModal = {
       }),
     }
   },
-  watch: {
-    $route(r) {
-      this.peekModal()
-    }
-  },
   components: {
     Modal,
     Popover,
@@ -98,8 +93,11 @@ const SettingsModal = {
     closeModal() {
       useInterfaceStore().closeSettingsModal()
     },
-    peekModal() {
-      useInterfaceStore().togglePeekSettingsModal()
+    toggleMinimizeModal(state) {
+      useInterfaceStore().toggleMinimizeSettingsModal()
+    },
+    minimizeModal() {
+      useInterfaceStore().setSettingsModalState('minimized')
     },
     importValidator(data) {
       if (!Array.isArray(data._pleroma_settings_version)) {
@@ -256,7 +254,7 @@ const SettingsModal = {
       modalMode: (store) => store.settingsModalMode,
       modalOpenedOnceUser: (store) => store.settingsModalLoadedUser,
       modalOpenedOnceAdmin: (store) => store.settingsModalLoadedAdmin,
-      modalPeeked: (store) => store.settingsModalState === 'minimized',
+      modalMinimized: (store) => store.settingsModalState === 'minimized',
     }),
     expertLevel: {
       get() {
@@ -276,6 +274,11 @@ const SettingsModal = {
       )
     },
   },
+  watch: {
+    $route(r) {
+      this.minimizeModal()
+    }
+  },
 }
 
 export default SettingsModal

src/components/settings_modal/settings_modal.scss

@@ -300,7 +300,7 @@
     }
   }
 
-  &.peek {
+  &.minimize {
     .settings-modal-panel {
       /* Explanation:
        * Modal is positioned vertically centered.

src/components/settings_modal/settings_modal.vue

@@ -2,8 +2,8 @@
   <Modal
     :is-open="modalActivated"
     class="settings-modal"
-    :class="{ peek: modalPeeked }"
-    :no-background="modalPeeked"
+    :class="{ minimize: modalMinimized }"
+    :no-background="modalMinimized"
   >
     <div class="settings-modal-panel panel">
       <div class="panel-heading">
@@ -22,8 +22,8 @@
         </transition>
         <button
           class="btn button-default"
-          :title="$t('general.peek')"
-          @click="peekModal"
+          :title="$t('general.minimize')"
+          @click="toggleMinimizeModal"
         >
           <FAIcon
             :icon="['far', 'window-minimize']"