refactor: optimize SegmentedControl dependencies and enhance StatusFilterButtonComponent key handling

- Removed unnecessary dependency from SegmentedControl's useEffect for improved performance.
- Added a unique key to the SegmentedControl in StatusFilterButtonComponent to ensure proper re-rendering based on inline filters.

Author: AbhishekA1509

src/Common/SegmentedControl/SegmentedControl.component.tsx

@@ -34,7 +34,7 @@ const SegmentedControl = ({
             style.setProperty('--segmented-control-highlight-width', `${offsetWidth}px`)
             style.setProperty('--segmented-control-highlight-x-position', `${offsetLeft}px`)
         }
-    }, [segmentValue, size, fullWidth, segments.length])
+    }, [segmentValue, size, fullWidth])
 
     const handleSegmentChange = (updatedSegment: SegmentType) => {
         if (isUnControlledComponent) {

src/Shared/Components/CICDHistory/StatusFilterButtonComponent.tsx

@@ -104,9 +104,15 @@ export const StatusFilterButtonComponent = ({
 
     const segmentValue = segments.find(({ value }) => value === selectedTab)?.value || null
 
+    const segmentControlKey = inlineFilters.reduce<string>(
+        (acc, inlineFilter) => `${acc}-${inlineFilter.count}-${inlineFilter.status}`,
+        `${allResourceKindFilter.status}-${allResourceKindFilter.count}`,
+    )
+
     return (
         <div className="flexbox status-filter__container">
             <SegmentedControl
+                key={segmentControlKey}
                 segments={segments}
                 value={segmentValue}
                 onChange={handleInlineFilterClick}