Show Android device names & ids for ADB & Frida

Author: pimterry

src/components/intercept/config/android-adb-config.tsx

@@ -128,9 +128,15 @@ class AndroidAdbConfig extends React.Component<{
                 targets={this.deviceIds.map(id => {
                     const activating = this.inProgressIds.includes(id);
 
+                    // Only new servers (1.17.0+) expose metadata.devices with names
+                    const deviceName = this.props.interceptor.metadata?.devices?.[id].name
+                        ?? id;
+
                     return {
                         id,
-                        title: `Intercept Android device ${id}`,
+                        title: `Intercept Android device ${deviceName}${
+                            id !== deviceName ? ` (ID: ${id})` : ''
+                        }`,
                         status: activating
                                 ? 'activating'
                                 : 'available',
@@ -139,7 +145,7 @@ class AndroidAdbConfig extends React.Component<{
                         : id.match(/\d+\.\d+\.\d+\.\d+:\d+/)
                             ? <Icon icon={['fas', 'network-wired']} />
                         : <Icon icon={['fas', 'mobile-alt']} />,
-                        content: id
+                        content: deviceName
                     };
                 })}
                 interceptTarget={this.interceptDevice}

src/components/intercept/config/frida-config.tsx

@@ -402,7 +402,7 @@ class FridaConfig extends React.Component<{
 
                     return {
                         id,
-                        title: `${this.deviceClassName} device ${name} in state ${state}`,
+                        title: `${this.deviceClassName} device ${name} (${id}) in state ${state}`,
                         icon: id.includes("emulator-")
                                 ? <Icon icon={['far', 'window-maximize']} />
                             : id.match(/\d+\.\d+\.\d+\.\d+:\d+/)