Skip to content
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

Jump to bottom

fix: [M3-8740] - Convert Object Storage size from GiB to GB in frontend #11293

Open
wants to merge 5 commits into
base: develop
Choose a base branch
from
Open

fix: [M3-8740] - Convert Object Storage size from GiB to GB in frontend #11293

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
59aebdf
fix: [M3-8740] - Convert Object Storage size from GiB to GB in frontend
hasyed-akamai Nov 20, 2024
a10b4d7
Added changeset: Convert Object Storage bucket sizes from `GiB` to `G…
hasyed-akamai Nov 20, 2024
f59d9c7
Merge branch 'develop' into M3-8740-show-bucket-size-in-GB-from-GiB
hasyed-akamai Nov 22, 2024
574f52a
refactor: [M3-8740] - Convert Object Storage size from GiB to GB in f…
hasyed-akamai Nov 22, 2024
9b10b11
Merge branch 'develop' into M3-8740-show-bucket-size-in-GB-from-GiB
hasyed-akamai Nov 28, 2024
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
5 changes: 5 additions & 0 deletions packages/manager/.changeset/pr-11293-fixed-1732102749040.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@linode/manager": Fixed
---

Convert Object Storage bucket sizes from `GiB` to `GB` in the frontend ([#11293](https://github.com/linode/manager/pull/11293))
3 changes: 2 additions & 1 deletion packages/manager/src/components/Uploaders/FileUpload.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,7 +92,8 @@ export const FileUpload = React.memo((props: FileUploadProps) => {
})}
variant="body1"
>
{readableBytes(props.sizeInBytes).formatted}
{/* to convert the Bytes to equivalent MB/GB we need to pass the base10 flag as true */}
{readableBytes(props.sizeInBytes, { base10: true }).formatted}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: You could add a comment to provide context for enabling base10.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Optional: this comment is not super clear. Essentially what you are doing here is converting from binary units (GiB) to decimal units (GB).

</StyledFileSizeTypography>
{props.percentCompleted === 100 ? (
<FileUploadComplete
Expand Down
2 changes: 1 addition & 1 deletion packages/manager/src/features/ObjectStorage/BucketDetail/ObjectDetailsDrawer.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ describe('ObjectDetailsDrawer', () => {
expect(getByText(/^Last modified: 2019-12-31/)).toBeInTheDocument()
);

expect(getByText('12.1 KB')).toBeInTheDocument();
expect(getByText('12.3 KB')).toBeInTheDocument();
expect(getByText(/^https:\/\/my-bucket/)).toBeInTheDocument();
});

Expand Down
3 changes: 2 additions & 1 deletion packages/manager/src/features/ObjectStorage/BucketDetail/ObjectDetailsDrawer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,8 @@ export const ObjectDetailsDrawer = React.memo(
>
{size ? (
<Typography variant="subtitle2">
{readableBytes(size).formatted}
{/* to convert the Bytes to equivalent MB/GB we need to pass the base10 flag as true */}
{readableBytes(size, { base10: true }).formatted}
</Typography>
) : null}
{formattedLastModified && Boolean(profile) ? (
Expand Down
5 changes: 4 additions & 1 deletion packages/manager/src/features/ObjectStorage/BucketDetail/ObjectTableRow.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,10 @@ export const ObjectTableRow = (props: Props) => {
</Grid>
</Grid>
</TableCell>
<TableCell noWrap>{readableBytes(objectSize).formatted}</TableCell>
<TableCell noWrap>
{/* to convert the Bytes to equivalent MB/GB we need to pass the base10 flag as true */}
{readableBytes(objectSize, { base10: true }).formatted}
</TableCell>
<Hidden mdDown>
<TableCell noWrap>
<DateTimeDisplay value={objectLastModified} />
Expand Down
3 changes: 2 additions & 1 deletion packages/manager/src/features/ObjectStorage/BucketLanding/BucketDetailsDrawer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,8 @@ export const BucketDetailsDrawer = React.memo(
)}
{typeof size === 'number' && (
<Typography variant="subtitle2">
{readableBytes(size).formatted}
{/* to convert the Bytes to equivalent MB/GB we need to pass the base10 flag as true */}
{readableBytes(size, { base10: true }).formatted}
</Typography>
)}
{/* @TODO OBJ Multicluster: use region instead of cluster if isObjMultiClusterEnabled. */}
Expand Down
2 changes: 1 addition & 1 deletion packages/manager/src/features/ObjectStorage/BucketLanding/BucketLanding.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ describe('ObjectStorageLanding', () => {

it('renders a "Total usage" section if there is more than one Bucket', async () => {
const buckets = objectStorageBucketFactory.buildList(2, {
size: 1024 * 1024 * 1024 * 5,
size: 1e9 * 5,
});

// Mock Clusters
Expand Down
4 changes: 3 additions & 1 deletion packages/manager/src/features/ObjectStorage/BucketLanding/BucketLanding.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -183,7 +183,9 @@ export const BucketLanding = () => {
style={{ marginTop: 18, textAlign: 'center', width: '100%' }}
variant="body1"
>
Total storage used: {readableBytes(totalUsage).formatted}
Total storage used:{' '}
{/* to convert the Bytes to equivalent MB/GB we need to pass the base10 flag as true */}
{readableBytes(totalUsage, { base10: true }).formatted}
</Typography>
) : null}
<TransferDisplay
Expand Down
2 changes: 1 addition & 1 deletion packages/manager/src/features/ObjectStorage/BucketLanding/BucketTableRow.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,6 @@ describe('BucketTableRow', () => {
const { getByText } = renderWithTheme(
wrapWithTableBody(<BucketTableRow {...props} />)
);
getByText('5.05 GB');
getByText('5.42 GB');
});
});
3 changes: 2 additions & 1 deletion packages/manager/src/features/ObjectStorage/BucketLanding/BucketTableRow.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,8 @@ export const BucketTableRow = (props: BucketTableRowProps) => {
</Hidden>
<StyledBucketSizeCell noWrap>
<Typography data-qa-size variant="body1">
{readableBytes(size).formatted}
{/* to convert the Bytes to equivalent MB/GB we need to pass the base10 flag as true */}
{readableBytes(size, { base10: true }).formatted}
</Typography>
</StyledBucketSizeCell>

Expand Down
4 changes: 3 additions & 1 deletion packages/manager/src/features/ObjectStorage/BucketLanding/OMC_BucketLanding.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -171,7 +171,9 @@ export const OMC_BucketLanding = () => {
style={{ marginTop: 18, textAlign: 'center', width: '100%' }}
variant="body1"
>
Total storage used: {readableBytes(totalUsage).formatted}
Total storage used:{' '}
{/* to convert the Bytes to equivalent MB/GB we need to pass the base10 flag as true */}
{readableBytes(totalUsage, { base10: true }).formatted}
</Typography>
) : null}
<TransferDisplay spacingTop={buckets.length > 1 ? 8 : 18} />
Expand Down