Skip to content
Merged
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
/* eslint-disable react/prop-types */
import React from 'react';
import { css } from '@leafygreen-ui/emotion';
import { css, cx } from '@leafygreen-ui/emotion';
import { Body, Tooltip } from './leafygreen';

const underline = css({
Expand All @@ -15,6 +15,10 @@ const maxWidth = css({
maxWidth: '360px',
});

const breakSpaces = css({
whiteSpace: 'break-spaces',
});

const InlineDefinition: React.FunctionComponent<
React.HTMLProps<HTMLSpanElement> & {
definition: React.ReactNode;
Expand All @@ -34,7 +38,7 @@ const InlineDefinition: React.FunctionComponent<
}
{...tooltipProps}
>
<Body className={maxWidth}>{definition}</Body>
<Body className={cx(maxWidth, breakSpaces)}>{definition}</Body>
</Tooltip>
);
};
Expand Down
32 changes: 24 additions & 8 deletions packages/databases-collections-list/src/collections.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -126,30 +126,46 @@ const CollectionsList: React.FunctionComponent<{
: coll.type === 'timeseries'
? [
{
label: 'Storage size',
label: 'Storage',
value:
coll.calculated_storage_size !== undefined
? compactBytes(coll.calculated_storage_size)
: 'N/A',
hint:
coll.calculated_storage_size !== undefined &&
'Storage Data: Sum of the disk space allocated to all collections in the database for document storage.',
},
{
label: 'Uncompressed data',
value:
coll.document_size !== undefined
? compactBytes(coll.document_size)
: 'N/A',
hint:
coll.document_size !== undefined &&
`Uncompressed data size: ${compactBytes(
coll.document_size
)}`,
'Uncompressed Data Size: Total size of the uncompressed data held in the database.',
},
]
: [
{
label: 'Storage size',
label: 'Storage',
value:
coll.calculated_storage_size !== undefined
? compactBytes(coll.calculated_storage_size)
: 'N/A',
hint:
coll.calculated_storage_size !== undefined &&
'Storage Data: Sum of the disk space allocated to all collections in the database for document storage.',
},
{
label: 'Uncompressed data',
value:
coll.document_size !== undefined
? compactBytes(coll.document_size)
: 'N/A',
hint:
coll.document_size !== undefined &&
`Uncompressed data size: ${compactBytes(
coll.document_size
)}`,
'Uncompressed Data Size: Total size of the uncompressed data held in the database.',
},
{
label: 'Documents',
Expand Down
15 changes: 12 additions & 3 deletions packages/databases-collections-list/src/databases.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -74,15 +74,24 @@ const DatabasesList: React.FunctionComponent<{
inferredFromPrivileges={db.inferred_from_privileges}
data={[
{
label: 'Storage size',
label: 'Storage',
value:
enableDbAndCollStats && db.storage_size !== undefined
? compactBytes(db.storage_size)
: 'N/A',
hint:
enableDbAndCollStats &&
db.data_size !== undefined &&
`Uncompressed data size: ${compactBytes(db.data_size)}`,
'Storage Data: Sum of the disk space allocated to all collections in the database for document storage.',
},
{
label: 'Uncompressed data',
value:
enableDbAndCollStats && db.data_size !== undefined
? compactBytes(db.data_size)
: 'N/A',
hint:
enableDbAndCollStats &&
'Uncompressed Data Size: Total size of the uncompressed data held in the database.',
},
{
label: 'Collections',
Expand Down
13 changes: 9 additions & 4 deletions packages/databases-collections-list/src/index.spec.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -151,8 +151,10 @@ describe('databases and collections list', function () {
expect(screen.getAllByTestId('database-grid-item')).to.have.lengthOf(1);
expect(screen.getByText('foo')).to.exist;

expect(screen.getByText(/Storage size/)).to.exist;
expect(screen.getByText(/Storage/)).to.exist;
expect(screen.getByText('1.50 kB')).to.exist;
expect(screen.getByText(/Uncompressed data/)).to.exist;
expect(screen.getByText('1.00 kB')).to.exist;
expect(screen.getByText(/Collections/)).to.exist;
expect(screen.getByText('35')).to.exist;
expect(screen.getByText(/Indexes/)).to.exist;
Expand Down Expand Up @@ -249,7 +251,7 @@ describe('databases and collections list', function () {
]);
});

it('should not display statistics (except storage size) on timeseries collection card', function () {
it('should not display statistics (except storage and uncompressed data size) on timeseries collection card', function () {
renderCollectionsList({
namespace: 'db',
collections: colls,
Expand All @@ -260,7 +262,8 @@ describe('databases and collections list', function () {
.getByText('bat.bat')
.closest('[data-testid="collection-grid-item"]');
expect(timeseriesCard).to.exist;
expect(timeseriesCard).to.contain.text('Storage size:');
expect(timeseriesCard).to.contain.text('Storage:');
expect(timeseriesCard).to.contain.text('Uncompressed data:');
expect(timeseriesCard).to.not.contain.text('Documents:');
expect(timeseriesCard).to.not.contain.text('Avg. document size::');
expect(timeseriesCard).to.not.contain.text('Indexes:');
Expand All @@ -278,8 +281,10 @@ describe('databases and collections list', function () {
onCollectionClick: () => {},
});

expect(screen.getByText(/Storage size/)).to.exist;
expect(screen.getByText(/Storage/)).to.exist;
expect(screen.getByText('1.50 kB')).to.exist;
expect(screen.getByText(/Uncompressed data/)).to.exist;
expect(screen.getByText('11.00 B')).to.exist;
expect(screen.getByText(/Documents/)).to.exist;
expect(screen.getByText('10')).to.exist;
expect(screen.getByText(/Avg. document size/)).to.exist;
Expand Down
Loading