use active memory in systemmonitor

Author: AnthonyGress

Dockerfile

@@ -11,7 +11,7 @@ WORKDIR /usr/src/app
 COPY ./frontend ./
 RUN npm install
 ENV NODE_ENV=production
-RUN npm run build:dev
+RUN npm run build
 
 # Deploy (Backend)
 FROM --platform=linux/amd64 node:lts-slim AS backend-deploy

frontend/src/components/widgets/SystemMonitorWidget/GaugeWidget.tsx

@@ -12,13 +12,14 @@ interface GaugeWidgetProps {
   title: string;
   size?: number;
   temperature?: boolean;
+  total?: number;
 }
 
-export const GaugeWidget: React.FC<GaugeWidgetProps> = ({ value, title, size, temperature }) => {
+export const GaugeWidget: React.FC<GaugeWidgetProps> = ({ value, title, size, temperature, total }) => {
     return (
         <Box position='relative' display='inline-flex'>
             {/* Gauge Chart */}
-            <Gauge value={value} valueMax={100} startAngle={-150} endAngle={150} cornerRadius='50%' sx={(theme) => (
+            <Gauge value={value} valueMax={total ? total : 100} startAngle={-150} endAngle={150} cornerRadius='50%' sx={(theme) => (
                 { '& .MuiGauge-valueText': { display: 'none' },
                     [`& .${gaugeClasses.valueArc}`]: {
                         fill: 'primary.main',

frontend/src/components/widgets/SystemMonitorWidget/SystemMonitorWidget.tsx

@@ -27,8 +27,11 @@ export const SystemMonitorWidget = () => {
 
     const getRamPercentage = (systemData: any) => {
         let totalPercentage = 0;
-        if (systemData?.memory?.total && systemData?.memory?.used) {
-            totalPercentage = Math.round((systemData.memory.used / systemData.memory.total) * 100);
+
+        console.log(convertBytesToGB(systemData?.memory?.active));
+
+        if (systemData?.memory?.total && systemData?.memory?.active) {
+            totalPercentage = Math.round((systemData.memory.active / systemData.memory.total) * 100);
         }
         setMemoryInformation(totalPercentage);
     };

frontend/tsconfig.app.json

@@ -19,8 +19,8 @@
     "jsx": "react-jsx",
     /* Linting */
     "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
+    "noUnusedLocals": false,
+    "noUnusedParameters": false,
     "noFallthroughCasesInSwitch": true,
     "noUncheckedSideEffectImports": true,
   },