diff --git a/frontend/src/__tests__/cypress/cypress/pages/clusterStorage.ts b/frontend/src/__tests__/cypress/cypress/pages/clusterStorage.ts index 4cbcfd458f..f12e0aa66d 100644 --- a/frontend/src/__tests__/cypress/cypress/pages/clusterStorage.ts +++ b/frontend/src/__tests__/cypress/cypress/pages/clusterStorage.ts @@ -32,9 +32,8 @@ class ClusterStorageRow extends TableRow { return this.find().find('[data-label="Storage class"]'); } - shouldHaveStorageSize(name: string) { - this.find().siblings().find('[data-label=Size]').contains(name).should('exist'); - return this; + findSizeColumn() { + return this.find().find('[data-label="Storage size"]'); } showStorageClassDetails() { diff --git a/frontend/src/__tests__/cypress/cypress/tests/mocked/projects/clusterStorage.cy.ts b/frontend/src/__tests__/cypress/cypress/tests/mocked/projects/clusterStorage.cy.ts index f67b28c0c4..c00900abbd 100644 --- a/frontend/src/__tests__/cypress/cypress/tests/mocked/projects/clusterStorage.cy.ts +++ b/frontend/src/__tests__/cypress/cypress/tests/mocked/projects/clusterStorage.cy.ts @@ -338,11 +338,9 @@ describe('ClusterStorage', () => { clusterStorageRow.findStorageClassColumn().should('not.exist'); clusterStorageRow.shouldHaveStorageTypeValue('Persistent storage'); clusterStorageRow.findConnectedWorkbenches().should('have.text', 'No connections'); - clusterStorageRow.toggleExpandableContent(); - clusterStorageRow.shouldHaveStorageSize('5Gi'); + clusterStorageRow.findSizeColumn().contains('5GiB'); //sort by Name - clusterStorage.findClusterStorageTableHeaderButton('Name').click(); clusterStorage.findClusterStorageTableHeaderButton('Name').should(be.sortAscending); clusterStorage.findClusterStorageTableHeaderButton('Name').click(); clusterStorage.findClusterStorageTableHeaderButton('Name').should(be.sortDescending); @@ -354,8 +352,7 @@ describe('ClusterStorage', () => { const clusterStorageRow = clusterStorage.getClusterStorageRow( 'Updated storage with no workbench', ); - clusterStorageRow.toggleExpandableContent(); - clusterStorageRow.shouldHaveStorageSize('Max 13Gi'); + clusterStorageRow.findSizeColumn().should('have.text', 'Max 13GiB'); clusterStorageRow.findStorageSizeWarning(); clusterStorageRow.findStorageSizeWarning().should('exist'); }); diff --git a/frontend/src/pages/projects/components/StorageSizeBars.tsx b/frontend/src/pages/projects/components/StorageSizeBars.tsx index 4dc4946eb4..b6abdf2726 100644 --- a/frontend/src/pages/projects/components/StorageSizeBars.tsx +++ b/frontend/src/pages/projects/components/StorageSizeBars.tsx @@ -64,10 +64,7 @@ const StorageSizeBar: React.FC = ({ pvc }) => { if (error) { inUseRender = ( - + ); } else if (!loaded) { diff --git a/frontend/src/pages/projects/screens/detail/storage/StorageTable.tsx b/frontend/src/pages/projects/screens/detail/storage/StorageTable.tsx index 17c58a511a..0b6eacd434 100644 --- a/frontend/src/pages/projects/screens/detail/storage/StorageTable.tsx +++ b/frontend/src/pages/projects/screens/detail/storage/StorageTable.tsx @@ -76,7 +76,6 @@ const StorageTable: React.FC = ({ pvcs, refresh, onAddPVC }) ( diff --git a/frontend/src/pages/projects/screens/detail/storage/StorageTableRow.tsx b/frontend/src/pages/projects/screens/detail/storage/StorageTableRow.tsx index f07df762b1..22f60d5b62 100644 --- a/frontend/src/pages/projects/screens/detail/storage/StorageTableRow.tsx +++ b/frontend/src/pages/projects/screens/detail/storage/StorageTableRow.tsx @@ -1,12 +1,5 @@ import * as React from 'react'; -import { - ActionsColumn, - ExpandableRowContent, - IAction, - Tbody, - Td, - Tr, -} from '@patternfly/react-table'; +import { ActionsColumn, IAction, Td, Tr } from '@patternfly/react-table'; import { Flex, FlexItem, @@ -46,7 +39,6 @@ const StorageTableRow: React.FC = ({ onEditPVC, onAddPVC, }) => { - const [isExpanded, setExpanded] = React.useState(false); const isRootVolume = useIsRootVolume(obj.pvc); const isStorageClassesAvailable = useIsAreaAvailable(SupportedArea.STORAGE_CLASSES).status; @@ -73,124 +65,102 @@ const StorageTableRow: React.FC = ({ } return ( - - - + + + {isStorageClassesAvailable && ( + - - {isStorageClassesAvailable && ( - - )} - - {workbenchEnabled && ( - - )} - - - - + + {workbenchEnabled && ( + - - + )} + + ); }; diff --git a/frontend/src/pages/projects/screens/detail/storage/data.ts b/frontend/src/pages/projects/screens/detail/storage/data.ts index 3731d6234e..b7c7e31bb1 100644 --- a/frontend/src/pages/projects/screens/detail/storage/data.ts +++ b/frontend/src/pages/projects/screens/detail/storage/data.ts @@ -4,11 +4,6 @@ import { getStorageClassConfig } from '~/pages/storageClasses/utils'; import { StorageTableData } from './types'; export const columns: SortableData[] = [ - { - field: 'expand', - label: '', - sortable: false, - }, { field: 'name', label: 'Name', @@ -36,6 +31,12 @@ export const columns: SortableData[] = [ width: 20, sortable: false, }, + { + field: 'storage_size', + label: 'Storage size', + width: 20, + sortable: false, + }, { field: 'connected', label: 'Workbench connections',
setExpanded(!isExpanded), - }} - /> - +
+ + + + + + + + + {getDescriptionFromK8sResource(obj.pvc)} + - - - - - {getDescriptionFromK8sResource(obj.pvc)} - - + {storageClassesLoaded && ( - - - {storageClassesLoaded && ( - - {!obj.storageClass ? ( - + {!obj.storageClass ? ( + + + + ) : ( + storageClassConfig?.isEnabled === false && ( + - ) : ( - storageClassConfig?.isEnabled === false && ( - - - - ) - )} - - )} - - - {storageClassesLoaded ? storageClassConfig?.description : } - - - - - - + ) + )} - {` Persistent storage`} - + )} + + + {storageClassesLoaded ? storageClassConfig?.description : } - - - -
- - - Size - - + )} + + + + + + + {` Persistent storage`} + + + + + + - - -
+ +