✨ (persistance) persist user choices

Lazy load youtube video

src/hooks/useInterval.ts

@@ -0,0 +1,13 @@
+import { useGetters, useActions } from 'vuex-composition-helpers'
+import { GetterTree } from 'vuex'
+import { State, RootActions } from '@/store'
+
+export const useInterval = () => {
+  const { interval } = useGetters<GetterTree<State, State>>(['interval'])
+  const { setInterval } = useActions<RootActions>(['setInterval'])
+
+  return {
+    interval,
+    setInterval
+  }
+}

src/hooks/useMusic.ts

@@ -1,9 +1,13 @@
-import { ref } from '@vue/composition-api'
+import { useGetters, useActions } from 'vuex-composition-helpers'
+import { GetterTree } from 'vuex'
+import { State, RootActions } from '@/store'
 
 export const useMusic = () => {
-  const hasMusic = ref(true)
+  const { withMusic } = useGetters<GetterTree<State, State>>(['withMusic'])
+  const { setWithMusic } = useActions<RootActions>(['setWithMusic'])
 
   return {
-    hasMusic
+    withMusic,
+    setWithMusic
   }
 }

src/hooks/useTimer.ts

@@ -1,6 +1,7 @@
 import { ref, computed, watch } from '@vue/composition-api'
 import { StopwatchState } from '@/types/StopwatchState'
 import { notify } from '@/utils/notification'
+import { useInterval } from './useInterval'
 
 const format = (num: number) => {
   return num.toString().padStart(2, '0')
@@ -16,7 +17,7 @@ const formatSeconds = (seconds: number) => {
 export const useTimer = () => {
   const timeState = ref<StopwatchState>('stopped')
   const seconds = ref(0)
-  const interval = ref(5)
+  const { interval } = useInterval()
   const sessionSeconds = ref(interval.value * 60)
   const isDev1Turn = ref(true)