From fef5f23166a00bc3bddbadf4238a38b1c5bd397c Mon Sep 17 00:00:00 2001
From: AkiraFukushima <h3.poteto@gmail.com>
Date: Wed, 27 Apr 2022 21:17:37 +0900
Subject: [PATCH] Rewrite Modals/Shortcut with composition API

---
 .../TimelineSpace/Modals/Shortcut.vue         | 28 +++++++++++--------
 1 file changed, 17 insertions(+), 11 deletions(-)

diff --git a/src/renderer/components/TimelineSpace/Modals/Shortcut.vue b/src/renderer/components/TimelineSpace/Modals/Shortcut.vue
index 9afc6541..0be521c7 100644
--- a/src/renderer/components/TimelineSpace/Modals/Shortcut.vue
+++ b/src/renderer/components/TimelineSpace/Modals/Shortcut.vue
@@ -81,20 +81,26 @@
   </div>
 </template>
 
-<script>
-export default {
+<script lang="ts">
+import { defineComponent, computed } from 'vue'
+import { useStore } from '@/store'
+import { MUTATION_TYPES } from '@/store/TimelineSpace/Modals/Shortcut'
+
+export default defineComponent({
   name: 'shortcut',
-  computed: {
-    shortcutModal: {
-      get() {
-        return this.$store.state.TimelineSpace.Modals.Shortcut.modalOpen
-      },
-      set(value) {
-        this.$store.commit('TimelineSpace/Modals/Shortcut/changeModal', value)
-      }
+  setup() {
+    const space = 'TimelineSpace/Modals/Shortcut'
+    const store = useStore()
+    const shortcutModal = computed({
+      get: () => store.state.TimelineSpace.Modals.Shortcut.modalOpen,
+      set: (value: boolean) => store.commit(`${space}/${MUTATION_TYPES.CHANGE_MODAL}`, value)
+    })
+
+    return {
+      shortcutModal
     }
   }
-}
+})
 </script>
 
 <style lang="scss" scoped>