Skip to content

HDDS-14827. Sync chart labels with sorted filesize data - insightsFilePlot #9912

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
adoroszlai merged 2 commits into from
Mar 22, 2026
+48 −53
Merged

HDDS-14827. Sync chart labels with sorted filesize data - insightsFilePlot #9912

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
fde6484
HDDS-14827. Sync chart labels with sorted file size data in insightsF…
arunsarin85 Mar 13, 2026
3c67b02
HDDS-14827. Added more scenarios in recon db.json
arunsarin85 Mar 13, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
75 changes: 27 additions & 48 deletions hadoop-ozone/recon/src/main/resources/webapps/recon/ozone-recon-web/api/db.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1328,54 +1328,33 @@
]
},
"fileSizeCounts": [
{
"volume": "vol1",
"bucket": "bucket1",
"fileSize": 1024,
"count": 56
},
{
"volume": "vol1",
"bucket": "bucket2",
"fileSize": 4096,
"count": 25
},
{
"volume": "vol1",
"bucket": "bucket3",
"fileSize": 32768,
"count": 312
},
{
"volume": "vol1",
"bucket": "bucket4",
"fileSize": 131072,
"count": 78
},
{
"volume": "vol1",
"bucket": "bucket5",
"fileSize": 1024,
"count": 123
},
{
"volume": "vol1",
"bucket": "bucket6",
"fileSize": 131072,
"count": 187
},
{
"volume": "vol2",
"bucket": "bucket7",
"fileSize": 1024,
"count": 54
},
{
"volume": "vol3",
"bucket": "bucket8",
"fileSize": 131072,
"count": 217
}
{ "volume": "voltpb", "bucket": "buck1pb", "fileSize": 137438953472, "count": 2857 },
{ "volume": "voltpb", "bucket": "buck2pb", "fileSize": 137438953472, "count": 143 },

{ "volume": "vol-reverse", "bucket": "bucket-r7", "fileSize": 549755813888, "count": 2 },
{ "volume": "vol-reverse", "bucket": "bucket-r6", "fileSize": 274877906944, "count": 5 },
{ "volume": "vol-reverse", "bucket": "bucket-r5", "fileSize": 8589934592, "count": 30 },
{ "volume": "vol-reverse", "bucket": "bucket-r4", "fileSize": 1048576, "count": 180 },
{ "volume": "vol-reverse", "bucket": "bucket-r3", "fileSize": 65536, "count": 450 },
{ "volume": "vol-reverse", "bucket": "bucket-r2", "fileSize": 4096, "count": 1200 },
{ "volume": "vol-reverse", "bucket": "bucket-r1", "fileSize": 1024, "count": 3800 },

{ "volume": "vol-single", "bucket": "bucket-s1", "fileSize": 67108864, "count": 620 },
{ "volume": "vol-single", "bucket": "bucket-s2", "fileSize": 67108864, "count": 180 },

{ "volume": "vol-edge", "bucket": "bucket-e1", "fileSize": 1099511627776, "count": 1 },
{ "volume": "vol-edge", "bucket": "bucket-e2", "fileSize": 1024, "count": 50000 },

{ "volume": "vol1", "bucket": "bucket1", "fileSize": 1024, "count": 56 },
{ "volume": "vol1", "bucket": "bucket2", "fileSize": 4096, "count": 25 },
{ "volume": "vol1", "bucket": "bucket3", "fileSize": 32768, "count": 312 },
{ "volume": "vol1", "bucket": "bucket4", "fileSize": 131072, "count": 78 },
{ "volume": "vol1", "bucket": "bucket5", "fileSize": 1024, "count": 123 },
{ "volume": "vol1", "bucket": "bucket6", "fileSize": 131072, "count": 187 },
{ "volume": "vol2", "bucket": "bucket7", "fileSize": 1048576, "count": 410 },
{ "volume": "vol2", "bucket": "bucket8", "fileSize": 16777216, "count": 94 },
{ "volume": "vol3", "bucket": "bucket9", "fileSize": 134217728, "count": 38 },
{ "volume": "vol3", "bucket": "bucket10", "fileSize": 1024, "count": 217 }
],
"containerCount": [
{
Expand Down
14 changes: 11 additions & 3 deletions ...main/resources/webapps/recon/ozone-recon-web/src/v2/components/plots/insightsFilePlot.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -120,9 +120,18 @@ const FileSizeDistribution: React.FC<FileSizeDistributionProps> = ({
new Map<number, number>
);

// Sort the map by file size before computing labels so that x-axis labels
// and bar values are derived from the same ordered sequence.
// Without sorting first, labels computed from the unsorted map would be
// misaligned with bar values from the sorted map, causing wrong size ranges
// to be shown for large buckets (e.g. 100 GiB files displayed as 512 KiB-1 MiB).
const sortedFileCountMap = new Map(
[...fileCountMap.entries()].sort((a, b) => a[0] - b[0])
);

// Calculate the previous power of 2 to find the lower bound of the range
// Ex: for 2048, the lower bound is 1024
const fileCountValues = Array.from(fileCountMap.keys()).map(value => {
const fileCountValues = Array.from(sortedFileCountMap.keys()).map(value => {
const upperbound = size(value);
const upperboundPwr = Math.log2(value);
// For 1024 i.e 2^10, the lower bound is 0, so we start binning after 2^10
Expand All @@ -132,8 +141,7 @@ const FileSizeDistribution: React.FC<FileSizeDistributionProps> = ({

setFilePlotData({
fileCountValues: fileCountValues,
// set the sorted value by size for the map
fileCountMap: new Map([...fileCountMap.entries()].sort((a, b) => a[0] - b[0]))
fileCountMap: sortedFileCountMap
});
}

Expand Down
12 changes: 10 additions & 2 deletions ...ne/recon/src/main/resources/webapps/recon/ozone-recon-web/src/views/insights/insights.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -156,13 +156,18 @@ export class Insights extends React.Component<Record<string, object>, IInsightsS
filteredData = filteredData.filter(item => selectedBucketValues.has(item.bucket));
}

const xyFileCountMap: Map<number, number> = filteredData.reduce(
const unsortedFileCountMap: Map<number, number> = filteredData.reduce(
(map: Map<number, number>, current) => {
const fileSize = current.fileSize;
const oldCount = map.has(fileSize) ? map.get(fileSize)! : 0;
map.set(fileSize, oldCount + current.count);
return map;
}, new Map<number, number>());
// Sort by file size so that labels and bar values are both in ascending
// size order, preventing label-value misalignment.
const xyFileCountMap = new Map(
[...unsortedFileCountMap.entries()].sort((a, b) => a[0] - b[0])
);
// Calculate the previous power of 2 to find the lower bound of the range
// Ex: for 2048, the lower bound is 1024
const xFileCountValues = Array.from(xyFileCountMap.keys()).map(value => {
Expand All @@ -174,13 +179,16 @@ export class Insights extends React.Component<Record<string, object>, IInsightsS
return `${lowerbound} - ${upperbound}`;
});

const xyContainerCountMap: Map<number, number> = containerCountResponse.reduce(
const unsortedContainerCountMap: Map<number, number> = containerCountResponse.reduce(
(map: Map<number, number>, current) => {
const containerSize = current.containerSize;
const oldCount = map.has(containerSize) ? map.get(containerSize)! : 0;
map.set(containerSize, oldCount + current.count);
return map;
}, new Map<number, number>());
const xyContainerCountMap = new Map(
[...unsortedContainerCountMap.entries()].sort((a, b) => a[0] - b[0])
);
// Calculate the previous power of 2 to find the lower bound of the range
// Ex: for 2048, the lower bound is 1024
const xContainerCountValues = Array.from(xyContainerCountMap.keys()).map(value => {
Expand Down
Loading