Update ui.js

ui.js

@@ -108,36 +108,33 @@ function renderProductionHistoryChart() {
             .reduce((sum, entry) => sum + entry.quantity, 0);
         data.push(totalProduced);
     }
-
+    
     if (productionChart) {
-        productionChart.data.labels = labels;
-        productionChart.data.datasets[0].data = data;
-        productionChart.update();
-    } else {
-        productionChart = new Chart(ctx, {
-            type: 'bar',
-            data: {
-                labels: labels,
-                datasets: [{
-                    label: 'Complete Units Produced',
-                    data: data,
-                    backgroundColor: 'rgba(66, 153, 225, 0.5)',
-                    borderColor: 'rgba(66, 153, 225, 1)',
-                    borderWidth: 1,
-                    borderRadius: 4,
-                }]
-            },
-            options: {
-                responsive: true,
-                maintainAspectRatio: false,
-                plugins: { legend: { display: false } },
-                scales: {
-                    y: { beginAtZero: true, grid: { color: 'hsl(220, 13%, 30%)' } },
-                    x: { grid: { display: false } }
-                }
-            }
-        });
+        productionChart.destroy(); // BUG FIX: Destroy old chart instance
     }
+    productionChart = new Chart(ctx, {
+        type: 'bar',
+        data: {
+            labels: labels,
+            datasets: [{
+                label: 'Complete Units Produced',
+                data: data,
+                backgroundColor: 'rgba(66, 153, 225, 0.5)',
+                borderColor: 'rgba(66, 153, 225, 1)',
+                borderWidth: 1,
+                borderRadius: 4,
+            }]
+        },
+        options: {
+            responsive: true,
+            maintainAspectRatio: false,
+            plugins: { legend: { display: false } },
+            scales: {
+                y: { beginAtZero: true, grid: { color: 'hsl(220, 13%, 30%)' } },
+                x: { grid: { display: false } }
+            }
+        }
+    });
 }
 
 function renderInventoryStatusChart() {
@@ -156,25 +153,23 @@ function renderInventoryStatusChart() {
         datasets: [{
             data: [okCount, warningCount, criticalCount],
             backgroundColor: [ 'hsla(145, 63%, 49%, 0.7)', 'hsla(50, 91%, 64%, 0.7)', 'hsla(0, 89%, 69%, 0.7)' ],
-            borderColor: 'hsl(220, 26%, 18%)', // --bg-panel
+            borderColor: 'hsl(220, 26%, 18%)',
             borderWidth: 2
         }]
     };
 
     if (inventoryChart) {
-        inventoryChart.data.datasets[0].data = [okCount, warningCount, criticalCount];
-        inventoryChart.update();
-    } else {
-        inventoryChart = new Chart(ctx, {
-            type: 'doughnut',
-            data: data,
-            options: {
-                responsive: true,
-                maintainAspectRatio: false,
-                plugins: { legend: { position: 'top', labels: { color: 'hsl(210, 14%, 66%)' } } }
-            }
-        });
+        inventoryChart.destroy(); // BUG FIX: Destroy old chart instance
     }
+    inventoryChart = new Chart(ctx, {
+        type: 'doughnut',
+        data: data,
+        options: {
+            responsive: true,
+            maintainAspectRatio: false,
+            plugins: { legend: { position: 'top', labels: { color: 'hsl(210, 14%, 66%)' } } }
+        }
+    });
 }
 
 function renderModals() {