update packages, remove nosleep, align translation logic

package.json

@@ -23,32 +23,31 @@
     "@hangtime/grip-connect": "^0.3.4",
     "@mdi/js": "^7.4.47",
     "@unhead/vue": "^1.9.16",
-    "@vueuse/core": "^10.11.1",
+    "@vueuse/core": "^11.0.0",
     "core-js": "^3.38.0",
-    "firebase": "^10.12.5",
+    "firebase": "^10.13.0",
     "ircra": "^2.2.4",
     "js-video-url-parser": "^0.5.1",
-    "nosleep.js": "^0.12.0",
-    "pinia": "^2.2.1",
+    "pinia": "^2.2.2",
     "register-service-worker": "^1.7.2",
     "vue": "^3.4.15",
     "vue-gtag": "^2.0.1",
-    "vue-i18n": "^9.13.1",
+    "vue-i18n": "^9.14.0",
     "vue-inline-svg": "^3.1.3",
     "vue-router": "^4.4.3",
     "vuedraggable": "^4.1.0",
-    "vuetify": "^3.6.14"
+    "vuetify": "^3.7.0"
   },
   "devDependencies": {
-    "@playwright/test": "^1.46.0",
+    "@playwright/test": "^1.46.1",
     "@rushstack/eslint-patch": "^1.10.4",
-    "@storybook/addon-essentials": "^8.2.8",
-    "@storybook/vue3-vite": "^8.2.8",
+    "@storybook/addon-essentials": "^8.2.9",
+    "@storybook/vue3-vite": "^8.2.9",
     "@tsconfig/node20": "^20.1.4",
     "@types/digital-goods-browser": "^2.0.3",
     "@types/google.maps": "^3.55.12",
     "@types/jsdom": "^21.1.7",
-    "@types/node": "^20.14.15",
+    "@types/node": "^20.16.0",
     "@types/web-bluetooth": "^0.0.20",
     "@vitejs/plugin-vue": "^5.1.2",
     "@vue/eslint-config-prettier": "^9.0.0",
@@ -69,9 +68,9 @@
     "rollup-plugin-visualizer": "^5.12.0",
     "sass": "^1.77.8",
     "typescript": "~5.5.0",
-    "vite": "^5.4.0",
+    "vite": "^5.4.1",
     "vite-plugin-pwa": "^0.20.1",
-    "vite-plugin-vue-devtools": "^7.3.7",
+    "vite-plugin-vue-devtools": "^7.3.8",
     "vite-plugin-vuetify": "^2.0.4",
     "vitest": "^2.0.5",
     "vue-tsc": "^2.0.29"

src/components/molecules/ExerciseCard/ExerciseCard.vue

@@ -78,7 +78,7 @@ const props = defineProps({
                 <v-card-actions>
                   <v-spacer></v-spacer>
 
-                  <v-btn :text="$t('Close')" @click="isActive.value = false"></v-btn>
+                  <v-btn :text="t('Close')" @click="isActive.value = false"></v-btn>
                 </v-card-actions>
               </v-card>
             </template>

src/components/molecules/HangboardSelect/HangboardSelect.vue

@@ -71,7 +71,7 @@ const subject = computed(() =>
             }}&nbsp;{{ item.title }}</span
           >
           <v-chip class="mx-2" size="x-small" v-if="item.value >= getCompanies().length - 5">
-            {{ $t('new') }}
+            {{ t('new') }}
           </v-chip>
         </template>
       </v-list-item>

src/components/molecules/dialog/WalkthroughApp/WalkthroughApp.vue

@@ -270,10 +270,10 @@ const settingsGrade = computed({
                   :disabled="getHangboard && getHangboard.holds === 0"
                   @click="finishWalkthrough(true)"
                 >
-                  {{ $t('Add a workout') }}
+                  {{ t('Add a workout') }}
                 </v-btn>
                 <v-btn variant="text" @click="finishWalkthrough(false)">
-                  {{ $t('Close') }}
+                  {{ t('Close') }}
                 </v-btn>
               </v-card-actions>
             </v-card>

src/components/molecules/dialog/WorkoutCommunityFilter/WorkoutCommunityFilter.vue

@@ -64,7 +64,7 @@ watch(
                 v-model="workoutsCommunityFilter"
                 :items="items"
                 :label="t('Sort workouts by')"
-                :item-title="(option) => $t(option.filter)"
+                :item-title="(option) => t(option.filter)"
                 item-value="value"
                 :item-props="true"
                 single-line

src/components/organisms/WorkoutTimer/WorkoutTimer.vue

@@ -4,14 +4,15 @@ import { stream } from '@hangtime/grip-connect'
 import type { massObject } from '@hangtime/grip-connect/src/types/notify'
 import { useI18n } from 'vue-i18n'
 import { storeToRefs } from 'pinia'
-import NoSleep from 'nosleep.js'
+import { useWakeLock } from '@vueuse/core'
 import WorkoutBluetooth from '@/components/atoms/WorkoutBluetooth/WorkoutBluetooth.vue'
 import WorkoutShare from '@/components/atoms/WorkoutShare/WorkoutShare.vue'
 import WorkoutSubscribe from '@/components/atoms/WorkoutSubscribe/WorkoutSubscribe.vue'
 import ExerciseCard from '@/components/molecules/ExerciseCard/ExerciseCard.vue'
 import ExerciseAbout from '@/components/molecules/ExerciseAbout/ExerciseAbout.vue'
 import WorkoutComplete from '@/components/molecules/dialog/WorkoutComplete/WorkoutComplete.vue'
 import SubscribeToApp from '@/components/molecules/dialog/SubscribeToApp/SubscribeToApp.vue'
+import SliderBluetooth from '@/components/atoms/SliderBluetooth/SliderBluetooth.vue'
 import { Workout, Exercise } from '@/interfaces/workouts.interface'
 import { time } from '@/helpers'
 
@@ -33,6 +34,8 @@ const { updateUser } = useAuthenticationStore()
 
 const { createUserActivity } = useActivitiesStore()
 
+const { isSupported, isActive, request, release } = useWakeLock()
+
 const props = defineProps({
   workout: {
     type: Object as () => Workout
@@ -62,7 +65,6 @@ const currentExerciseStep: Ref<number> = ref(0)
 const currentExerciseStepRepeat: Ref<number> = ref(0)
 
 const audio: HTMLAudioElement = new Audio()
-const noSleep: NoSleep = new NoSleep()
 const setupTime: number = 5
 
 // complete
@@ -104,7 +106,7 @@ const exerciseTime = computed<number>(() => {
 
 const requestWakeLock = () => {
   try {
-    noSleep.enable()
+    isSupported && !isActive ? request('screen') : null
   } catch (err: unknown) {
     if (err instanceof Error) {
       // eslint-disable-next-line no-console
@@ -184,17 +186,13 @@ const countDown = () => {
   }
 }
 
-const pauseWorkout = () => {
-  if (!timerPaused.value) {
-    noSleep.disable()
-  } else {
-    requestWakeLock()
-  }
+const toggleWorkout = () => {
+  !timerPaused.value && isSupported && isActive ? release() : request('screen')
   timerPaused.value = !timerPaused.value
 }
 
 const stopTimer = () => {
-  noSleep.disable()
+  isActive ? release() : null
   if (timer !== null) {
     clearInterval(timer)
     timer = null
@@ -776,7 +774,7 @@ onMounted(() => {
                       size="x-large"
                       variant="flat"
                       class="rounded-circle"
-                      @click="timerPaused === null ? startTimer() : pauseWorkout()"
+                      @click="timerPaused === null ? startTimer() : toggleWorkout()"
                     ></v-btn>
                     <v-btn
                       :disabled="currentExercise >= workout?.exercises?.length - 1"
@@ -820,7 +818,7 @@ onMounted(() => {
 
       <v-col cols="12" md="5">
         <v-card v-if="exerciseNext" class="mb-8">
-          <v-card-title>{{ $t('Next exercise') }}</v-card-title>
+          <v-card-title>{{ t('Next exercise') }}</v-card-title>
           <v-card-text>
             <exercise-card
               :exercise="exerciseNext"
@@ -836,7 +834,7 @@ onMounted(() => {
           </v-card-text>
         </v-card>
         <v-card v-if="exercise?.exercise !== null && !quick" class="mb-8">
-          <v-card-title>{{ $t('About the exercise') }}</v-card-title>
+          <v-card-title>{{ t('About the exercise') }}</v-card-title>
           <v-card-text>
             <exercise-about :exercise="exercise" />
           </v-card-text>

src/views/brands/BrandsPage.vue

@@ -64,7 +64,7 @@ useHead({
                     size="x-small"
                     v-if="company.id >= getCompanies().length - 5"
                   >
-                    {{ $t('new') }}
+                    {{ t('new') }}
                   </v-chip>
                 </v-list-item-title>
                 <v-list-item-subtitle>