fix(ui) - version check, fetch time decimal, feat(ui) - assist loader, search with queryParam

frontend/app/components/BugFinder/BugFinder.js

@@ -5,7 +5,7 @@ import {
   fetchFavoriteList as fetchFavoriteSessionList
 } from 'Duck/sessions';
 import { countries } from 'App/constants';
-import { applyFilter, clearEvents } from 'Duck/filters';
+import { applyFilter, clearEvents, addAttribute } from 'Duck/filters';
 import { fetchList as fetchFunnelsList } from 'Duck/funnels';
 import { defaultFilters, preloadedFilters } from 'Types/filter';
 import { KEYS } from 'Types/filter/customFilter';
@@ -34,6 +34,21 @@ const weakEqual = (val1, val2) => {
   return `${ val1 }` === `${ val2 }`;
 }
 
+const allowedQueryKeys = [
+  'userOs',
+  'userId',
+  'userBrowser',
+  'userDevice',
+  'userCountry',
+  'startDate',
+  'endDate',
+  'minDuration',
+  'maxDuration',
+  'referrer',
+  'sort',
+  'order',
+];
+
 @withLocationHandlers()
 @connect(state => ({
   filter: state.getIn([ 'filters', 'appliedFilter' ]),
@@ -50,6 +65,7 @@ const weakEqual = (val1, val2) => {
 }), {
   fetchFavoriteSessionList,
   applyFilter,
+  addAttribute,
   fetchFilterVariables,
   fetchIntegrationVariables,
   fetchSources,
@@ -88,10 +104,14 @@ export default class BugFinder extends React.PureComponent {
       };
     });    
 
-    this.props.resetFunnel();
-    this.props.resetFunnelFilters();
-
+    props.resetFunnel();
+    props.resetFunnelFilters();
     props.fetchFunnelsList(LAST_7_DAYS)
+
+    const queryFilter = this.props.query.all(allowedQueryKeys);
+    if (queryFilter.hasOwnProperty('userId')) {
+      props.addAttribute({ label: 'User Id', key: KEYS.USERID, type: KEYS.USERID, operator: 'is', value: queryFilter.userId })
+    }
   }
 
   toggleRehydratePanel = () => {

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

@@ -8,7 +8,7 @@ import { KEYS } from 'Types/filter/customFilter';
 import { applyFilter, addAttribute } from 'Duck/filters';
 import Filter from 'Types/filter';
 
-const AUTOREFRESH_INTERVAL = 1 * 60 * 1000
+const AUTOREFRESH_INTERVAL = .5 * 60 * 1000
 
 interface Props {
   loading: Boolean,

frontend/app/components/BugFinder/SessionsMenu/SessionsMenu.js

@@ -1,18 +1,18 @@
 import React, { useEffect } from 'react'
 import { connect } from 'react-redux';
 import cn from 'classnames';
-import { SideMenuitem, SavedSearchList, Progress, Popup } from 'UI'
+import { SideMenuitem, SavedSearchList, Progress, Popup, Icon, CircularLoader } from 'UI'
 import stl from './sessionMenu.css';
 import {  fetchWatchdogStatus } from 'Duck/watchdogs';
 import { setActiveFlow, clearEvents } from 'Duck/filters';
 import { setActiveTab } from 'Duck/sessions';
 import { issues_types } from 'Types/session/issue'
-import NewBadge from 'Shared/NewBadge';
+import { fetchList as fetchSessionList } from 'Duck/sessions';
 
 function SessionsMenu(props) {
   const { 
     activeFlow, activeTab, watchdogs = [], keyMap, wdTypeCount,
-    fetchWatchdogStatus, toggleRehydratePanel } = props;
+    fetchWatchdogStatus, toggleRehydratePanel, filters, sessionsLoading } = props;
 
   const onMenuItemClick = (filter) => {
     props.onMenuItemClick(filter)
@@ -76,10 +76,19 @@ function SessionsMenu(props) {
       <div className={stl.divider} />
       <div className="my-3">
         <SideMenuitem
-          title={ <div className="flex items-center">
-            <div>Assist</div>
-            <div className="ml-2">{ <NewBadge />}</div>
-          </div>  }
+          title={
+            <div className="flex items-center">
+              <div>Assist</div>
+              { activeTab.type === 'live' && (
+                <div
+                  className="ml-4 h-5 w-6 flex items-center justify-center"
+                  onClick={() => !sessionsLoading && props.fetchSessionList(filters.toJS())}
+                >
+                  { sessionsLoading ? <CircularLoader className="ml-1" /> : <Icon name="sync-alt" size="14" />}
+                </div>
+              )}
+            </div>
+          }
           iconName="person"
           active={activeTab.type === 'live'}
           onClick={() => onMenuItemClick({ name: 'Assist', type: 'live' })}
@@ -109,6 +118,8 @@ export default connect(state => ({
   wdTypeCount: state.getIn([ 'sessions', 'wdTypeCount' ]),
   activeFlow: state.getIn([ 'filters', 'activeFlow' ]),
   captureRate: state.getIn(['watchdogs', 'captureRate']),
+  filters: state.getIn([ 'filters', 'appliedFilter' ]),
+  sessionsLoading: state.getIn([ 'sessions', 'loading' ]),
 }), { 
-  fetchWatchdogStatus, setActiveFlow, clearEvents, setActiveTab
+  fetchWatchdogStatus, setActiveFlow, clearEvents, setActiveTab, fetchSessionList
 })(SessionsMenu);

frontend/app/components/Client/Integrations/BugsnagForm/BugsnagForm.js

@@ -7,7 +7,7 @@ const BugsnagForm = (props) => (
   <>
     <div className="p-5 border-b mb-4">
       <div>How to integrate Bugsnag with OpenReplay and see backend errors alongside session recordings.</div>
-      <DocLink className="mt-4" label="Integrate Bugsnag" url="https://docs.openreplay.com/integrations/datadog" />
+      <DocLink className="mt-4" label="Integrate Bugsnag" url="https://docs.openreplay.com/integrations/bugsnag" />
     </div>
     <IntegrationForm 
       { ...props }

frontend/app/components/Session_/Network/Network.js

@@ -101,7 +101,7 @@ function renderSize(r) {
 export function renderDuration(r) {
   if (!r.success) return 'x';
 
-  const text = `${ r.duration }ms`;
+  const text = `${ Math.round(r.duration) }ms`;
   if (!r.isRed() && !r.isYellow()) return text;
 
   let tooltipText;

frontend/app/components/shared/TrackerUpdateMessage/TrackerUpdateMessage.js

@@ -12,7 +12,7 @@ const TrackerUpdateMessage= (props) => {
   const hasSessions = !!activeSite && !activeSite.recorded;
   const appVersionInt = parseInt(window.ENV.TRACKER_VERSION.split(".").join(""))
   const trackerVersionInt = site.trackerVersion ? parseInt(site.trackerVersion.split(".").join("")) : 0
-  const needUpdate = !hasSessions && trackerVersionInt >= appVersionInt;
+  const needUpdate = !hasSessions && trackerVersionInt > appVersionInt;
   return needUpdate ? (
     <>
       {(

frontend/app/duck/sessions.js

@@ -243,7 +243,7 @@ const reducer = (state = initialState, action = {}) => {
 };
 
 export default withRequestState({
-  _: [ FETCH, FETCH_LIST ],
+  _: [ FETCH, FETCH_LIST, FETCH_LIVE_LIST ],
   fetchFavoriteListRequest: FETCH_FAVORITE_LIST,
   toggleFavoriteRequest: TOGGLE_FAVORITE,
   fetchErrorStackList: FETCH_ERROR_STACK,

frontend/env.js

@@ -20,7 +20,7 @@ const oss = {
 	MINIO_USE_SSL: process.env.MINIO_USE_SSL,
 	MINIO_ACCESS_KEY: process.env.MINIO_ACCESS_KEY,
 	MINIO_SECRET_KEY: process.env.MINIO_SECRET_KEY,
-	TRACKER_VERSION: '3.4.3', // trackerInfo.version,
+	TRACKER_VERSION: '3.4.7', // trackerInfo.version,
 }
 
 module.exports = {