Allow syncing Cockpit profiles with the vehicle

src/components/EditMenu.vue

@@ -43,6 +43,16 @@
             <span class="mdi mdi-upload" />
           </label>
         </div>
+        <div
+          v-tooltip="'Export profiles to vehicle.'"
+          class="icon-btn mdi mdi-briefcase-upload"
+          @click="store.exportProfilesToVehicle"
+        />
+        <div
+          v-tooltip="'Import profiles from vehicle.'"
+          class="icon-btn mdi mdi-briefcase-download"
+          @click="store.importProfilesFromVehicle"
+        />
       </div>
     </div>
     <div class="w-full h-px my-2 sm bg-slate-800/40" />

src/stores/widgetManager.ts

@@ -9,14 +9,18 @@ import { computed, onBeforeMount, onBeforeUnmount, ref, watch } from 'vue'
 
 import { widgetProfiles } from '@/assets/defaults'
 import { miniWidgetsProfile } from '@/assets/defaults'
+import { getKeyDataFromCockpitVehicleStorage, setKeyDataOnCockpitVehicleStorage } from '@/libs/blueos'
 import * as Words from '@/libs/funny-name/words'
 import { CockpitAction, registerActionCallback, unregisterActionCallback } from '@/libs/joystick/protocols'
 import { isEqual } from '@/libs/utils'
 import type { Point2D, SizeRect2D } from '@/types/general'
 import type { MiniWidget, MiniWidgetContainer } from '@/types/miniWidgets'
 import { type Profile, type View, type Widget, isProfile, isView, WidgetType } from '@/types/widgets'
 
+import { useMainVehicleStore } from './mainVehicle'
+
 export const useWidgetManagerStore = defineStore('widget-manager', () => {
+  const vehicleStore = useMainVehicleStore()
   const editingMode = ref(false)
   const showGrid = ref(true)
   const gridInterval = ref(0.01)
@@ -159,6 +163,24 @@ export const useWidgetManagerStore = defineStore('widget-manager', () => {
     reader.readAsText(e.target.files[0])
   }
 
+  const importProfilesFromVehicle = async (): Promise<void> => {
+    const newProfiles = await getKeyDataFromCockpitVehicleStorage(
+      vehicleStore.globalAddress,
+      'cockpit-saved-profiles-v7'
+    )
+    savedProfiles.value = newProfiles
+    Swal.fire({ icon: 'success', text: 'Cockpit profiles imported from vehicle.', timer: 3000 })
+  }
+
+  const exportProfilesToVehicle = async (): Promise<void> => {
+    await setKeyDataOnCockpitVehicleStorage(
+      vehicleStore.globalAddress,
+      'cockpit-saved-profiles-v7',
+      savedProfiles.value
+    )
+    Swal.fire({ icon: 'success', text: 'Cockpit profiles exported to vehicle.', timer: 3000 })
+  }
+
   /**
    * Adds new view to the store, with a randomly generated hash with UUID4 pattern
    */
@@ -483,5 +505,7 @@ export const useWidgetManagerStore = defineStore('widget-manager', () => {
     openWidgetConfigMenu,
     toggleFullScreen,
     isFullScreen,
+    importProfilesFromVehicle,
+    exportProfilesToVehicle,
   }
 })