controller: mapping-import: Move sweetalert modal raise to componen…

…t calling the function

src/stores/controller.ts

@@ -253,18 +253,16 @@ export const useControllerStore = defineStore('controller', () => {
   const importFunctionsMappingFromVehicle = async (vehicleAddress: string): Promise<void> => {
     const newMappings = await getKeyDataFromCockpitVehicleStorage(vehicleAddress, protocolMappingsKey)
     if (!newMappings) {
-      Swal.fire({ icon: 'error', text: 'Could not import functions mapping from vehicle. No data available.' })
-      return
+      throw new Error('Could not import functions mapping from vehicle. No data available.')
     }
+
     newMappings.forEach((mapping: JoystickProtocolActionsMapping) => {
       if (!mapping || !mapping['name'] || !mapping['axesCorrespondencies'] || !mapping['buttonsCorrespondencies']) {
-        Swal.fire({ icon: 'error', text: 'Could not import joystick funtions from vehicle. Invalid data.' })
-        return
+        throw new Error('Could not import joystick funtions from vehicle. Invalid data.')
       }
     })
     // @ts-ignore: We check for the necessary fields in the if before
     protocolMappings.value = newMappings
-    Swal.fire({ icon: 'success', text: 'Joystick functions mapping imported from vehicle.' })
   }
 
   return {

src/views/ConfigurationJoystickView.vue

@@ -160,7 +160,7 @@
               </button>
               <button
                 class="p-2 m-1 font-medium border rounded-md text-uppercase"
-                @click="controllerStore.importFunctionsMappingFromVehicle(globalAddress)"
+                @click="importFunctionsMappingFromVehicle"
               >
                 Import from vehicle
               </button>
@@ -273,6 +273,7 @@
 </template>
 
 <script setup lang="ts">
+import Swal from 'sweetalert2'
 import { type Ref, computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
 
 import Button from '@/components/Button.vue'
@@ -335,6 +336,15 @@ const setCurrentInputs = (joystick: Joystick, inputs: JoystickInput[]): void =>
   inputClickedDialog.value = true
 }
 
+const importFunctionsMappingFromVehicle = async (): Promise<void> => {
+  try {
+    await controllerStore.importFunctionsMappingFromVehicle(globalAddress)
+    Swal.fire({ icon: 'success', text: 'Joystick functions mappings imported from the vehicle.' })
+  } catch (error) {
+    Swal.fire({ icon: 'error', text: `${error}` })
+  }
+}
+
 /**
  * Remaps the input of a given joystick. The function waits for a button press on the joystick and then
  * updates the mapping to associate the joystick input with the pressed button. If no button is pressed