11import React , { useState , useEffect } from 'react' ;
2+ import { useIntl } from 'react-intl' ;
23import { isEmpty } from 'lodash' ;
34import { useDispatch } from 'react-redux' ;
45
@@ -19,6 +20,7 @@ import NoChanges from '../NoChanges';
1920import ConfigListRow from './ConfigListRow' ;
2021import { setConfigPartialDiffInState } from '../../state/actions/Config' ;
2122
23+
2224const ConfigList = ( { diff, isLoading } ) => {
2325 const [ openModal , setOpenModal ] = useState ( false ) ;
2426 const [ originalConfig , setOriginalConfig ] = useState ( { } ) ;
@@ -27,23 +29,24 @@ const ConfigList = ({ diff, isLoading }) => {
2729 const [ rows , setRows ] = useState ( [ ] ) ;
2830 const [ checkedItems , setCheckedItems ] = useState ( [ ] ) ;
2931 const dispatch = useDispatch ( ) ;
32+ const { formatMessage } = useIntl ( ) ;
3033
3134 const getConfigState = ( configName ) => {
3235 if (
3336 diff . fileConfig [ configName ]
3437 && diff . databaseConfig [ configName ]
3538 ) {
36- return ' Different';
39+ return formatMessage ( { id : 'config-sync.ConfigList. Different' } ) ;
3740 } else if (
3841 diff . fileConfig [ configName ]
3942 && ! diff . databaseConfig [ configName ]
4043 ) {
41- return 'Only in sync dir' ;
44+ return formatMessage ( { id : 'config- sync.ConfigList.OnlyDir' } ) ;
4245 } else if (
4346 ! diff . fileConfig [ configName ]
4447 && diff . databaseConfig [ configName ]
4548 ) {
46- return 'Only in DB' ;
49+ return formatMessage ( { id : 'config-sync.ConfigList.OnlyDB' } ) ;
4750 }
4851 } ;
4952
@@ -96,7 +99,7 @@ const ConfigList = ({ diff, isLoading }) => {
9699 if ( isLoading ) {
97100 return (
98101 < div style = { { textAlign : 'center' , marginTop : 40 } } >
99- < Loader > Loading content... </ Loader >
102+ < Loader > { formatMessage ( { id : 'config-sync.ConfigList.Loading' } ) } </ Loader >
100103 </ div >
101104 ) ;
102105 }
@@ -126,20 +129,20 @@ const ConfigList = ({ diff, isLoading }) => {
126129 < Tr >
127130 < Th >
128131 < BaseCheckbox
129- aria-label = "Select all entries"
132+ aria-label = { formatMessage ( { id : 'config-sync.ConfigList.SelectAll' } ) }
130133 indeterminate = { isIndeterminate }
131134 onValueChange = { ( value ) => setCheckedItems ( checkedItems . map ( ( ) => value ) ) }
132135 value = { allChecked }
133136 />
134137 </ Th >
135138 < Th >
136- < Typography variant = "sigma" > Config name </ Typography >
139+ < Typography variant = "sigma" > { formatMessage ( { id : 'config-sync.ConfigList.ConfigName' } ) } </ Typography >
137140 </ Th >
138141 < Th >
139- < Typography variant = "sigma" > Config type </ Typography >
142+ < Typography variant = "sigma" > { formatMessage ( { id : 'config-sync.ConfigList.ConfigType' } ) } </ Typography >
140143 </ Th >
141144 < Th >
142- < Typography variant = "sigma" > State</ Typography >
145+ < Typography variant = "sigma" > { formatMessage ( { id : 'config-sync.ConfigList. State' } ) } </ Typography >
143146 </ Th >
144147 </ Tr >
145148 </ Thead >
0 commit comments