diff --git a/src/App.js b/src/App.js
index daab6d7..d057983 100644
--- a/src/App.js
+++ b/src/App.js
@@ -8,9 +8,9 @@ import 'bootstrap/dist/css/bootstrap.min.css';
import {OdinApp, StatusBox, useAdapterEndpoint, TitleCard, DropdownSelector, WithEndpoint, ToggleSwitch, OdinGraph, OdinDoubleSlider} from 'odin-react';
import 'odin-react/dist/index.css'
-import {StatusBadge, LOKIConnectionAlert, LOKIClockGenerator, LOKICarrierInfo, LOKIEnvironment, LOKICarrierTaskStatus} from './Loki.js'
+import {StatusBadge, LOKIConnectionAlert, LOKIClockGenerator, LOKICarrierInfo, LOKIEnvironment, LOKICarrierTaskStatus, LOKIPerformanceDisplay} from './Loki.js'
-import {Row, Col, Container, Dropdown, Card, Alert, Button, Spinner, Image} from 'react-bootstrap'
+import {Row, Col, Container, Dropdown, Card, Alert, Button, Spinner, Image, Accordion} from 'react-bootstrap'
import * as Icon from 'react-bootstrap-icons';
import Mermaid from "./Mermaid";
@@ -99,6 +99,9 @@ function BabyD() {
+
+
+
@@ -235,10 +238,17 @@ function BabyDSystemStatus({adapterEndpoint, loki_connection_state, asic_enabled
{latest_main_enable && }
+
+
+
+
+
+
+
@@ -716,4 +726,69 @@ function BabyDLaneConfig({adapterEndpoint, asic_enabled}) {
)
}
+const CacheEnEndpointToggleSwitch = WithEndpoint(ToggleSwitch);
+function BabyDCacheHits({adapterEndpoint, asic_enabled}) {
+
+ if (!asic_enabled) {
+ return (<>);
+ }
+
+ let cache_info = adapterEndpoint.data?.application?.info?.asic_cache_hitrate;
+
+ console.log('cache info', cache_info);
+
+ let cache_toggleswitch = (<>
+
+
+
+
+ {(adapterEndpoint.data.application?.info?.asic_cache_allowed !== adapterEndpoint.data.application?.info?.asic_cache_enabled) && Note: change will not take effect until ASIC is re-initialised}
+
+
+
+ );
+
+ let cache_info_accordion;
+ if (adapterEndpoint.data.application?.info?.asic_cache_enabled) {
+ cache_info_accordion = (<>
+
+
+
+ Cache Stats
+
+
+
+
+ {(cache_info.hitrate * 100).toFixed(2) + '%'}
+
+
+ {cache_info.hits}
+
+
+ {cache_info.misses}
+
+
+
+
+
+ );
+ } else {
+ cache_info_accordion = (<>);
+ }
+
+
+ if (typeof cache_info !== 'undefined' ) {
+ return (<>
+
+ {cache_toggleswitch}
+
+
+ {cache_info_accordion}
+
+ )
+ } else {
+ return (<>)
+ }
+}
+
export default BabyD;
diff --git a/src/Loki.js b/src/Loki.js
index d248034..04128f2 100644
--- a/src/Loki.js
+++ b/src/Loki.js
@@ -1,7 +1,9 @@
import React from 'react';
-import {DropdownSelector, WithEndpoint, TitleCard, OdinGraph} from 'odin-react';
-import {Dropdown, Row, Alert} from 'react-bootstrap';
+import {DropdownSelector, WithEndpoint, TitleCard, OdinGraph, StatusBox} from 'odin-react';
+import {Dropdown, Row, Col, Alert} from 'react-bootstrap';
+
+import Mermaid from "./Mermaid";
const ClkgenEndpointDropdown = WithEndpoint(DropdownSelector);
@@ -302,3 +304,99 @@ export function LOKICarrierTaskStatus({adapterEndpoint, loki_connection_state, s
)
}
+
+export function LOKIPerformanceDisplay({adapterEndpoint, show_cpu=true, show_cpu_times=true}) {
+
+ let perfinfo = adapterEndpoint.data.carrier_info?.performance;
+ console.log('performance info:', perfinfo);
+
+ return (
+
+
+ {show_cpu && }
+
+
+ {show_cpu && }
+
+
+ )
+}
+
+function LOKICPUInfo({cpuInfo, show_cpu_times=true, show_cpu_times_graph=false}) {
+
+ if (cpuInfo === null || typeof cpuInfo === 'undefined') {
+ return (<>)
+ }
+ console.log('cpu info: ', cpuInfo);
+
+ let cputimechart = `
+ pie showData
+ title Times
+ ` + Object.keys(cpuInfo.times).map((timename) => {
+ if (cpuInfo.times[timename] !== 0) {
+ return (`
+ "${timename}" : ${cpuInfo.times[timename]}
+ `)
+ } else {
+ return (``)
+ }
+ }).join('') + `
+ `
+
+ return(
+
+
+
+ {cpuInfo?.load}
+
+
+ {cpuInfo?.percent + "%"}
+
+
+
+
+
+
+ {Object.keys(cpuInfo.times).map((timename) => {
+ return (
+
+ {cpuInfo.times[timename]}
+
+ )
+ })}
+
+
+
+
+
+ {show_cpu_times_graph && }
+
+
+ )
+}
+
+function LOKIMemInfo({memInfo}) {
+ if (memInfo === null || typeof memInfo === 'undefined') {
+ return (<>)
+ }
+ console.log('mem info: ', memInfo);
+
+ return(
+
+
+
+ {Math.round(memInfo?.total/1000000) + "MB"}
+
+
+ {Math.round(memInfo?.avail/1000000) + "MB"}
+
+
+ {Math.round(memInfo?.cached/1000000) + "MB"}
+
+
+ {Math.round(memInfo?.free/1000000) + "MB"}
+
+
+
+ )
+}