feat: add sessionName in the attach to session dropdown (#1694)

* feat: add sessionName in the attach to session dropdown

* add method formatCapsBrowserstack

* replace if..else with switch..case

app/renderer/components/Session/AttachToSession.js

@@ -4,6 +4,7 @@ import SessionCSS from './Session.css';
 import {
   ReloadOutlined
 } from '@ant-design/icons';
+import {ServerTypes} from '../../actions/Session';
 
 const FormItem = Form.Item;
 
@@ -15,14 +16,27 @@ function formatCaps (caps) {
   return importantCaps.join(', ').trim();
 }
 
+function formatCapsBrowserstack (caps) {
+  let importantCaps = formatCaps(caps).split(', ');
+  if (caps.sessionName) {
+    importantCaps.push(caps.sessionName);
+  }
+  return importantCaps.join(', ').trim();
+}
+
 export default class AttachToSession extends Component {
 
-  getSessionInfo (session) {
-    return `${session.id} — ${formatCaps(session.capabilities)}`;
+  getSessionInfo (session, serverType) {
+    switch (serverType) {
+      case ServerTypes.browserstack:
+        return `${session.id} — ${formatCapsBrowserstack(session.capabilities)}`;
+      default:
+        return `${session.id} — ${formatCaps(session.capabilities)}`;
+    }
   }
 
   render () {
-    let {attachSessId, setAttachSessId, runningAppiumSessions, getRunningSessions, t} = this.props;
+    let {serverType, attachSessId, setAttachSessId, runningAppiumSessions, getRunningSessions, t} = this.props;
     attachSessId = attachSessId || undefined;
     return (<Form>
       <FormItem>
@@ -40,7 +54,7 @@ export default class AttachToSession extends Component {
               value={attachSessId}
               onChange={(value) => setAttachSessId(value)}>
               {runningAppiumSessions.map((session) => <Select.Option key={session.id} value={session.id}>
-                <div>{this.getSessionInfo(session)}</div>
+                <div>{this.getSessionInfo(session, serverType)}</div>
               </Select.Option>)}
             </Select>
           </Col>