Rewrite Modals/Shortcut with composition API

src/renderer/components/TimelineSpace/Modals/Shortcut.vue

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