fix

public/locales/en/translations.json

@@ -66,6 +66,17 @@
     },
     "MessageForAuthor": "Message for author"
   },
+  "Charts": {
+    "Server": {
+      "Sessions": {
+        "RunningTime": {
+          "Title": "Sessions running time",
+          "X": "Running time",
+          "Y": "Sessions"
+        }
+      }
+    }
+  },
   "Notifications": {
     "MessageSaved": "Message saved"
   }

public/locales/ro/translations.json

@@ -57,6 +57,17 @@
     },
     "MessageForAuthor": "Mesaj pentru autor"
   },
+  "Charts": {
+    "Server": {
+      "Sessions": {
+        "RunningTime": {
+          "Title": "Timp de rulare sesiuni",
+          "X": "Timp de rulare",
+          "Y": "Sesiuni"
+        }
+      }
+    }
+  },
   "Notifications": {
     "MessageSaved": "Mesaj salvat"
   }

src/features/charts/server/components/SessionsRunningTimeChart.js

@@ -4,6 +4,7 @@ import { useTranslation } from "react-i18next";
 import CanvasJSReact from "../../../../assets/js/canvasjs.react";
 var CanvasJSChart = CanvasJSReact.CanvasJSChart;
 var CanvasJS = CanvasJSReact.CanvasJS;
+import Spinner from "../../../../components/common/Spinner";
 
 const SessionsRunningTimeChart = ({ data }) => {
   const { t } = useTranslation();
@@ -25,16 +26,16 @@ const SessionsRunningTimeChart = ({ data }) => {
     animationEnabled: true,
     theme: "light2",
     title: {
-      text: "Sessions running time",
+      text: t("Charts.Server.Sessions.RunningTime.Title"),
       fontSize: 20
     },
     axisX: {
-      title: "Sessions",
+      title: t("Charts.Server.Sessions.RunningTime.Y"),
       reversed: true,
       interval: 1
     },
     axisY: {
-      title: "Running time",
+      title: t("Charts.Server.Sessions.RunningTime.X"),
       labelFormatter: addSymbols
     },
     data: [
@@ -47,13 +48,13 @@ const SessionsRunningTimeChart = ({ data }) => {
   };
 
   return (
-    <div>
+    <>
-      <CanvasJSChart
+      {data.loading || !data.loaded ? (
-        options={options}
+        <Spinner />
-        /* onRef={ref => this.chart = ref} */
+      ) : (
-      />
+        <CanvasJSChart options={options} />
-      {/*You can get reference to the chart instance as shown above using onRef. This allows you to access all chart properties and methods*/}
+      )}
-    </div>
+    </>
   );
 };
 

src/features/server/components/ServerComponent.js

@@ -90,34 +90,6 @@ const ServerComponent = ({
       <Collapse in={expanded} timeout="auto" unmountOnExit>
         <CardContent>
           <ServerChartsContainer />
-
-          <Typography paragraph>Method:</Typography>
-          <Typography paragraph>
-            Heat 1/2 cup of the broth in a pot until simmering, add saffron and
-            set aside for 10 minutes.
-          </Typography>
-          <Typography paragraph>
-            Heat oil in a (14- to 16-inch) paella pan or a large, deep skillet
-            over medium-high heat. Add chicken, shrimp and chorizo, and cook,
-            stirring occasionally until lightly browned, 6 to 8 minutes.
-            Transfer shrimp to a large plate and set aside, leaving chicken and
-            chorizo in the pan. Add pimentón, bay leaves, garlic, tomatoes,
-            onion, salt and pepper, and cook, stirring often until thickened and
-            fragrant, about 10 minutes. Add saffron broth and remaining 4 1/2
-            cups chicken broth; bring to a boil.
-          </Typography>
-          <Typography paragraph>
-            Add rice and stir very gently to distribute. Top with artichokes and
-            peppers, and cook without stirring, until most of the liquid is
-            absorbed, 15 to 18 minutes. Reduce heat to medium-low, add reserved
-            shrimp and mussels, tucking them down into the rice, and cook again
-            without stirring, until mussels have opened and rice is just tender,
-            5 to 7 minutes more. (Discard any mussels that don’t open.)
-          </Typography>
-          <Typography>
-            Set aside off of the heat to let rest for 10 minutes, and then
-            serve.
-          </Typography>
         </CardContent>
       </Collapse>
     </Card>