feat: add all resource kind constant

Author: arunjaindev

package-lock.json

@@ -1,6 +1,6 @@
 {
     "name": "@devtron-labs/devtron-fe-common-lib",
-    "version": "0.5.8",
+    "version": "0.5.8-beta-4",
     "description": "Supporting common component library",
     "type": "module",
     "main": "dist/index.js",

package.json

@@ -22,7 +22,7 @@ import { ReactComponent as InfoIcon } from '../../../Assets/Icon/ic-info-filled.
 import { ReactComponent as Chat } from '../../../Assets/Icon/ic-chat-circle-dots.svg'
 import { AppStatusDetailsChartType, AggregatedNodes, STATUS_SORTING_ORDER, NodeFilters } from './types'
 import { StatusFilterButtonComponent } from './StatusFilterButtonComponent'
-import { DEPLOYMENT_STATUS, APP_STATUS_HEADERS, ComponentSizeType } from '../../constants'
+import { DEPLOYMENT_STATUS, APP_STATUS_HEADERS, ComponentSizeType, ALL_RESOURCE_KIND_FILTER } from '../../constants'
 import { IndexStore } from '../../Store'
 import { aggregateNodes } from '../../Helpers'
 import { Button, ButtonStyleType, ButtonVariantType } from '../Button'
@@ -35,7 +35,7 @@ const AppStatusDetailsChart = ({
 }: AppStatusDetailsChartType) => {
     const history = useHistory()
     const _appDetails = IndexStore.getAppDetails()
-    const [currentFilter, setCurrentFilter] = useState<string>('all')
+    const [currentFilter, setCurrentFilter] = useState<string>(ALL_RESOURCE_KIND_FILTER)
     const [flattenedNodes, setFlattenedNodes] = useState([])
 
     const { appId, environmentId: envId } = _appDetails
@@ -125,7 +125,7 @@ const AppStatusDetailsChart = ({
                         flattenedNodes
                             .filter(
                                 (nodeDetails) =>
-                                    currentFilter === 'all' ||
+                                    currentFilter === ALL_RESOURCE_KIND_FILTER ||
                                     (currentFilter === NodeFilters.drifted && nodeDetails.hasDrift) ||
                                     nodeDetails.health.status?.toLowerCase() === currentFilter,
                             )

src/Shared/Components/CICDHistory/AppStatusDetailsChart.tsx

@@ -15,6 +15,7 @@
  */
 
 /* eslint-disable eqeqeq */
+import { ALL_RESOURCE_KIND_FILTER } from '@Shared/constants'
 import { ReactComponent as ICCaretDown } from '@Icons/ic-caret-down.svg'
 import { PopupMenu, StyledRadioGroup as RadioGroup } from '../../../Common'
 import { NodeFilters, NodeStatus, StatusFilterButtonType } from './types'
@@ -48,8 +49,12 @@ export const StatusFilterButtonComponent = ({ nodes, selectedTab, handleFilterCl
         allNodeCount += 1
     })
 
+    const handleInlineFilterClick = (e) => {
+        handleFilterClick(e.target.value)
+    }
+
     const filterOptions = [
-        { status: 'all', count: allNodeCount, isSelected: selectedTab == 'all' },
+        { status: ALL_RESOURCE_KIND_FILTER, count: allNodeCount, isSelected: selectedTab == ALL_RESOURCE_KIND_FILTER },
         { status: NodeStatus.Missing, count: missingNodeCount, isSelected: NodeStatus.Missing == selectedTab },
         { status: NodeStatus.Degraded, count: failedNodeCount, isSelected: NodeStatus.Degraded == selectedTab },
         {
@@ -108,7 +113,7 @@ export const StatusFilterButtonComponent = ({ nodes, selectedTab, handleFilterCl
                 name="status-filter-button"
                 initialTab={selectedTab}
                 disabled={false}
-                onChange={(e) => handleFilterClick(e.target.value)}
+                onChange={handleInlineFilterClick}
             >
                 {displayedInlineFilters.map((filter, index) => (
                     <RadioGroup.Radio

src/Shared/Components/CICDHistory/StatusFilterButtonComponent.tsx

@@ -497,3 +497,5 @@ export const DEFAULT_LOCKED_KEYS_CONFIG: Readonly<ConfigKeysWithLockType> = {
     config: [],
     allowed: false,
 }
+
+export const ALL_RESOURCE_KIND_FILTER = 'all'