fix: sonar issues

apps/web/locales/en-US.json

@@ -694,6 +694,7 @@
         "no_valid_data_to_display": "No valid data to display",
         "not_contains": "not contains",
         "not_equals": "not equals",
+        "open_chart": "Open chart {{name}}",
         "open_options": "Open chart options",
         "or_filter_logic": "OR",
         "original": "Original",

apps/web/modules/ee/analysis/charts/components/chart-renderer.tsx

@@ -57,12 +57,7 @@ function CartesianChartTooltip({
   dataKey,
   formatXAxisTick,
 }: Readonly<{ dataKey: string; formatXAxisTick: (value: unknown) => string }>) {
-  return (
-    <ChartTooltipContent
-      labelFormatter={(val) => formatXAxisTick(val)}
-      formatter={createTooltipFormatter(dataKey)}
-    />
-  );
+  return <ChartTooltipContent labelFormatter={formatXAxisTick} formatter={createTooltipFormatter(dataKey)} />;
 }
 
 interface ChartRendererProps {

apps/web/modules/ee/analysis/charts/components/charts-list-skeleton.tsx

@@ -1,4 +1,5 @@
 const SKELETON_ROWS = 5;
+const SKELETON_ROW_KEYS = Array.from({ length: SKELETON_ROWS }, (_, i) => `skeleton-row-${i}`);
 
 function SkeletonRow() {
   return (
@@ -31,8 +32,8 @@ export function ChartsListSkeleton() {
         <div className="col-span-1 hidden text-center sm:block">Updated</div>
         <div className="col-span-1" />
       </div>
-      {Array.from({ length: SKELETON_ROWS }).map((_, i) => (
-        <SkeletonRow key={i} />
+      {SKELETON_ROW_KEYS.map((key) => (
+        <SkeletonRow key={key} />
       ))}
     </div>
   );

apps/web/modules/ee/analysis/charts/components/charts-list.tsx

@@ -35,6 +35,13 @@ export function ChartsList({ charts, environmentId }: Readonly<ChartsListProps>)
     setEditingChartId(undefined);
   };
 
+  const handleRowKeyDown = (e: React.KeyboardEvent, chartId: string) => {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      handleChartClick(chartId);
+    }
+  };
+
   return (
     <div className="rounded-xl border border-slate-200 bg-white shadow-sm">
       <div className="grid h-12 grid-cols-7 content-center border-b text-left text-sm font-semibold text-slate-900">
@@ -51,9 +58,15 @@ export function ChartsList({ charts, environmentId }: Readonly<ChartsListProps>)
       ) : (
         <>
           {filteredCharts.map((chart) => (
+            // Cannot use native <button>; row contains dropdown trigger (nested interactive invalid)
+            // eslint-disable-next-line jsx-a11y/prefer-tag-over-role, jsx-a11y/no-static-element-interactions
             <div
               key={chart.id}
+              role="button"
+              tabIndex={0}
               onClick={() => handleChartClick(chart.id)}
+              onKeyDown={(e) => handleRowKeyDown(e, chart.id)}
+              aria-label={t("environments.analysis.charts.open_chart", { name: chart.name })}
               className="grid h-12 w-full cursor-pointer grid-cols-7 content-center p-2 text-left transition-colors ease-in-out hover:bg-slate-100">
               <div className="col-span-3 flex items-center pl-6 text-sm">
                 <div className="flex items-center gap-4">
@@ -80,9 +93,7 @@ export function ChartsList({ charts, environmentId }: Readonly<ChartsListProps>)
                   }).replace("about", "")}
                 </div>
               </div>
-              <div
-                className="col-span-1 my-auto flex items-center justify-end pr-6"
-                onClick={(e) => e.stopPropagation()}>
+              <div className="col-span-1 my-auto flex items-center justify-end pr-6">
                 <ChartDropdownMenu
                   environmentId={environmentId}
                   chart={chart}

apps/web/modules/ee/analysis/charts/components/measures-panel.tsx

@@ -50,7 +50,7 @@ export function MeasuresPanel({
     onCustomMeasuresChange([
       ...customMeasures,
       {
-        id: `measure-${Date.now()}-${Math.random().toString(36).slice(2, 9)}`,
+        id: `measure-${crypto.randomUUID()}`,
         field: dimensionOptions[0]?.value || "",
         aggregation: "avg",
       },

apps/web/modules/ee/contacts/segments/lib/utils.test.ts

@@ -75,7 +75,7 @@ const createBaseFilter = (
   connector: "and" | "or" | null = "and",
   id?: string
 ): TBaseFilter => ({
-  id: id ?? (isResourceFilter(resource) ? resource.id : `group-${Math.random()}`), // Use filter ID or random for group
+  id: id ?? (isResourceFilter(resource) ? resource.id : `group-${crypto.randomUUID()}`), // Use filter ID or UUID for group
   connector,
   resource,
 });