Skip to content

Commit 8334364

Browse files
Elessar1802Elessar1802
committed
fix: review comments
1 parent a5ccc34 commit 8334364

File tree

12 files changed

+78
-64
lines changed

12 files changed

+78
-64
lines changed

‎src/components/ResourceBrowser/ResourceBrowser.service.tsx

Lines changed: 0 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -70,17 +70,6 @@ export const getNodeList = (
7070
},
7171
)
7272

73-
const cacheRepository: Record<string, any> = {}
74-
75-
export const cacheResult = async <T = any,>(name: string, promiseCallback: () => Promise<T>) => {
76-
if (cacheRepository[name]) {
77-
return cacheRepository[name] as T
78-
}
79-
const response = await promiseCallback()
80-
cacheRepository[name] = response
81-
return response
82-
}
83-
8473
export const getResourceData = async ({
8574
selectedResource,
8675
selectedNamespace,

‎src/components/ResourceBrowser/ResourceList/Cache.ts

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
class Cache {
2+
private static cacheRepository: Record<string, any> = {}
3+
4+
constructor() {
5+
Cache.cacheRepository = {}
6+
}
7+
8+
static get = async <T = any>(name: string, promiseCallback: () => Promise<T>) => {
9+
if (Cache.cacheRepository[name]) {
10+
return Cache.cacheRepository[name] as T
11+
}
12+
const response = await promiseCallback()
13+
Cache.cacheRepository[name] = response
14+
return response
15+
}
16+
17+
static clear = () => {
18+
Cache.cacheRepository = {}
19+
}
20+
}
21+
22+
export default Cache

‎src/components/ResourceBrowser/ResourceList/K8SResourceList.tsx

Lines changed: 5 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -30,11 +30,13 @@ import { getPodRestartRBACPayload } from '@Components/v2/appDetails/k8Resource/n
3030

3131
import { importComponentFromFELibrary } from '../../common/helpers/Helpers'
3232
import { SIDEBAR_KEYS } from '../Constants'
33-
import { cacheResult, getResourceData } from '../ResourceBrowser.service'
33+
import { getResourceData } from '../ResourceBrowser.service'
3434
import { K8SResourceListType } from '../Types'
3535
import { removeDefaultForStorageClass, sortEventListData } from '../Utils'
3636
import BaseResourceList from './BaseResourceList'
37-
import { K8sResourceListURLParams } from './types'
37+
import Cache from './Cache'
38+
import { K8sResourceListFilterType, K8sResourceListURLParams } from './types'
39+
import { parseK8sResourceListSearchParams } from './utils'
3840

3941
const PodRestart = importComponentFromFELibrary('PodRestart')
4042
const getFilterOptionsFromSearchParams = importComponentFromFELibrary(
@@ -43,16 +45,6 @@ const getFilterOptionsFromSearchParams = importComponentFromFELibrary(
4345
'function',
4446
)
4547

46-
interface K8sResourceListFilterType {
47-
selectedNamespace: string
48-
}
49-
50-
const parseK8sResourceListSearchParams = (searchParams: URLSearchParams): K8sResourceListFilterType => {
51-
const namespace = searchParams.get('namespace')
52-
const selectedNamespace = namespace ?? 'all'
53-
return { selectedNamespace }
54-
}
55-
5648
export const K8SResourceList = ({
5749
selectedResource,
5850
selectedCluster,
@@ -82,7 +74,7 @@ export const K8SResourceList = ({
8274
() =>
8375
abortPreviousRequests(async () => {
8476
if (selectedResource) {
85-
return cacheResult(location.pathname, () =>
77+
return Cache.get(location.pathname, () =>
8678
getResourceData({
8779
selectedResource,
8880
selectedNamespace,

‎src/components/ResourceBrowser/ResourceList/K8SResourceTabComponent.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,9 @@ import { useParams } from 'react-router-dom'
2020
import { abortPreviousRequests, ErrorScreenManager, noop, useAsync } from '@devtron-labs/devtron-fe-common-lib'
2121

2222
import { K8S_EMPTY_GROUP, ResourceBrowserTabsId } from '../Constants'
23-
import { cacheResult, getResourceGroupList } from '../ResourceBrowser.service'
23+
import { getResourceGroupList } from '../ResourceBrowser.service'
2424
import { K8SResourceTabComponentProps } from '../Types'
25+
import Cache from './Cache'
2526
import ConnectingToClusterState from './ConnectingToClusterState'
2627
import { K8SResourceList } from './K8SResourceList'
2728
import Sidebar from './Sidebar'
@@ -54,7 +55,7 @@ const K8SResourceTabComponent = ({
5455
() =>
5556
abortPreviousRequests(
5657
() =>
57-
cacheResult(`${clusterId}/k8s-object-map`, () =>
58+
Cache.get(`${clusterId}/k8s-object-map`, () =>
5859
getResourceGroupList(clusterId, abortControllerRef.current?.signal),
5960
),
6061
abortControllerRef,

‎src/components/ResourceBrowser/ResourceList/NodeDetailWrapper.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,8 @@ const NodeDetailWrapper = ({
2626
const updateTabUrlHandler: ClusterListType['updateTabUrl'] = (props) => updateTabUrl({ id, ...props })
2727

2828
useEffect(() => {
29+
// NOTE: when the component mounts, we select the tab as active
30+
// If the tab is not found, we add a new tab
2931
markTabActiveById(id)
3032
.then((wasFound) => {
3133
if (!wasFound) {

‎src/components/ResourceBrowser/ResourceList/ResourceFilterOptions.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,8 +32,9 @@ import { URLS } from '../../../config'
3232
import { convertToOptionsList, importComponentFromFELibrary } from '../../common'
3333
import { ShortcutKeyBadge } from '../../common/formFields/Widgets/Widgets'
3434
import { NAMESPACE_NOT_APPLICABLE_OPTION, NAMESPACE_NOT_APPLICABLE_TEXT } from '../Constants'
35-
import { cacheResult, namespaceListByClusterId } from '../ResourceBrowser.service'
35+
import { namespaceListByClusterId } from '../ResourceBrowser.service'
3636
import { ResourceFilterOptionsProps } from '../Types'
37+
import Cache from './Cache'
3738
import { K8sResourceListURLParams } from './types'
3839

3940
const FilterButton = importComponentFromFELibrary('FilterButton', null, 'function')
@@ -61,7 +62,7 @@ const ResourceFilterOptions = ({
6162
const showShortcutKey = !isInputFocused && !searchText
6263

6364
const [, namespaceByClusterIdList] = useAsync(
64-
() => cacheResult(`${clusterId}/namespaces`, () => namespaceListByClusterId(clusterId)),
65+
() => Cache.get(`${clusterId}/namespaces`, () => namespaceListByClusterId(clusterId)),
6566
[clusterId],
6667
)
6768

‎src/components/ResourceBrowser/ResourceList/ResourceList.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,7 @@ import { renderCreateResourceButton } from '../PageHeader.buttons'
5959
import { ClusterDetailBaseParams, ClusterOptionType, K8SResourceListType } from '../Types'
6060
import { getTabsBasedOnRole } from '../Utils'
6161
import AdminTerminal from './AdminTerminal'
62+
import Cache from './Cache'
6263
import ClusterSelector from './ClusterSelector'
6364
import ClusterUpgradeCompatibilityInfo from './ClusterUpgradeCompatibilityInfo'
6465
import K8SResourceTabComponent from './K8SResourceTabComponent'
@@ -153,6 +154,7 @@ const ResourceList = () => {
153154

154155
return () => {
155156
setIntelligenceConfig(null)
157+
Cache.clear()
156158
}
157159
}, [])
158160
useEffectAfterMount(() => initTabsBasedOnRole(true), [clusterId])

‎src/components/ResourceBrowser/ResourceList/types.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -99,3 +99,7 @@ export interface NodeDetailComponentWrapperProps
9999
export interface NodeDetailURLParams {
100100
name: string
101101
}
102+
103+
export interface K8sResourceListFilterType {
104+
selectedNamespace: string
105+
}

‎src/components/ResourceBrowser/ResourceList/utils.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ import {
2323
TARGET_K8S_VERSION_SEARCH_KEY,
2424
} from '../Constants'
2525
import { K8SResourceListType, ShowAIButtonConfig } from '../Types'
26-
import { ResourceListUrlFiltersType } from './types'
26+
import { K8sResourceListFilterType, ResourceListUrlFiltersType } from './types'
2727

2828
export const parseSearchParams = (searchParams: URLSearchParams) => ({
2929
targetK8sVersion: searchParams.get(TARGET_K8S_VERSION_SEARCH_KEY),
@@ -98,3 +98,9 @@ export const getShowAIButton = (aiButtonConfig: ShowAIButtonConfig, columnName:
9898
}
9999
return !aiButtonConfig.excludeValues.has(value)
100100
}
101+
102+
export const parseK8sResourceListSearchParams = (searchParams: URLSearchParams): K8sResourceListFilterType => {
103+
const namespace = searchParams.get('namespace')
104+
const selectedNamespace = namespace ?? 'all'
105+
return { selectedNamespace }
106+
}

‎src/components/v2/appDetails/k8Resource/nodeDetail/NodeDetail.component.tsx

Lines changed: 17 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -100,9 +100,9 @@ const NodeDetailComponent = ({
100100
const [isResourceDeleted, setResourceDeleted] = useState(false)
101101
const [isManagedFields, setManagedFields] = useState(false)
102102
const [hideManagedFields, setHideManagedFields] = useState(true)
103-
params.nodeType = params.kind ?? params.nodeType
103+
const nodeType = params.kind ?? params.nodeType
104104
const [fetchingResource, setFetchingResource] = useState(
105-
isResourceBrowserView && params.nodeType === Nodes.Pod.toLowerCase(),
105+
isResourceBrowserView && nodeType === Nodes.Pod.toLowerCase(),
106106
)
107107
const [selectedContainer, setSelectedContainer] = useState<Map<string, string>>(new Map())
108108
const [showEphemeralContainerDrawer, setShowEphemeralContainerDrawer] = useState<boolean>(false)
@@ -126,9 +126,9 @@ const NodeDetailComponent = ({
126126
const _selectedResource = useMemo(
127127
() =>
128128
lowercaseKindToResourceGroupMap[
129-
`${params.group === K8S_EMPTY_GROUP ? '' : params.group?.toLowerCase()}-${params.nodeType.toLowerCase()}`
129+
`${params.group === K8S_EMPTY_GROUP ? '' : params.group?.toLowerCase()}-${nodeType.toLowerCase()}`
130130
],
131-
[lowercaseKindToResourceGroupMap, params.nodeType, params.group],
131+
[lowercaseKindToResourceGroupMap, nodeType, params.group],
132132
)
133133

134134
const resourceName = isResourceBrowserView ? params.name : params.podName
@@ -147,7 +147,7 @@ const NodeDetailComponent = ({
147147
const currentResource = isResourceBrowserView
148148
? selectedResource
149149
: appDetails.resourceTree.nodes.filter(
150-
(data) => data.name === params.podName && data.kind.toLowerCase() === params.nodeType,
150+
(data) => data.name === params.podName && data.kind.toLowerCase() === nodeType,
151151
)[0]
152152

153153
const showDesiredAndCompareManifest =
@@ -201,32 +201,26 @@ const NodeDetailComponent = ({
201201
useEffect(() => setManagedFields((prev) => prev && selectedTabName === NodeDetailTab.MANIFEST), [selectedTabName])
202202

203203
useEffect(() => {
204-
if (location.pathname.endsWith('/terminal') && params.nodeType === Nodes.Pod.toLowerCase()) {
204+
if (location.pathname.endsWith('/terminal') && nodeType === Nodes.Pod.toLowerCase()) {
205205
setStartTerminal(true)
206206
}
207207
}, [location])
208208

209209
useEffect(() => {
210-
if (params.nodeType) {
211-
const _tabs = getNodeDetailTabs(params.nodeType as NodeType, true)
210+
if (nodeType) {
211+
const _tabs = getNodeDetailTabs(nodeType as NodeType, true)
212212
setTabs(_tabs)
213213
}
214-
}, [params.nodeType])
214+
}, [nodeType])
215215

216216
const getContainersFromManifest = async () => {
217217
try {
218-
const nullCaseName = isResourceBrowserView && params.nodeType === 'pod' ? resourceName : ''
219-
const { result } = (await getManifestResource(
220-
appDetails,
221-
resourceName,
222-
params.nodeType,
223-
isResourceBrowserView,
224-
{
225-
...selectedResource,
226-
name: selectedResource.name ? selectedResource.name : nullCaseName,
227-
namespace: selectedResource.namespace ? selectedResource.namespace : params.namespace,
228-
},
229-
)) as any
218+
const nullCaseName = isResourceBrowserView && nodeType === 'pod' ? resourceName : ''
219+
const { result } = (await getManifestResource(appDetails, resourceName, nodeType, isResourceBrowserView, {
220+
...selectedResource,
221+
name: selectedResource.name ? selectedResource.name : nullCaseName,
222+
namespace: selectedResource.namespace ? selectedResource.namespace : params.namespace,
223+
})) as any
230224
const _resourceContainers = []
231225
if (result?.manifestResponse?.manifest?.spec) {
232226
if (Array.isArray(result.manifestResponse.manifest.spec.containers)) {
@@ -297,7 +291,7 @@ const NodeDetailComponent = ({
297291
!loadingResources &&
298292
selectedResource &&
299293
resourceName &&
300-
params.nodeType === Nodes.Pod.toLowerCase()
294+
nodeType === Nodes.Pod.toLowerCase()
301295
) {
302296
getContainersFromManifest().catch(noop)
303297
}
@@ -319,7 +313,7 @@ const NodeDetailComponent = ({
319313
(!isResourceBrowserView &&
320314
!(
321315
appDetails.resourceTree.nodes?.findIndex(
322-
(node) => node.name === params.podName && node.kind.toLowerCase() === params.nodeType,
316+
(node) => node.name === params.podName && node.kind.toLowerCase() === nodeType,
323317
) >= 0
324318
))
325319

0 commit comments

Comments
 (0)