16
16
17
17
import { generatePath , NavLink , useParams , useRouteMatch } from 'react-router-dom'
18
18
19
- import { Icon , IconName , ModalSidebarPanel } from '@devtron-labs/devtron-fe-common-lib'
19
+ import { Icon , IconName , ModalSidebarPanel , SERVER_MODE , useMainContext } from '@devtron-labs/devtron-fe-common-lib'
20
20
21
21
import { importComponentFromFELibrary } from '@Components/common'
22
22
@@ -27,47 +27,53 @@ const isFELibAvailable = importComponentFromFELibrary('isFELibAvailable', null,
27
27
28
28
const Sidebar = ( ) => {
29
29
const { path } = useRouteMatch ( )
30
+ const { serverMode } = useMainContext ( )
30
31
const { type } = useParams < CreateClusterParams > ( )
31
32
32
33
const selectedSidebarElement = SIDEBAR_CONFIG [ type ]
33
34
34
35
return (
35
36
< div className = "w-250 p-20 flexbox-col dc__gap-24 dc__no-shrink dc__overflow-auto" >
36
37
< div className = "flexbox-col" >
37
- { Object . entries ( SIDEBAR_CONFIG ) . map ( ( [ key , { title, iconName, isEnterprise, dataTestId } ] ) => {
38
- const isSelected = type . toLowerCase ( ) === key . toLowerCase ( )
38
+ { Object . entries ( SIDEBAR_CONFIG ) . map (
39
+ ( [ key , { title, iconName, isEnterprise, dataTestId, hideInEAMode } ] ) => {
40
+ if ( hideInEAMode && serverMode === SERVER_MODE . EA_ONLY ) {
41
+ return null
42
+ }
43
+ const isSelected = type . toLowerCase ( ) === key . toLowerCase ( )
39
44
40
- return (
41
- < NavLink
42
- data-testid = { dataTestId }
43
- key = { key }
44
- className = { `dc__transparent flex left dc__gap-8 py-6 px-8 br-4 ${ isSelected ? 'bcb-1' : 'dc__hover-n50' } ` }
45
- to = { generatePath ( path , { type : key } ) }
46
- >
47
- < span className = "dc__fill-available-space dc__no-shrink icon-dim-16" >
48
- < Icon name = { iconName as IconName } color = { isSelected ? 'B500' : 'N600' } />
49
- </ span >
50
-
51
- < span
52
- className = { `fs-13 lh-20 dc__truncate flex-grow-1 ${ isSelected ? 'cb-5 fw-6' : 'cn-9' } ` }
45
+ return (
46
+ < NavLink
47
+ data-testid = { dataTestId }
48
+ key = { key }
49
+ className = { `dc__transparent flex left dc__gap-8 py-6 px-8 br-4 ${ isSelected ? 'bcb-1' : 'dc__hover-n50' } ` }
50
+ to = { generatePath ( path , { type : key } ) }
53
51
>
54
- { title }
55
- </ span >
52
+ < span className = "dc__fill-available-space dc__no-shrink icon-dim-16" >
53
+ < Icon name = { iconName as IconName } color = { isSelected ? 'B500' : 'N600' } />
54
+ </ span >
55
+
56
+ < span
57
+ className = { `fs-13 lh-20 dc__truncate flex-grow-1 ${ isSelected ? 'cb-5 fw-6' : 'cn-9' } ` }
58
+ >
59
+ { title }
60
+ </ span >
56
61
57
- { isEnterprise && ! isFELibAvailable && (
58
- < Icon
59
- name = "ic-enterprise-feat"
60
- color = "Y700"
61
- tooltipProps = { {
62
- content : 'This is an enterprise only feature' ,
63
- placement : 'right' ,
64
- alwaysShowTippyOnHover : true ,
65
- } }
66
- />
67
- ) }
68
- </ NavLink >
69
- )
70
- } ) }
62
+ { isEnterprise && ! isFELibAvailable && (
63
+ < Icon
64
+ name = "ic-enterprise-feat"
65
+ color = "Y700"
66
+ tooltipProps = { {
67
+ content : 'This is an enterprise only feature' ,
68
+ placement : 'right' ,
69
+ alwaysShowTippyOnHover : true ,
70
+ } }
71
+ />
72
+ ) }
73
+ </ NavLink >
74
+ )
75
+ } ,
76
+ ) }
71
77
</ div >
72
78
73
79
< div className = "divider__secondary--horizontal" />
0 commit comments