Skip to content

Commit

Permalink
feat: vdisks in 2 rows
Browse files Browse the repository at this point in the history
  • Loading branch information
astandrik committed Dec 16, 2024
1 parent 44e079a commit 38969b6
Show file tree
Hide file tree
Showing 4 changed files with 202 additions and 34 deletions.
19 changes: 13 additions & 6 deletions src/containers/Storage/PDisk/PDisk.scss
Original file line number Diff line number Diff line change
@@ -1,28 +1,35 @@
.pdisk-storage {
position: relative;

width: 120px;
display: flex;
flex-direction: column;

min-width: 120px;

&__content {
position: relative;

display: block;
flex: 1;

border-radius: 4px; // to match interactive area with disk shape
border-radius: 4px;
}

&__vdisks {
display: flex;
// this breaks disks relative sizes, but disks rarely exceed one line
flex-wrap: wrap;
overflow: hidden; // Prevent overflow
flex: 0 0 auto;
gap: 2px;

margin-bottom: 4px;

white-space: nowrap;
}

&__vdisks-item {
flex-basis: 3px;
flex-shrink: 0;
flex: 0 0 3px;

min-width: 3px;

.stack__layer {
.data-table__row:hover & {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -5,20 +5,13 @@

&__pdisks-wrapper {
display: flex;
justify-content: left;
align-items: flex-end;
gap: 10px;

width: max-content;
height: 40px;
width: 100%;
}
&__pdisks-item {
flex-grow: 1;

max-width: 200px;
margin-right: 10px;

&:last-child {
margin-right: 0px;
}
&__pdisks-item {
display: flex;
flex-shrink: 0;
}
}
42 changes: 26 additions & 16 deletions src/containers/Storage/StorageNodes/getNodes.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import {
NODES_COLUMNS_TO_DATA_FIELDS,
getNodesColumnSortField,
} from '../../../components/nodesColumns/constants';
import {generateNodes} from '../../../mocks/storage/nodes';
import type {
PreparedStorageNode,
PreparedStorageNodeFilters,
Expand Down Expand Up @@ -44,22 +45,31 @@ export const getStorageNodes: FetchData<

const dataFieldsRequired = getRequiredDataFields(columnsIds, NODES_COLUMNS_TO_DATA_FIELDS);

const response = await window.api.viewer.getNodes({
type,
storage,
limit,
offset,
sort,
filter: searchValue,
uptime: getUptimeParamValue(nodesUptimeFilter),
with: visibleEntities,
database,
node_id: nodeId,
group_id: groupId,
filter_group: filterGroup,
filter_group_by: filterGroupBy,
fieldsRequired: dataFieldsRequired,
});
let response;
if (process.env.NODE_ENV === 'development') {
// Get mock configuration from URL parameters or use defaults
const urlParams = new URLSearchParams(window.location.search);
const pdisks = parseInt(urlParams.get('pdisks') || '10', 10);
const vdisksPerPDisk = parseInt(urlParams.get('vdisksPerPDisk') || '2', 10);
response = generateNodes(5, {vdisksCount: pdisks * vdisksPerPDisk, pdisksCount: pdisks});
} else {
response = await window.api.viewer.getNodes({
type,
storage,
limit,
offset,
sort,
filter: searchValue,
uptime: getUptimeParamValue(nodesUptimeFilter),
with: visibleEntities,
database,
node_id: nodeId,
group_id: groupId,
filter_group: filterGroup,
filter_group_by: filterGroupBy,
fieldsRequired: dataFieldsRequired,
});
}
const preparedResponse = prepareStorageNodesResponse(response);
return {
data: preparedResponse.nodes || [],
Expand Down
158 changes: 158 additions & 0 deletions src/mocks/storage/nodes.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,158 @@
import {EFlag} from '../../types/api/enums';
import type {
TEndpoint,
TNodeInfo,
TNodesInfo,
TPoolStats,
TSystemStateInfo,
} from '../../types/api/nodes';
import {TPDiskState} from '../../types/api/pdisk';
import {EVDiskState} from '../../types/api/vdisk';

// Different disk sizes to simulate variety (in bytes)
const DISK_SIZES = [
'68719476736', // 64 GB
'137438953472', // 128 GB
'274877906944', // 256 GB
'549755813888', // 512 GB
'1099511627776', // 1 TB
];

const getRandomDiskSize = () => DISK_SIZES[Math.floor(Math.random() * DISK_SIZES.length)];

const generatePoolStats = (count = 5): TPoolStats[] => {
const poolNames = ['System', 'User', 'Batch', 'IO', 'IC'] as const;
return poolNames.slice(0, count).map((Name) => ({
Name,
Usage: Math.random() * 0.02,
Threads: Math.floor(Math.random() * 3) + 1,
}));
};

const generateEndpoints = (): TEndpoint[] => [
{Name: 'ic', Address: ':19001'},
{Name: 'http-mon', Address: ':8765'},
{Name: 'grpcs', Address: ':2135'},
{Name: 'grpc', Address: ':2136'},
];

const generateSystemState = (nodeId: number): TSystemStateInfo => ({
StartTime: '1734358137851',
ChangeTime: '1734358421375',
LoadAverage: [3.381347656, 2.489257813, 1.279296875],
NumberOfCpus: 8,
SystemState: EFlag.Green,
NodeId: nodeId,
Host: `localhost-${nodeId}`,
Version: 'main.95ce0df',
PoolStats: generatePoolStats(),
Endpoints: generateEndpoints(),
Roles: ['Bootstrapper', 'StateStorage', 'StateStorageBoard', 'SchemeBoard', 'Storage'],
MemoryLimit: '2147483648',
MaxDiskUsage: 0.002349853516,
Location: {
DataCenter: '1',
Rack: '1',
Unit: '1',
},
TotalSessions: 0,
CoresUsed: 0.07583969556,
CoresTotal: 8,
});

const generatePDisk = (nodeId: number, pdiskId: number, totalSize = '68719476736') => ({
PDiskId: pdiskId,
ChangeTime: '1734358142074',
Path: `/ydb_data/pdisk${pdiskId}l3ki78no.data`,
Guid: pdiskId.toString(),
Category: '0',
TotalSize: totalSize,
AvailableSize: (Number(totalSize) * 0.9).toString(), // 90% available by default
State: TPDiskState.Normal,
NodeId: nodeId,
Device: EFlag.Green,
Realtime: EFlag.Green,
SerialNumber: '',
SystemSize: '213909504',
LogUsedSize: '35651584',
LogTotalSize: '68486692864',
EnforcedDynamicSlotSize: '22817013760',
});

const generateVDisk = (nodeId: number, vdiskId: number, pdiskId: number) => ({
VDiskId: {
GroupID: vdiskId,
GroupGeneration: 1,
Ring: 0,
Domain: 0,
VDisk: 0,
},
ChangeTime: '1734358420919',
PDiskId: pdiskId,
VDiskSlotId: vdiskId,
Guid: '1',
Kind: '0',
NodeId: nodeId,
VDiskState: EVDiskState.OK,
DiskSpace: EFlag.Green,
SatisfactionRank: {
FreshRank: {
Flag: EFlag.Green,
},
LevelRank: {
Flag: EFlag.Green,
},
},
Replicated: true,
ReplicationProgress: 1,
ReplicationSecondsRemaining: 0,
AllocatedSize: '0',
AvailableSize: '22817013760',
HasUnreadableBlobs: false,
IncarnationGuid: '11528832187803248876',
InstanceGuid: '14836434871903384493',
FrontQueues: EFlag.Green,
StoragePoolName: 'static',
ReadThroughput: '0',
WriteThroughput: '420',
});

interface NodeGeneratorOptions {
vdisksCount?: number;
pdisksCount?: number;
}

const DEFAULT_OPTIONS: NodeGeneratorOptions = {
vdisksCount: 12,
pdisksCount: 4,
};

const generateNode = (nodeId: number, options: NodeGeneratorOptions = {}): TNodeInfo => {
const pdisksCount = options.pdisksCount ?? DEFAULT_OPTIONS.pdisksCount;
const vdisksCount = options.vdisksCount ?? DEFAULT_OPTIONS.vdisksCount;

return {
NodeId: nodeId,
UptimeSeconds: 284,
CpuUsage: 0.00947996,
DiskSpaceUsage: 0.234985,
SystemState: generateSystemState(nodeId),
PDisks: Array.from({length: pdisksCount!}, (_, i) =>
generatePDisk(nodeId, i + 1, getRandomDiskSize()),
),
VDisks: Array.from({length: vdisksCount!}, (_, i) => {
// Distribute VDisks evenly across PDisks
const pdiskId = (i % pdisksCount!) + 1;
return generateVDisk(nodeId, i, pdiskId);
}),
};
};

export const generateNodes = (count = 1, options?: NodeGeneratorOptions): TNodesInfo => {
const nodes = Array.from({length: count}, (_, i) => generateNode(i + 1, options));
return {
TotalNodes: count.toString(),
FoundNodes: count.toString(),
Nodes: nodes,
};
};

0 comments on commit 38969b6

Please sign in to comment.