11import React from 'react' ;
22
3- import { CircleCheckFill , CircleXmarkFill } from '@gravity-ui/icons' ;
4- import { DefinitionList , Flex , Icon , Label , Text } from '@gravity-ui/uikit' ;
3+ import { DefinitionList , Flex , Label , Text } from '@gravity-ui/uikit' ;
54
65import type { TBridgePile } from '../../../../types/api/cluster' ;
6+ import { BridgePileState } from '../../../../types/api/cluster' ;
77import { cn } from '../../../../utils/cn' ;
88import { EMPTY_DATA_PLACEHOLDER } from '../../../../utils/constants' ;
99import { formatNumber } from '../../../../utils/dataFormatters/dataFormatters' ;
@@ -13,6 +13,32 @@ import './BridgeInfoTable.scss';
1313
1414const b = cn ( 'bridge-info-table' ) ;
1515
16+ function getBridgePileStateTheme (
17+ state ?: string ,
18+ ) : 'normal' | 'info' | 'success' | 'warning' | 'danger' | 'utility' | 'unknown' {
19+ if ( ! state ) {
20+ return 'unknown' ;
21+ }
22+
23+ switch ( state . toUpperCase ( ) ) {
24+ case BridgePileState . PRIMARY :
25+ return 'success' ; // Green - active primary
26+ case BridgePileState . PROMOTE :
27+ return 'warning' ; // Orange - transitioning to primary
28+ case BridgePileState . SYNCHRONIZED :
29+ return 'info' ; // Blue - ready but not primary
30+ case BridgePileState . NOT_SYNCHRONIZED :
31+ return 'danger' ; // Red - problematic state
32+ case BridgePileState . SUSPENDED :
33+ return 'utility' ; // Gray - graceful shutdown
34+ case BridgePileState . DISCONNECTED :
35+ return 'danger' ; // Red - connectivity issue
36+ case BridgePileState . UNSPECIFIED :
37+ default :
38+ return 'unknown' ; // Purple - unknown state
39+ }
40+ }
41+
1642interface BridgeInfoTableProps {
1743 piles : TBridgePile [ ] ;
1844}
@@ -22,57 +48,17 @@ interface BridgePileCardProps {
2248}
2349
2450const BridgePileCard = React . memo ( function BridgePileCard ( { pile} : BridgePileCardProps ) {
25- const renderPrimaryStatus = React . useCallback ( ( ) => {
26- const isPrimary = pile . IsPrimary ;
27- const icon = isPrimary ? CircleCheckFill : CircleXmarkFill ;
28- const text = isPrimary ? i18n ( 'value_yes' ) : i18n ( 'value_no' ) ;
29-
30- return (
31- < Flex gap = { 1 } alignItems = "center" >
32- < Icon data = { icon } size = { 16 } className = { b ( 'status-icon' , { primary : isPrimary } ) } />
33- < Text color = "secondary" > { text } </ Text >
34- </ Flex >
35- ) ;
36- } , [ pile . IsPrimary ] ) ;
37-
3851 const renderStateStatus = React . useCallback ( ( ) => {
3952 if ( ! pile . State ) {
4053 return EMPTY_DATA_PLACEHOLDER ;
4154 }
4255
43- const isSynchronized = pile . State . toUpperCase ( ) === 'SYNCHRONIZED' ;
44- const theme = isSynchronized ? 'success' : 'info' ;
45-
56+ const theme = getBridgePileStateTheme ( pile . State ) ;
4657 return < Label theme = { theme } > { pile . State } </ Label > ;
4758 } , [ pile . State ] ) ;
4859
49- const renderBeingPromotedStatus = React . useCallback ( ( ) => {
50- const isBeingPromoted = pile . IsBeingPromoted ;
51- const icon = isBeingPromoted ? CircleCheckFill : CircleXmarkFill ;
52- const text = isBeingPromoted ? i18n ( 'value_yes' ) : i18n ( 'value_no' ) ;
53-
54- return (
55- < Flex gap = { 1 } alignItems = "center" >
56- < Icon
57- data = { icon }
58- size = { 16 }
59- className = { b ( 'status-icon' , { primary : isBeingPromoted } ) }
60- />
61- < Text color = "secondary" > { text } </ Text >
62- </ Flex >
63- ) ;
64- } , [ pile . IsBeingPromoted ] ) ;
65-
6660 const info = React . useMemo (
6761 ( ) => [
68- {
69- name : i18n ( 'field_primary' ) ,
70- content : renderPrimaryStatus ( ) ,
71- } ,
72- {
73- name : i18n ( 'field_being-promoted' ) ,
74- content : renderBeingPromotedStatus ( ) ,
75- } ,
7662 {
7763 name : i18n ( 'field_state' ) ,
7864 content : renderStateStatus ( ) ,
@@ -83,7 +69,7 @@ const BridgePileCard = React.memo(function BridgePileCard({pile}: BridgePileCard
8369 pile . Nodes === undefined ? EMPTY_DATA_PLACEHOLDER : formatNumber ( pile . Nodes ) ,
8470 } ,
8571 ] ,
86- [ renderPrimaryStatus , renderBeingPromotedStatus , renderStateStatus , pile . Nodes ] ,
72+ [ renderStateStatus , pile . Nodes ] ,
8773 ) ;
8874
8975 return (
0 commit comments