diff --git a/packages/server-admin-ui/src/views/Dashboard/Dashboard.js b/packages/server-admin-ui/src/views/Dashboard/Dashboard.js index 345a4cd76..37339db06 100644 --- a/packages/server-admin-ui/src/views/Dashboard/Dashboard.js +++ b/packages/server-admin-ui/src/views/Dashboard/Dashboard.js @@ -34,6 +34,123 @@ const Dashboard = (props) => { if (errorCount > 0) { errors = `(${errorCount} errors)` } + + const getLinkType = (providerId) => { + try { + return providerStatus.find((item) => item.id === providerId).statusType + } catch (err) { + return 'provider' + } + } + + const inputPulseIconClass = (providerStats) => { + return ( + 'icon-login' + + (providerStats.deltaRate > 50 + ? ' text-primary fa-pulse-fast' + : providerStats.deltaRate > 0 + ? ' text-primary fa-pulse' + : '') + ) + } + + const outputPulseIconClass = (providerStats) => { + return ( + 'icon-logout' + + (providerStats.writeRate > 50 + ? ' text-primary fa-pulse-fast' + : providerStats.writeRate > 0 + ? ' text-primary fa-pulse' + : '') + ) + } + + const renderActivity = (providerId, providerStats, linkType) => { + return ( +
  • props.history.push(`/dashboard`)}> + + + + {linkType === 'plugin' + ? pluginNameLink(providerId) + : providerIdLink(providerId)} + + {providerStats.writeRate > 0 && ( + + {' '} + {providerStats.writeRate}{' '} + {'msg/s'}{' '} + + )} + {providerStats.deltaRate > 0 && providerStats.writeRate > 0 && ( + + {','} +   + + )} + {providerStats.deltaRate > 0 && ( + + {' '} + {providerStats.deltaRate}{' '} + + ({((providerStats.deltaRate / deltaRate) * 100).toFixed(0)} + %) + {' '} + {'deltas/s'}{' '} + + )} +
    + +
    +
  • + ) + } + + const renderStatus = (status, statusClass, lastError) => { + return ( + { + props.history.push( + '/serverConfiguration/' + + (status.statusType === 'plugin' ? 'plugins/' : 'connections/') + + status.id + ) + }} + > + + {status.statusType === 'plugin' + ? pluginNameLink(status.id) + : providerIdLink(status.id)} + + +

    {lastError}

    + + +

    + {(status.message || '').substring(0, 80)} + {status.message.length > 80 ? '...' : ''} +

    + + + ) + } + return (
    {props.websocketStatus === 'open' && ( @@ -73,106 +190,42 @@ const Dashboard = (props) => {
    -
    Connection activity
    +
    + Connections activity +
    + +

    +
    + {Object.keys(providerStatistics || {}).some( + (providerId) => getLinkType(providerId) === 'plugin' + ) + ? 'Plugins activity' + : null} +
    @@ -196,49 +249,19 @@ const Dashboard = (props) => { {providerStatus.map((status) => { - let statusClass - if (status.type === 'status') { - statusClass = 'text-success' - } else if (status.type === 'warning') { - statusClass = 'text-warning' - } else { - statusClass = 'text-danger' + const statusClasses = { + status: 'text-success', + warning: 'text-warning', + error: 'text-danger', } + const statusClass = statusClasses[status.type] const lastError = status.lastError && status.lastError != status.message ? status.lastErrorTimeStamp + ': ' + status.lastError : '' - return ( - { - props.history.push( - '/serverConfiguration/' + - (status.statusType === 'plugin' - ? 'plugins/' - : 'connections/') + - status.id - ) - }} - > - - {status.statusType === 'plugin' - ? pluginNameLink(status.id) - : providerIdLink(status.id)} - - -

    {lastError}

    - - -

    - {(status.message || '').substring(0, 80)} - {status.message.length > 80 ? '...' : ''} -

    - - - ) + return renderStatus(status, statusClass, lastError) })} @@ -263,7 +286,13 @@ function pluginNameLink(id) { } function providerIdLink(id) { - return {id} + if (id === 'defaults') { + return {id} + } else if (id.startsWith('ws.')) { + return {id} + } else { + return {id} + } } export default connect(