vitess.io/vitess@v0.16.2/web/vtadmin/src/components/routes/tablet/FullStatus.tsx (about) 1 import React from 'react'; 2 import { Link } from 'react-router-dom'; 3 import { useGetFullStatus } from '../../../hooks/api'; 4 import { vtadmin } from '../../../proto/vtadmin'; 5 import { formatAlias } from '../../../util/tablets'; 6 import { Code } from '../../Code'; 7 import style from './Tablet.module.scss'; 8 9 interface Props { 10 tablet: vtadmin.Tablet; 11 } 12 13 function stateReplacer(key: string, val: number) { 14 if (key === 'io_state' || key === 'sql_state') { 15 if (val === 3) { 16 return 'Running'; 17 } else if (val === 2) { 18 return 'Connecting'; 19 } else if (val === 1) { 20 return 'Stopped'; 21 } 22 } 23 return val; 24 } 25 26 const FullStatus: React.FC<Props> = ({ tablet }) => { 27 const { data, error } = useGetFullStatus({ 28 // Ok to use ? operator here; if params are null 29 // will fall back to error = true case 30 clusterID: tablet.cluster?.id as string, 31 alias: formatAlias(tablet.tablet?.alias) as string, 32 }); 33 34 if (error) { 35 return ( 36 <div className={style.placeholder}> 37 <span className={style.errorEmoji}>😰</span> 38 <h1>An error occurred</h1> 39 <code>{error.message}</code> 40 <p> 41 <Link to="/tablets">← All tablets</Link> 42 </p> 43 </div> 44 ); 45 } 46 47 if (data && data.status) { 48 data.status.semi_sync_primary_enabled = !!data.status.semi_sync_primary_enabled; 49 data.status.semi_sync_replica_enabled = !!data.status.semi_sync_replica_enabled; 50 data.status.semi_sync_primary_status = !!data.status.semi_sync_primary_status; 51 data.status.semi_sync_replica_status = !!data.status.semi_sync_replica_status; 52 } 53 54 return <Code code={JSON.stringify(data, stateReplacer, 2)} />; 55 }; 56 57 export default FullStatus;