♻️ (timer) break into more pieces the hook useTimer

src/components/ChilledMusic.vue

@@ -0,0 +1,34 @@
+<template>
+  <div class="chilled-music">
+    <youtube-video
+      v-show="false"
+      src="https://www.youtube-nocookie.com/embed/5qap5aO4i9A"
+    />
+  </div>
+</template>
+
+<script lang="ts">
+import 'youtube-video-js'
+import { defineComponent, onMounted, watchEffect } from '@vue/composition-api'
+
+export default defineComponent({
+  name: 'ChilledMusic',
+  props: {
+    play: {
+      type: Boolean,
+      required: true
+    }
+  },
+  setup(props) {
+    let chilledcow: HTMLVideoElement | null = null
+
+    onMounted(() => {
+      chilledcow = document.querySelector('youtube-video')
+    })
+
+    watchEffect(() => {
+      props.play ? chilledcow?.play() : chilledcow?.pause()
+    })
+  }
+})
+</script>