vehicle-settings: Store vehicle settings inside it (instead of local …

…browser storage)
bluerobotics · Feb 1, 2024 · c1438ae · c1438ae
1 parent 8e10708
commit c1438ae
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 17 deletions.
diff --git a/src/stores/alert.ts b/src/stores/alert.ts
@@ -1,16 +1,20 @@
-import { useStorage } from '@vueuse/core'
 import { defineStore } from 'pinia'
 import { computed, reactive, watch } from 'vue'
 
+import { useBlueOsStorage } from '@/composables/settingsSyncer'
+
 import { Alert, AlertLevel } from '../types/alert'
 
 export const useAlertStore = defineStore('alert', () => {
   const alerts = reactive([new Alert(AlertLevel.Success, 'Cockpit started')])
-  const enableVoiceAlerts = useStorage('cockpit-enable-voice-alerts', true)
+  const enableVoiceAlerts = useBlueOsStorage('cockpit-enable-voice-alerts', true)
   // eslint-disable-next-line jsdoc/require-jsdoc
   const availableAlertSpeechVoices = reactive<SpeechSynthesisVoice[]>([])
-  const selectedAlertSpeechVoiceName = useStorage<string | undefined>('cockpit-selected-alert-speech-voice', undefined)
-  const enabledAlertLevels = useStorage('cockpit-enabled-alert-levels', [
+  const selectedAlertSpeechVoiceName = useBlueOsStorage<string | undefined>(
+    'cockpit-selected-alert-speech-voice',
+    undefined
+  )
+  const enabledAlertLevels = useBlueOsStorage('cockpit-enabled-alert-levels', [
     { level: AlertLevel.Success, enabled: true },
     { level: AlertLevel.Error, enabled: true },
     { level: AlertLevel.Info, enabled: false },

diff --git a/src/stores/controller.ts b/src/stores/controller.ts
@@ -1,10 +1,11 @@
-import { useDocumentVisibility, useStorage } from '@vueuse/core'
+import { useDocumentVisibility } from '@vueuse/core'
 import { saveAs } from 'file-saver'
 import { defineStore } from 'pinia'
 import Swal from 'sweetalert2'
 import { computed, ref, toRaw, watch } from 'vue'
 
 import { availableGamepadToCockpitMaps, cockpitStandardToProtocols } from '@/assets/joystick-profiles'
+import { useBlueOsStorage } from '@/composables/settingsSyncer'
 import { getKeyDataFromCockpitVehicleStorage, setKeyDataOnCockpitVehicleStorage } from '@/libs/blueos'
 import { type JoystickEvent, EventType, joystickManager, JoystickModel } from '@/libs/joystick/manager'
 import { allAvailableAxes, allAvailableButtons } from '@/libs/joystick/protocols'
@@ -34,13 +35,13 @@ const cockpitStdMappingsKey = 'cockpit-standard-mappings-v2'
 export const useControllerStore = defineStore('controller', () => {
   const joysticks = ref<Map<number, Joystick>>(new Map())
   const updateCallbacks = ref<controllerUpdateCallback[]>([])
-  const protocolMappings = useStorage(protocolMappingsKey, cockpitStandardToProtocols)
-  const protocolMappingIndex = useStorage(protocolMappingIndexKey, 0)
-  const cockpitStdMappings = useStorage(cockpitStdMappingsKey, availableGamepadToCockpitMaps)
+  const protocolMappings = useBlueOsStorage(protocolMappingsKey, cockpitStandardToProtocols)
+  const protocolMappingIndex = useBlueOsStorage(protocolMappingIndexKey, 0)
+  const cockpitStdMappings = useBlueOsStorage(cockpitStdMappingsKey, availableGamepadToCockpitMaps)
   const availableAxesActions = allAvailableAxes
   const availableButtonActions = allAvailableButtons
   const enableForwarding = ref(true)
-  const holdLastInputWhenWindowHidden = useStorage('cockpit-hold-last-joystick-input-when-window-hidden', false)
+  const holdLastInputWhenWindowHidden = useBlueOsStorage('cockpit-hold-last-joystick-input-when-window-hidden', false)
 
   const protocolMapping = computed<JoystickProtocolActionsMapping>({
     get() {

diff --git a/src/stores/mission.ts b/src/stores/mission.ts
@@ -1,13 +1,13 @@
-import { useStorage } from '@vueuse/core'
 import { defineStore } from 'pinia'
 import { reactive, ref, watch } from 'vue'
 
+import { useBlueOsStorage } from '@/composables/settingsSyncer'
 import type { Waypoint, WaypointCoordinates } from '@/types/mission'
 
 export const useMissionStore = defineStore('mission', () => {
   const missionName = ref('')
-  const lastMissionName = useStorage('cockpit-last-mission-name', '')
-  const missionStartTime = useStorage('cockpit-mission-start-time', new Date())
+  const lastMissionName = useBlueOsStorage('cockpit-last-mission-name', '')
+  const missionStartTime = useBlueOsStorage('cockpit-mission-start-time', new Date())
 
   watch(missionName, () => (lastMissionName.value = missionName.value))
 

diff --git a/src/stores/widgetManager.ts b/src/stores/widgetManager.ts
@@ -1,6 +1,6 @@
 import '@/libs/cosmos'
 
-import { useDebounceFn, useStorage } from '@vueuse/core'
+import { useDebounceFn } from '@vueuse/core'
 import { saveAs } from 'file-saver'
 import { defineStore } from 'pinia'
 import Swal from 'sweetalert2'
@@ -9,6 +9,7 @@ import { computed, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue'
 
 import { widgetProfiles } from '@/assets/defaults'
 import { miniWidgetsProfile } from '@/assets/defaults'
+import { useBlueOsStorage } from '@/composables/settingsSyncer'
 import { getKeyDataFromCockpitVehicleStorage, setKeyDataOnCockpitVehicleStorage } from '@/libs/blueos'
 import * as Words from '@/libs/funny-name/words'
 import {
@@ -30,10 +31,10 @@ export const useWidgetManagerStore = defineStore('widget-manager', () => {
   const editingMode = ref(false)
   const showGrid = ref(true)
   const gridInterval = ref(0.01)
-  const currentMiniWidgetsProfile = useStorage('cockpit-mini-widgets-profile-v4', miniWidgetsProfile)
-  const savedProfiles = useStorage<Profile[]>(savedProfilesKey, [])
-  const currentViewIndex = useStorage('cockpit-current-view-index', 0)
-  const currentProfileIndex = useStorage('cockpit-current-profile-index', 0)
+  const currentMiniWidgetsProfile = useBlueOsStorage('cockpit-mini-widgets-profile-v4', miniWidgetsProfile)
+  const savedProfiles = useBlueOsStorage<Profile[]>(savedProfilesKey, [])
+  const currentViewIndex = useBlueOsStorage('cockpit-current-view-index', 0)
+  const currentProfileIndex = useBlueOsStorage('cockpit-current-profile-index', 0)
 
   const currentView = computed<View>({
     get() {