fix(ui) - assist filter

frontend/app/components/BugFinder/LiveSessionList/LiveSessionList.tsx

@@ -1,5 +1,5 @@
-import React, { useEffect, useState } from 'react';
-import { fetchLiveList } from 'Duck/sessions';
+import React, { useEffect } from 'react';
+import { fetchList } from 'Duck/sessions';
 import { connect } from 'react-redux';
 import { NoContent, Loader } from 'UI';
 import { List, Map } from 'immutable';
@@ -7,45 +7,31 @@ import SessionItem from 'Shared/SessionItem';
 
 interface Props {
   loading: Boolean,
-  list?: List<any>,
-  fetchLiveList: () => void,
+  list?: List<any>,  
+  fetchList: (params) => void,
   filters: List<any>
 }
 
 function LiveSessionList(props: Props) {
-  const { loading, list, filters } = props;
-  const [userId, setUserId] = useState(undefined)
+  const { loading, list, filters } = props;  
 
-  useEffect(() => {
-    props.fetchLiveList();
+  useEffect(() => {     
+    props.fetchList(filters.toJS());
   }, [])
 
-  useEffect(() => {    
-    if (filters) {
-      const userIdFilter = filters.filter(i => i.key === 'USERID').first()
-      if (userIdFilter)
-        setUserId(userIdFilter.value[0])
-      else
-        setUserId(undefined)
-    }
-  }, [filters])
-  
-
   return (
     <div>
       <NoContent
-        title={"No live sessions!"}
-        // subtext="Please try changing your search parameters."
+        title={"No live sessions!"}        
         image={<img src="/img/live-sessions.png" style={{ width: '70%', marginBottom: '30px' }}/>}
         show={ !loading && list && list.size === 0}
       >
         <Loader loading={ loading }>
-          {list && (userId ? list.filter(i => i.userId === userId) : list).map(session => (
+          {list && list.map(session => (
             <SessionItem
               key={ session.sessionId }
               session={ session }
-              live
-              // hasUserFilter={hasUserFilter}
+              live              
             />
           ))}
         </Loader>
@@ -57,5 +43,5 @@ function LiveSessionList(props: Props) {
 export default connect(state => ({
   list: state.getIn(['sessions', 'liveSessions']),
   loading: state.getIn([ 'sessions', 'loading' ]),
-  filters: state.getIn([ 'filters', 'appliedFilter', 'filters' ]),
-}), { fetchLiveList })(LiveSessionList)
+  filters: state.getIn([ 'filters', 'appliedFilter' ]),
+}), { fetchList })(LiveSessionList)

frontend/app/components/ui/NoContent/NoContent.js

@@ -11,10 +11,7 @@ export default ({
   empty = false,
   image = null
 }) => (!show ? children :
-<div className={ `${ styles.wrapper } ${ size && styles[ size ] }` }>
-  {
-    image && image
-  }
+<div className={ `${ styles.wrapper } ${ size && styles[ size ] }` }>  
   {
     icon && <div className={ empty ? styles.emptyIcon : styles.icon } />
   }
@@ -23,5 +20,8 @@ export default ({
     subtext &&
     <div className={ styles.subtext }>{ subtext }</div>
   }
+  {
+    image && <div className="mt-4 flex justify-center">{ image } </div>
+  }
 </div>
 );

frontend/app/duck/sessions.js

@@ -255,13 +255,18 @@ function init(session) {
   }
 }
 
-export function fetchList(params = {}, clear = false) {
-  return {
+export const fetchList = (params = {}, clear = false) => (dispatch, getState) => {
+  const activeTab = getState().getIn([ 'sessions', 'activeTab' ]);  
+
+  return dispatch(activeTab && activeTab.type === 'live' ? {
+    types: FETCH_LIVE_LIST.toArray(),
+    call: client => client.post('/assist/sessions', params),
+  } : {
     types: FETCH_LIST.toArray(),
     call: client => client.post('/sessions/search2', params),
     clear,
     params: cleanParams(params),
-  };
+  })
 }
 
 export function fetchErrorStackList(sessionId, errorId) {

frontend/app/player/MessageDistributor/managers/AssistManager.ts

@@ -125,9 +125,9 @@ export default class AssistManager {
       this.md.setMessagesLoading(false);
     }
     if (status === ConnectionStatus.Connected) {
-      // this.md.display(true);
+      this.md.display(true);
     } else {
-      // this.md.display(false);
+      this.md.display(false);
     }
     update({ peerConnectionStatus: status });
   }