From 41b9e38085ada88ee932399ef4b612a5fd00fc04 Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Mon, 14 Apr 2025 11:36:50 +0200
Subject: [PATCH] feat(ui): improve session count display and filter logic

- Added `flex-shrink-0` class to session count text in
  `CardSessionsByList` for better layout handling.
- Introduced conditional filter logic in `SessionsBy` to handle
  `FETCH` metric with specific `FETCH_URL` filter.
- Removed unused filter mapping logic for cleaner code.

This improves UI consistency and enhances filter functionality.
---
 .../Dashboard/Widgets/CardSessionsByList.tsx  |  2 +-
 .../CustomMetricsWidgets/SessionsBy.tsx       | 19 +++++++++++++++----
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/frontend/app/components/Dashboard/Widgets/CardSessionsByList.tsx b/frontend/app/components/Dashboard/Widgets/CardSessionsByList.tsx
index 5f2efe77d..4ebb9e814 100644
--- a/frontend/app/components/Dashboard/Widgets/CardSessionsByList.tsx
+++ b/frontend/app/components/Dashboard/Widgets/CardSessionsByList.tsx
@@ -57,7 +57,7 @@ function CardSessionsByList({ list, selected, paginated, onClickHandler = () =>
                   <div className="m-0">
                     <div className="flex justify-between m-0 p-0">
                       <Typography.Text ellipsis={true}>{row.displayName}</Typography.Text>
-                      <Typography.Text type="secondary"> {row.sessionCount}</Typography.Text>
+                      <Typography.Text type="secondary" className="flex-shrink-0"> {row.sessionCount}</Typography.Text>
                     </div>
 
                     <Progress
diff --git a/frontend/app/components/Dashboard/Widgets/CustomMetricsWidgets/SessionsBy.tsx b/frontend/app/components/Dashboard/Widgets/CustomMetricsWidgets/SessionsBy.tsx
index b54b8c563..4cdf1d8dc 100644
--- a/frontend/app/components/Dashboard/Widgets/CustomMetricsWidgets/SessionsBy.tsx
+++ b/frontend/app/components/Dashboard/Widgets/CustomMetricsWidgets/SessionsBy.tsx
@@ -7,6 +7,7 @@ import { ArrowRight } from 'lucide-react';
 import CardSessionsByList from 'Components/Dashboard/Widgets/CardSessionsByList';
 import { useModal } from 'Components/ModalContext';
 import Widget from '@/mstore/types/widget';
+import { FilterKey } from 'Types/filter/filterType';
 
 interface Props {
   metric?: any;
@@ -27,12 +28,22 @@ function SessionsBy(props: Props) {
       ...filtersMap[metric.metricOf],
       value: [data.name],
       type: filtersMap[metric.metricOf].key,
-      filters: filtersMap[metric.metricOf].filters?.map((f: any) => {
-        const { key, operatorOptions, category, icon, label, options, ...cleaned } = f;
-        return { ...cleaned, type: f.key, value: [] };
-      })
+      filters: [],
     };
 
+    if (metric.metricOf === FilterKey.FETCH) {
+      baseFilter.filters = [
+        {
+          key: FilterKey.FETCH_URL,
+          operator: 'is',
+          value: [data.name],
+          type: FilterKey.FETCH_URL,
+        }
+      ];
+    }
+
+
+
     const { key, operatorOptions, category, icon, label, options, ...finalFilter } = baseFilter;
 
     setSelected(data.name);