changes in graph

ipi-survey-platform/src/pages/Admin/ValidationReview.jsx

@@ -318,72 +318,9 @@ const ProductChart = ({ product, establishmentId }) => {
       }
     },
     plugins: {
+      // Hide the default legend since we're using a custom ColorLegend component
       legend: {
-        position: 'top',
+        display: false
-        align: 'center',
-        labels: {
-          usePointStyle: true,
-          boxWidth: 12,
-          boxHeight: 12,
-          padding: 12,
-          font: {
-            size: 12,
-            lineHeight: '16px'
-          },
-          generateLabels: function(chart) {
-            const data = chart.data;
-            if (data.labels.length && data.datasets.length) {
-              return chart.data.datasets.map((dataset, i) => {
-                const meta = chart.getDatasetMeta(i);
-                let label = dataset.label || '';
-                label = '   ' + label.trim();
-
-                // For Annual Capacity (dashed line)
-                if (label.includes('Annual Capacity')) {
-                  return {
-                    text: label,
-                    fillStyle: 'transparent',
-                    hidden: !meta.visible,
-                    lineDash: [3, 3],
-                    lineWidth: 2,
-                    strokeStyle: dataset.borderColor,
-                    pointStyle: 'line',
-                    rotation: 0,
-                    datasetIndex: i
-                  };
-                }
-                
-                // For Quantity (solid line)
-                if (label.includes('Quantity')) {
-                  return {
-                    text: label,
-                    fillStyle: 'transparent',
-                    hidden: !meta.visible,
-                    lineDash: [],
-                    lineWidth: 2,
-                    strokeStyle: dataset.borderColor,
-                    pointStyle: 'line',
-                    rotation: 0,
-                    datasetIndex: i
-                  };
-                }
-                
-                // For bar items (Previous, Current, Forecast) - square boxes
-                return {
-                  text: label,
-                  fillStyle: dataset.backgroundColor,
-                  hidden: !meta.visible,
-                  lineWidth: 0,
-                  strokeStyle: 'transparent',
-                  pointStyle: 'rect',
-                  rotation: 0,
-                  datasetIndex: i
-                };
-              });
-            }
-            return [];
-          }
-        }
       },
       tooltip: {
         callbacks: {
@@ -438,7 +375,7 @@ const ProductChart = ({ product, establishmentId }) => {
     );
   }
 
-  // Color legend component
+  // Color legend component - This is the only legend we want to show
   const ColorLegend = () => (
     <div className="flex flex-wrap gap-6 mb-4 p-3 bg-gray-50 rounded-md">
       <div className="flex items-center">