48 lines
1.7 KiB
TypeScript
48 lines
1.7 KiB
TypeScript
import React from 'react';
|
|
import Category from 'Components/Header/HealthStatus/ServiceCategory';
|
|
import cn from 'classnames';
|
|
|
|
function SubserviceHealth({
|
|
subservice,
|
|
name,
|
|
}: {
|
|
name: string;
|
|
subservice: { health: boolean; details: { errors?: string[]; version?: string } };
|
|
}) {
|
|
const [isExpanded, setIsExpanded] = React.useState(!subservice?.health);
|
|
|
|
const isExpandable = subservice?.details && Object.keys(subservice?.details).length > 0;
|
|
return (
|
|
<div className={cn(isExpanded && isExpandable ? 'bg-active-blue' : 'bg-white')}>
|
|
<Category
|
|
onClick={() => (isExpandable ? setIsExpanded(!isExpanded) : null)}
|
|
name={name}
|
|
healthOk={subservice?.health}
|
|
isExpandable={isExpandable}
|
|
isExpanded={isExpanded}
|
|
/>
|
|
{isExpanded ? (
|
|
<div className={'p-3'}>
|
|
{subservice?.details?.version ? (
|
|
<div className="flex items-center justify-between mt-2 px-2 py-2 bg-white rounded border border-light-gray">
|
|
<div className="py-1 px-2 font-medium">Version</div>
|
|
<div className="code-font text-black text-base px-2 py-1 whitespace-nowrap overflow-hidden text-clip">
|
|
{subservice?.details?.version}
|
|
</div>
|
|
</div>
|
|
) : null}
|
|
{subservice?.details?.errors?.length ? (
|
|
<div className={'py-2 px-4 bg-white rounded border border-light-gray'}>
|
|
<div>Error log:</div>
|
|
{subservice.details.errors.toString()}
|
|
</div>
|
|
) : subservice?.health ? null : (
|
|
'Service not responding'
|
|
)}
|
|
</div>
|
|
) : null}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default SubserviceHealth;
|