external-features-discovery-modal: Show origin extension of action suggestions

Author: rafaellehmkuhl

src/components/ExternalFeaturesDiscoveryModal.vue

@@ -48,6 +48,9 @@
                       </v-btn>
                       <v-btn variant="text" prepend-icon="mdi-close" @click="ignoreAction(action)"> Ignore </v-btn>
                     </div>
+                    <v-card-subtitle class="text-grey-lighten-1 text-center mt-3">
+                      from {{ action.extensionName }}
+                    </v-card-subtitle>
                   </v-card-item>
                 </v-card>
               </v-list-item>
@@ -292,10 +295,20 @@ const isVisible = ref(false)
  */
 const activeTab = ref('actions')
 
+/**
+ * Action with extension name
+ */
+type ActionWithExtensionName = ActionConfig & {
+  /**
+   * Name of the extension that offered the action
+   */
+  extensionName: string
+}
+
 /**
  * Store discovered actions from BlueOS
  */
-const discoveredActions = ref<ActionConfig[]>([])
+const discoveredActions = ref<ActionWithExtensionName[]>([])
 
 /**
  * Store discovered joystick suggestions from BlueOS
@@ -572,7 +585,14 @@ const closeModal = (): void => {
  */
 const checkForBlueOSActions = async (): Promise<void> => {
   try {
-    const actions = await getActionsFromBlueOS()
+    const actionsFromExtensions = await getActionsFromBlueOS()
+
+    const actions = actionsFromExtensions.flatMap((extension) =>
+      extension.actionConfigs.map((action) => ({
+        extensionName: extension.extensionName,
+        ...action,
+      }))
+    )
 
     if (actions.length > 0) {
       // Get all existing actions from the app
@@ -591,7 +611,7 @@ const checkForBlueOSActions = async (): Promise<void> => {
       const actionsToDisplay = actions.filter((action) => !existingActionNames.has(action.name))
 
       if (actionsToDisplay.length > 0) {
-        // Actions already have extension information attached from getActionsFromBlueOS
+        // Actions now include extension names from the getActionsFromBlueOS function
         discoveredActions.value = actionsToDisplay
       }
     }

src/libs/blueos.ts

@@ -172,7 +172,18 @@ export const getWidgetsFromBlueOS = async (): Promise<ExternalWidgetSetupInfo[]>
   return widgets
 }
 
-export const getActionsFromBlueOS = async (): Promise<ActionConfig[]> => {
+export type ActionsFromExtension = {
+  /**
+   * The name of the extension that is offering the actions
+   */
+  extensionName: string
+  /**
+   * The action configs from the extension
+   */
+  actionConfigs: ActionConfig[]
+}
+
+export const getActionsFromBlueOS = async (): Promise<ActionsFromExtension[]> => {
   const vehicleStore = useMainVehicleStore()
 
   // Wait until we have a global address
@@ -181,21 +192,23 @@ export const getActionsFromBlueOS = async (): Promise<ActionConfig[]> => {
   }
 
   const services = await getServicesFromBlueOS(vehicleStore.globalAddress)
-  const actions: ActionConfig[] = []
+  const actionsFromExtensions: ActionsFromExtension[] = []
   await Promise.all(
     services.map(async (service) => {
       try {
         const extraJson = await getExtrasJsonFromBlueOsService(vehicleStore.globalAddress, service)
-        if (extraJson !== null) {
-          actions.push(...extraJson.actions)
+        if (extraJson !== null && extraJson.actions) {
+          const extensionName = service.metadata?.sanitized_name || 'Unknown Extension'
+
+          actionsFromExtensions.push({ extensionName, actionConfigs: extraJson.actions })
         }
       } catch (error) {
         console.error(`Could not get actions from BlueOS service ${service.metadata?.sanitized_name}. ${error}`)
       }
     })
   )
 
-  return actions
+  return actionsFromExtensions
 }
 
 export const getJoystickSuggestionsFromBlueOS = async (): Promise<JoystickMapSuggestionsFromExtension[]> => {