From bcb9c63cb043162d31a65eab145efca5c712e286 Mon Sep 17 00:00:00 2001
From: Spythere <spythere@protonmail.com>
Date: Sat, 25 May 2024 17:05:41 +0200
Subject: [PATCH] chore: reactive hiding body scroll on modal

---
 src/components/TrainsView/TrainModal.vue | 7 +++++++
 src/mixins/modalTrainMixin.ts            | 7 -------
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/components/TrainsView/TrainModal.vue b/src/components/TrainsView/TrainModal.vue
index 4f1b186..b971a2c 100644
--- a/src/components/TrainsView/TrainModal.vue
+++ b/src/components/TrainsView/TrainModal.vue
@@ -29,8 +29,15 @@ export default defineComponent({
     chosenTrain(train: Train | undefined) {
       this.$nextTick(() => {
         if (train) {
+          document.body.classList.add('no-scroll');
           const contentEl = this.$refs['content'] as HTMLElement;
           contentEl.focus();
+        } else {
+          (this.store.modalLastClickedTarget as any)?.focus();
+
+          setTimeout(() => {
+            document.body.classList.remove('no-scroll');
+          }, 90);
         }
       });
     }
diff --git a/src/mixins/modalTrainMixin.ts b/src/mixins/modalTrainMixin.ts
index 684eece..390fdea 100644
--- a/src/mixins/modalTrainMixin.ts
+++ b/src/mixins/modalTrainMixin.ts
@@ -14,24 +14,17 @@ export default defineComponent({
   methods: {
     selectModalTrain(train: Train, target?: EventTarget | null) {
       this.store.chosenModalTrainId = train.modalId;
-      document.body.classList.add('no-scroll');
       if (target) this.store.modalLastClickedTarget = target;
     },
 
     selectModalTrainById(modalId: string, target?: EventTarget | null) {
       this.store.chosenModalTrainId = modalId;
-      document.body.classList.add('no-scroll');
       if (target) this.store.modalLastClickedTarget = target;
     },
 
     closeModal() {
       this.store.chosenModalTrainId = undefined;
       this.tooltipStore.hide();
-
-      setTimeout(() => {
-        (this.store.modalLastClickedTarget as any)?.focus();
-        document.body.classList.remove('no-scroll');
-      }, 150);
     }
   }
 });