feat(Analytics): add yAxis configuration for Task D with titles for capitation, volume, and average

Author: jalezi

src/locales/en.json

@@ -161,7 +161,12 @@
             "title": "Task C title"
         },
         "taskD": {
-            "title": "Task D title"
+            "title": "Task D title",
+            "yAxis": {
+                "capitationTitle": "glavarina",
+                "volTitle": "percent",
+                "avgTitle": "percent"
+            }
         }
     }
 }

src/locales/sl.json

@@ -163,7 +163,12 @@
             "title": "Task C naslov"
         },
         "taskD": {
-            "title": "Primerjava glede na lastništvo"
+            "title": "Primerjava glede na lastništvo",
+            "yAxis": {
+                "capitationTitle": "glavarina",
+                "volTitle": "odstotek",
+                "avgTitle": "odstotek"
+            }
         }
     }
 }

src/pages/Analytics/Cards/prod/TaskD/index.jsx

@@ -33,16 +33,17 @@ const PivotkeD = function PivotkeD({ id }) {
     group: groupOptions[0].options[0].group,
   });
 
-  const translations = t('analytics.taskD', { returnObjects: true });
+  const tTaskD = t('analytics.taskD', { returnObjects: true });
 
   useEffect(() => {
     if (!init) {
       setInit(true);
     }
   }, [init]);
 
+  /** @type {TaskDTypes.ParsedData} */
   const data = useMemo(() => parsedData[filterState.data], [filterState.data]);
-
+  const yAxisTitle = t(`analytics.taskD.yAxis.${filterState.group}Title`);
   useEffect(() => {
     if (!init) return;
 
@@ -64,12 +65,17 @@ const PivotkeD = function PivotkeD({ id }) {
       xAxis: {
         tickPositions,
       },
+      yAxis: {
+        title: {
+          text: yAxisTitle,
+        },
+      },
       series: [
-        { name: 'Javni', data: data.public },
-        { name: 'Zasebni', data: data.private },
+        { name: t('analytics.common.contractTypes.public'), data: data.public },
+        { name: t('analytics.common.contractTypes.private'), data: data.private },
       ],
     });
-  }, [init, data]);
+  }, [init, data, yAxisTitle]);
 
   const onFormChange = e => {
     const { name, value } = e;
@@ -79,7 +85,7 @@ const PivotkeD = function PivotkeD({ id }) {
   return (
     <Card id={id}>
       <CardHeader>
-        <CardTitle>{translations.title}</CardTitle>
+        <CardTitle>{tTaskD.title}</CardTitle>
       </CardHeader>
       <CardContent>
         <FilterForm filterState={filterState} onFormChange={onFormChange} />

src/pages/Analytics/Cards/prod/TaskD/parsed-files.js

@@ -47,6 +47,7 @@ export const groupOptions = Object.entries(dataGroups)
   }))
   .sort((a, b) => groupOrder[a.label] - groupOrder[b.label]);
 
+/** @type {Record<TaskDTypes.FileKey, TaskDTypes.ParsedData} */
 export const parsedData = Object.entries(files)?.reduce((acc, [fileName, items]) => {
   const data = { public: [], private: [] };
   items.forEach(item => {

src/pages/Analytics/Cards/prod/TaskD/types.js

@@ -24,6 +24,9 @@
  *
  * @typedef {[Timestamp, number]} ParsedDataItem - The parsed data item as a tuple of timestamp and value.
  *
+ * @typedef {Object} ParsedData - The parsed data object.
+ * @property {ParsedDataItem[]} public - The public data.
+ * @property {ParsedDataItem[]} private - The private data.
  */
 
 export default {};