fix(bots): normalized bot status & added filters

src/bp/common/typings.ts

@@ -188,7 +188,7 @@ export interface ServerHealth {
 }
 
 export interface BotHealth {
-  status: 'mounted' | 'unmounted' | 'disabled' | 'error'
+  status: 'healthy' | 'unhealthy' | 'unmounted' | 'disabled'
   errorCount: number
   criticalCount: number
   warningCount: number

src/bp/core/services/bot-service.ts

@@ -589,11 +589,9 @@ export class BotService {
         }, botId)
       )
 
-      BotService.setBotStatus(botId, 'mounted')
+      BotService.setBotStatus(botId, 'healthy')
       return true
     } catch (err) {
-      BotService.setBotStatus(botId, 'error')
-
       this.logger
         .forBot(botId)
         .attachError(err)
@@ -758,17 +756,21 @@ export class BotService {
   }
 
   public static incrementBotStats(botId: string, type: 'error' | 'warning' | 'critical') {
-    const info = this._botHealth[botId] || DEFAULT_BOT_HEALTH
+    if (!this._botHealth[botId]) {
+      this._botHealth[botId] = DEFAULT_BOT_HEALTH
+    }
 
-    this._botHealth[botId] = {
-      ...info,
-      errorCount: info.errorCount + (type === 'error' ? 1 : 0),
-      criticalCount: info.criticalCount + (type === 'critical' ? 1 : 0),
-      warningCount: info.warningCount + (type === 'warning' ? 1 : 0)
+    if (type === 'error') {
+      this._botHealth[botId].errorCount++
+    } else if (type === 'warning') {
+      this._botHealth[botId].warningCount++
+    } else if (type === 'critical') {
+      this._botHealth[botId].criticalCount++
+      this._botHealth[botId].status = 'unhealthy'
     }
   }
 
-  public static setBotStatus(botId: string, status: 'mounted' | 'unmounted' | 'disabled' | 'error') {
+  public static setBotStatus(botId: string, status: 'healthy' | 'unhealthy' | 'unmounted' | 'disabled') {
     this._botHealth[botId] = {
       ...(this._botHealth[botId] || DEFAULT_BOT_HEALTH),
       status

src/bp/ui-admin/src/Pages/Components/Dropdown.tsx

@@ -51,7 +51,7 @@ const Dropdown: FC<Props> = props => {
       }}
     >
       <Button
-        text={activeItem && activeItem.label}
+        text={props.small ? <small>{activeItem && activeItem.label}</small> : activeItem && activeItem.label}
         icon={props.icon}
         rightIcon={props.rightIcon || 'double-caret-vertical'}
         small={props.small}

src/bp/ui-admin/src/Pages/Server/BotHealth.tsx

@@ -12,6 +12,9 @@ import { switchWorkspace } from '~/reducers/user'
 import { toastFailure, toastSuccess } from '~/utils/toaster'
 import { getActiveWorkspace } from '~/Auth'
 
+import Dropdown, { Option } from '../Components/Dropdown'
+import { filterText } from '../Logs/utils'
+
 type Props = {
   health?: ServerHealth[]
   botsByWorkspace?: { [workspaceId: string]: string[] }
@@ -22,6 +25,14 @@ type Props = {
 
 const getKey = entry => `${entry.hostname} (${entry.serverId})`
 
+const STATUS: Option[] = [
+  { label: 'All', value: '' },
+  { label: 'Healthy', value: 'healthy' },
+  { label: 'Unhealthy', value: 'unhealthy' },
+  { label: 'Disabled', value: 'disabled' },
+  { label: 'Unmounted', value: 'unmounted' }
+]
+
 const BotHealth: FC<Props> = props => {
   const [data, setData] = useState<any>()
   const [columns, setColumns] = useState<any>([])
@@ -53,6 +64,10 @@ const BotHealth: FC<Props> = props => {
     setData(data)
   }
 
+  const filterStatus = ({ onChange }) => {
+    return <Dropdown items={STATUS} defaultItem={STATUS[0]} onChange={option => onChange(option.value)} small />
+  }
+
   const goToBotLogs = async (botId: string) => {
     if (props.botsByWorkspace) {
       const workspace = _.findKey(props.botsByWorkspace, x => x.includes(botId))
@@ -76,25 +91,22 @@ const BotHealth: FC<Props> = props => {
           {
             Header: 'Status',
             Cell: cell => {
-              const hasCriticalIssue = !!Object.values(cell.original.data).find((x: any) => x.criticalCount > 0)
-              if (hasCriticalIssue) {
-                return <span className="logCritical">Unhealthy</span>
-              }
-
               switch (_.get(cell.original, `data[${key}].status`)) {
                 default:
                   return 'N/A'
-                case 'error':
-                  return <span className="logError">Error</span>
-                case 'mounted':
+                case 'unhealthy':
+                  return <span className="logCritical">Unhealthy</span>
+                case 'healthy':
                   return <span className="logInfo">Healthy</span>
                 case 'disabled':
                   return 'Disabled'
                 case 'unmounted':
                   return 'Unmounted'
               }
             },
-            width: 80,
+            Filter: filterStatus,
+            filterable: true,
+            width: 100,
             accessor: `data[${key}].status`
           },
           {
@@ -134,7 +146,9 @@ const BotHealth: FC<Props> = props => {
             </span>
           )
         },
-        width: 250
+        width: 250,
+        Filter: filterText,
+        filterable: true
       },
       ...hostColumns,
       {
@@ -168,7 +182,13 @@ const BotHealth: FC<Props> = props => {
   }
 
   return (
-    <ReactTable columns={columns} data={data} defaultPageSize={10} className="-striped -highlight monitoringOverview" />
+    <ReactTable
+      columns={columns}
+      data={data}
+      defaultPageSize={10}
+      defaultSorted={[{ id: 'botId', desc: false }]}
+      className="-striped -highlight monitoringOverview"
+    />
   )
 }
 

src/bp/ui-admin/src/Pages/Workspace/Bots/index.tsx

@@ -10,13 +10,13 @@ import {
   Position
 } from '@blueprintjs/core'
 import { BotConfig } from 'botpress/sdk'
+import { confirmDialog } from 'botpress/shared'
 import { ServerHealth } from 'common/typings'
 import _ from 'lodash'
 import React, { Component, Fragment } from 'react'
 import { connect } from 'react-redux'
 import { generatePath, RouteComponentProps } from 'react-router'
 import { Alert, Col, Row } from 'reactstrap'
-import { confirmDialog } from 'botpress/shared'
 import { toastSuccess } from '~/utils/toaster'
 import { toastFailure } from '~/utils/toaster'
 import { filterList } from '~/utils/util'
@@ -178,7 +178,7 @@ class Bots extends Component<Props> {
 
     return _.some(
       this.props.health.map(x => x.bots[botId]),
-      s => s && s.status === 'error'
+      s => s && s.status === 'unhealthy'
     )
   }