diff --git a/src/components/PDiskInfo/PDiskInfo.scss b/src/components/PDiskInfo/PDiskInfo.scss deleted file mode 100644 index db8ae2f3f..000000000 --- a/src/components/PDiskInfo/PDiskInfo.scss +++ /dev/null @@ -1,7 +0,0 @@ -.ydb-pdisk-info { - &__links { - display: flex; - flex-flow: row wrap; - gap: var(--g-spacing-2); - } -} diff --git a/src/components/PDiskInfo/PDiskInfo.tsx b/src/components/PDiskInfo/PDiskInfo.tsx index 676b1210c..106efd4b1 100644 --- a/src/components/PDiskInfo/PDiskInfo.tsx +++ b/src/components/PDiskInfo/PDiskInfo.tsx @@ -3,7 +3,6 @@ import {Flex} from '@gravity-ui/uikit'; import {getPDiskPagePath} from '../../routes'; import {valueIsDefined} from '../../utils'; import {formatBytes} from '../../utils/bytesParsers'; -import {cn} from '../../utils/cn'; import {formatStorageValuesToGb} from '../../utils/dataFormatters/dataFormatters'; import {createPDiskDeveloperUILink} from '../../utils/developerUI/developerUI'; import type {PreparedPDisk} from '../../utils/disks/types'; @@ -16,10 +15,6 @@ import {StatusIcon} from '../StatusIcon/StatusIcon'; import {pDiskInfoKeyset} from './i18n'; -import './PDiskInfo.scss'; - -const b = cn('ydb-pdisk-info'); - interface GetPDiskInfoOptions { pDisk?: T; nodeId?: number | string | null; @@ -156,7 +151,7 @@ function getPDiskInfo({ additionalInfo.push({ label: pDiskInfoKeyset('links'), value: ( - + {withPDiskPageLink && ( ({ url={pDiskInternalViewerPath} /> )} - + ), }); } diff --git a/src/components/PDiskPopup/PDiskPopup.tsx b/src/components/PDiskPopup/PDiskPopup.tsx index 886451879..dcc1025c8 100644 --- a/src/components/PDiskPopup/PDiskPopup.tsx +++ b/src/components/PDiskPopup/PDiskPopup.tsx @@ -1,5 +1,8 @@ import React from 'react'; +import {Flex} from '@gravity-ui/uikit'; + +import {getPDiskPagePath} from '../../routes'; import {selectNodesMap} from '../../store/reducers/nodesList'; import {EFlag} from '../../types/api/enums'; import {valueIsDefined} from '../../utils'; @@ -12,6 +15,7 @@ import {bytesToGB, isNumeric} from '../../utils/utils'; import {InfoViewer} from '../InfoViewer'; import type {InfoViewerItem} from '../InfoViewer'; import {LinkWithIcon} from '../LinkWithIcon/LinkWithIcon'; +import {pDiskInfoKeyset} from '../PDiskInfo/i18n'; const errorColors = [EFlag.Orange, EFlag.Red, EFlag.Yellow]; @@ -78,9 +82,22 @@ export const preparePDiskData = ( pDiskId: PDiskId, }); + const pDiskPagePath = getPDiskPagePath(PDiskId, NodeId); pdiskData.push({ label: 'Links', - value: , + value: ( + + + + + ), }); } diff --git a/src/components/VDiskInfo/VDiskInfo.scss b/src/components/VDiskInfo/VDiskInfo.scss index 74210244e..d4c249097 100644 --- a/src/components/VDiskInfo/VDiskInfo.scss +++ b/src/components/VDiskInfo/VDiskInfo.scss @@ -1,10 +1,4 @@ .ydb-vdisk-info { - &__links { - display: flex; - flex-flow: row wrap; - gap: var(--g-spacing-2); - } - &__title { display: flex; flex-direction: row; diff --git a/src/components/VDiskInfo/VDiskInfo.tsx b/src/components/VDiskInfo/VDiskInfo.tsx index 5f90a3469..cf71b2cf9 100644 --- a/src/components/VDiskInfo/VDiskInfo.tsx +++ b/src/components/VDiskInfo/VDiskInfo.tsx @@ -1,5 +1,7 @@ import React from 'react'; +import {Flex} from '@gravity-ui/uikit'; + import {getVDiskPagePath} from '../../routes'; import {valueIsDefined} from '../../utils'; import {cn} from '../../utils/cn'; @@ -182,7 +184,11 @@ export function VDiskInfo({ if (links.length) { vdiskInfo.push({ label: vDiskInfoKeyset('links'), - value:
{links}
, + value: ( + + {links} + + ), }); } } diff --git a/src/components/VDiskPopup/VDiskPopup.tsx b/src/components/VDiskPopup/VDiskPopup.tsx index 5f983a0a9..b008c7445 100644 --- a/src/components/VDiskPopup/VDiskPopup.tsx +++ b/src/components/VDiskPopup/VDiskPopup.tsx @@ -1,7 +1,8 @@ import React from 'react'; -import {Label} from '@gravity-ui/uikit'; +import {Flex, Label} from '@gravity-ui/uikit'; +import {getVDiskPagePath} from '../../routes'; import {selectNodesMap} from '../../store/reducers/nodesList'; import {EFlag} from '../../types/api/enums'; import {valueIsDefined} from '../../utils'; @@ -19,6 +20,7 @@ import {InternalLink} from '../InternalLink'; import {LinkWithIcon} from '../LinkWithIcon/LinkWithIcon'; import {preparePDiskData} from '../PDiskPopup/PDiskPopup'; import {getVDiskLink} from '../VDisk/utils'; +import {vDiskInfoKeyset} from '../VDiskInfo/i18n'; import './VDiskPopup.scss'; @@ -162,9 +164,23 @@ const prepareVDiskData = (data: PreparedVDisk, withDeveloperUILink?: boolean) => vDiskSlotId: VDiskSlotId, }); + const vDiskPagePath = getVDiskPagePath(VDiskSlotId, PDiskId, NodeId); vdiskData.push({ label: 'Links', - value: , + value: ( + + + + + ), }); }