Fixed vunterabilities when npm install

Author: lumburovskalina

package.json

@@ -24,8 +24,7 @@
     "autoprefixer": "^10.4.19",
     "chart.js": "^4.4.3",
     "clsx": "^1.2.1",
-    "d3": "^7.8.5",
-    "d3v4": "^4.2.2",
+    "d3": "^7.9.0",
     "eslint": "9.14.0",
     "eslint-config-next": "15.0.3",
     "focus-visible": "^5.2.0",

src/components/projects/projectId/overview/charts/LabelDistributionBarChart.tsx

@@ -3,7 +3,7 @@ import style from "@/src/styles/components/projects/projectId/project-overview.m
 import { useEffect, useRef, useState } from "react";
 import { changeDataStructure, squashData } from "@/src/util/components/projects/projectId/project-overview/charts-helper";
 import { ChartData } from "chart.js";
-import * as d3 from 'd3v4';
+import * as d3 from 'd3';
 
 export default function LabelDistributionBarChart(props: BarChartProps) {
 
@@ -183,11 +183,12 @@ export default function LabelDistributionBarChart(props: BarChartProps) {
             .on("mouseover", function (d) {
                 divTooltip.style("opacity", 1);
             })
-            .on("mousemove", function (d) {
-                divTooltip.style("left", d3.event.pageX + 10 + "px")
-                divTooltip.style("top", d3.event.pageY - 25 + "px")
-                divTooltip.style("display", "inline-block")
-                divTooltip.style("opacity", "0.9");
+            .on("mousemove", function (event) {
+                divTooltip.style("left", (event.pageX + 10) + "px")
+                    .style("top", (event.pageY - 25) + "px")
+                    .style("display", "inline-block")
+                    .style("opacity", "0.9");
+
                 var elements = document.querySelectorAll("#horizontal-grouped-bar :hover");
                 var l = elements.length - 1;