console: fix issue with Badge component for Check DB Latency on Data Manager

[CPS-737]: https://hasurahq.atlassian.net/browse/CPS-737?atlOrigin=eyJpIjoiNWRkNTljNzYxNjVmNDY3MDlhMDU5Y2ZhYzA5YTRkZjUiLCJwIjoiZ2l0aHViLWNvbS1KU1cifQ

PR-URL: https://github.com/hasura/graphql-engine-mono/pull/7804
GitOrigin-RevId: b3b90fd3542d95d0560ded43766d57f81b4e3416
This commit is contained in:
Sameer Kolhar 2023-02-06 13:27:52 +05:30 committed by hasura-bot
parent 7a4bde9652
commit c27dceb1df

View File

@ -1,5 +1,5 @@
import ToolTip from '@/components/Common/Tooltip/Tooltip';
import { isNumber } from '@/components/Common/utils/jsUtils';
import { isNumber, isFloat } from '@/components/Common/utils/jsUtils';
import { TaskEvent } from '@/features/ConnectDB';
import { Badge } from '@/new-components/Badge';
import React, { useState } from 'react';
@ -83,7 +83,8 @@ const CollapsibleToggle: React.FC<CollapsibleToggleProps> = ({
({driverToLabel[dataSource.driver]})
</span>
{dbLatencyData &&
!isNumber(dbLatencyData.avg_latency) &&
(isNumber(dbLatencyData.avg_latency) ||
isFloat(dbLatencyData.avg_latency)) &&
Math.ceil(dbLatencyData.avg_latency) > 0 && (
<ToolTip
message={`Latency: ${Math.ceil(
@ -112,64 +113,62 @@ const CollapsibleToggle: React.FC<CollapsibleToggleProps> = ({
</div>
{isOpen ? (
<>
<div className="mt-xs space-y-xs">
{dbVersion ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold">Database</div>
<div className="ml-auto w-full sm:w-6/12">{dbVersion}</div>
<div className="mt-xs space-y-xs">
{dbVersion ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold">Database</div>
<div className="ml-auto w-full sm:w-6/12">{dbVersion}</div>
</div>
) : null}
{dataSource.connection_pool_settings?.max_connections ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold mr-xs">
Max Connections
</div>
) : null}
{dataSource.connection_pool_settings?.max_connections ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold mr-xs">
Max Connections
</div>
<div className="ml-auto w-full sm:w-6/12">
{dataSource.connection_pool_settings?.max_connections}
</div>
<div className="ml-auto w-full sm:w-6/12">
{dataSource.connection_pool_settings?.max_connections}
</div>
) : null}
{dataSource.connection_pool_settings?.idle_timeout ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold mr-xs">
Idle Timeout
</div>
<div className="ml-auto w-full sm:w-6/12">
{dataSource.connection_pool_settings?.idle_timeout}
</div>
</div>
) : null}
{dataSource.connection_pool_settings?.idle_timeout ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold mr-xs">
Idle Timeout
</div>
) : null}
{dataSource.connection_pool_settings?.retries ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold mr-xs">Retries</div>
<div className="ml-auto w-full sm:w-6/12">
{dataSource.connection_pool_settings?.retries}
</div>
<div className="ml-auto w-full sm:w-6/12">
{dataSource.connection_pool_settings?.idle_timeout}
</div>
) : null}
{dataSource.connection_pool_settings?.pool_timeout ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold mr-xs">
Pool Timeout
</div>
<div className="ml-auto w-full sm:w-6/12">
{dataSource.connection_pool_settings?.pool_timeout}
</div>
</div>
) : null}
{dataSource.connection_pool_settings?.retries ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold mr-xs">Retries</div>
<div className="ml-auto w-full sm:w-6/12">
{dataSource.connection_pool_settings?.retries}
</div>
) : null}
{dataSource.connection_pool_settings?.connection_lifetime ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold mr-xs">
Connection Lifetime
</div>
<div className="ml-auto w-full sm:w-6/12">
{dataSource.connection_pool_settings?.connection_lifetime}
</div>
</div>
) : null}
{dataSource.connection_pool_settings?.pool_timeout ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold mr-xs">
Pool Timeout
</div>
) : null}
</div>
</>
<div className="ml-auto w-full sm:w-6/12">
{dataSource.connection_pool_settings?.pool_timeout}
</div>
</div>
) : null}
{dataSource.connection_pool_settings?.connection_lifetime ? (
<div className="flex content-start">
<div className="text-gray-600 font-semibold mr-xs">
Connection Lifetime
</div>
<div className="ml-auto w-full sm:w-6/12">
{dataSource.connection_pool_settings?.connection_lifetime}
</div>
</div>
) : null}
</div>
) : (
''
)}