Skip to content

Commit 9a6ffe1

Browse files
karestiandyuk1986
karesti
authored and
andyuk1986
committed
[#583] Fix schemas and counters display
1 parent c87c88d commit 9a6ffe1

File tree

4 files changed

+204
-159
lines changed

4 files changed

+204
-159
lines changed

‎cypress/e2e/5_empty_display.cy.js‎

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
describe('Empty values test', () => {
2+
it('successfully shows 0 counters and displays the modal', () => {
3+
cy.origin('http://localhost:31222/console/', () => {
4+
cy.visit("/", {
5+
headers: {
6+
'Accept-Encoding': 'gzip, deflate, br'
7+
},
8+
auth: {
9+
username: Cypress.env('username'),
10+
password: Cypress.env('password')
11+
}
12+
});
13+
cy.get('[data-cy=sideBarToggle]').click();
14+
cy.contains("NYC");
15+
cy.get('[data-cy="tab-Counters"]').click({multiple: true, force: true});
16+
cy.contains("No counters");
17+
cy.contains("Click \"Create a counter\" and configure a counter. You can also create counters from the CLI or remote clients.");
18+
cy.get('button[data-cy="createCounterButton"]').click();
19+
cy.get("#create-counter-modal").should('exist');
20+
cy.get('[aria-label=Cancel]').click();
21+
cy.get("#create-counter-modal").should('not.exist');
22+
})
23+
});
24+
25+
it('successfully shows 0 schemas and displays the modal', () => {
26+
cy.origin('http://localhost:31222/console/', () => {
27+
cy.visit("/", {
28+
headers: {
29+
'Accept-Encoding': 'gzip, deflate, br'
30+
},
31+
auth: {
32+
username: Cypress.env('username'),
33+
password: Cypress.env('password')
34+
}
35+
});
36+
cy.get('[data-cy=sideBarToggle]').click();
37+
cy.contains("NYC");
38+
cy.get('[data-cy="tab-Schemas"]').click({multiple: true, force: true});
39+
cy.contains("No schema");
40+
cy.contains("Click \"Create a Protobuf schema\" and provide schema.");
41+
cy.get('button[data-cy="createSchemaButton"]').click();
42+
cy.get("#create-schema-modal").should('exist');
43+
cy.get('[data-cy="cancelAddSchemaButton"]').click();
44+
cy.get("#create-schema-modal").should('not.exist');
45+
})
46+
});
47+
48+
});

‎src/app/CacheManagers/CounterTableDisplay.tsx‎

Lines changed: 63 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -217,20 +217,13 @@ const CounterTableDisplay = (props: { setCountersCount: (number) => void; isVisi
217217
};
218218
}, [isFilterOpen, menuRef]);
219219

220-
const createCounterButtonHelper = (isEmptyPage?: boolean) => {
221-
const emptyPageButtonProp = {
222-
style: { marginTop: t_global_spacer_xl.value }
223-
};
224-
const normalPageButtonProps = {
225-
style: { marginLeft: t_global_spacer_sm.value }
226-
};
220+
const createCounterButtonHelper = () => {
227221
return (
228222
<Button
229223
variant={ButtonVariant.primary}
230224
aria-label="create-counter-button-helper"
231225
data-cy="createCounterButton"
232226
onClick={() => setIsCreateCounter(true)}
233-
{...(isEmptyPage ? emptyPageButtonProp : normalPageButtonProps)}
234227
>
235228
{t('cache-managers.counters.modal-create-title')}
236229
</Button>
@@ -338,7 +331,7 @@ const CounterTableDisplay = (props: { setCountersCount: (number) => void; isVisi
338331
headingLevel="h4"
339332
>
340333
<EmptyStateBody>{t('cache-managers.counters.no-counters-body')}</EmptyStateBody>
341-
<EmptyStateFooter>{createCounterButtonHelper(true)}</EmptyStateFooter>
334+
<EmptyStateFooter>{createCounterButtonHelper()}</EmptyStateFooter>
342335
</EmptyState>
343336
);
344337

@@ -383,66 +376,71 @@ const CounterTableDisplay = (props: { setCountersCount: (number) => void; isVisi
383376
return <span />;
384377
}
385378

386-
if (counters.length == 0) {
387-
return emptyPage;
379+
let page = emptyPage;
380+
if (counters.length > 0) {
381+
page = (
382+
<>
383+
{toolbar}
384+
<Table className={'counters-table'} aria-label={'counters-table-label'} variant={'compact'}>
385+
<Thead>
386+
<Tr>
387+
<Th colSpan={1}>{columnNames.name}</Th>
388+
<Th colSpan={1}>{columnNames.currVal}</Th>
389+
<Th colSpan={1}>{columnNames.initVal}</Th>
390+
<Th colSpan={1}>{columnNames.storage}</Th>
391+
<Th colSpan={2}>{columnNames.config}</Th>
392+
</Tr>
393+
</Thead>
394+
<Tbody>
395+
{filteredCounters.length == 0 ? (
396+
<Tr>
397+
<Td colSpan={6}>
398+
<Bullseye>
399+
<EmptyState variant={EmptyStateVariant.sm} icon={SearchIcon}>
400+
<Title headingLevel="h2" size="lg">
401+
{t('cache-managers.counters.no-filtered-counter')}
402+
</Title>
403+
<EmptyStateBody>{t('cache-managers.counters.no-filtered-counter-body')}</EmptyStateBody>
404+
</EmptyState>
405+
</Bullseye>
406+
</Td>
407+
</Tr>
408+
) : (
409+
rows.map((row) => {
410+
let rowActions: IAction[];
411+
if (row.config.type === CounterType.STRONG_COUNTER) {
412+
rowActions = strongCountersActions(row);
413+
} else {
414+
rowActions = weakCountersActions(row);
415+
}
416+
return (
417+
<Tr key={row.name}>
418+
<Td dataLabel={columnNames.name}>{row.name}</Td>
419+
<Td dataLabel={columnNames.currVal}>{numberWithCommas(row.value)}</Td>
420+
<Td dataLabel={columnNames.initVal}>{numberWithCommas(row.config.initialValue)}</Td>
421+
<Td dataLabel={columnNames.storage}>{displayStorage(row.config.storage)}</Td>
422+
<Td dataLabel={columnNames.config}>{displayConfig(row.config)}</Td>
423+
<Td isActionCell data-cy={'actions-' + row.name}>
424+
<ActionsColumn items={rowActions} />
425+
</Td>
426+
</Tr>
427+
);
428+
})
429+
)}
430+
</Tbody>
431+
</Table>
432+
{filteredCounters.length !== 0 && (
433+
<Toolbar id="bottom-pagination-counter">
434+
<ToolbarItem variant={ToolbarItemVariant.pagination}>{pagination('up')}</ToolbarItem>
435+
</Toolbar>
436+
)}
437+
</>
438+
);
388439
}
389440

390441
return (
391442
<React.Fragment>
392-
{toolbar}
393-
<Table className={'counters-table'} aria-label={'counters-table-label'} variant={'compact'}>
394-
<Thead>
395-
<Tr>
396-
<Th colSpan={1}>{columnNames.name}</Th>
397-
<Th colSpan={1}>{columnNames.currVal}</Th>
398-
<Th colSpan={1}>{columnNames.initVal}</Th>
399-
<Th colSpan={1}>{columnNames.storage}</Th>
400-
<Th colSpan={2}>{columnNames.config}</Th>
401-
</Tr>
402-
</Thead>
403-
<Tbody>
404-
{filteredCounters.length == 0 ? (
405-
<Tr>
406-
<Td colSpan={6}>
407-
<Bullseye>
408-
<EmptyState variant={EmptyStateVariant.sm} icon={SearchIcon}>
409-
<Title headingLevel="h2" size="lg">
410-
{t('cache-managers.counters.no-filtered-counter')}
411-
</Title>
412-
<EmptyStateBody>{t('cache-managers.counters.no-filtered-counter-body')}</EmptyStateBody>
413-
</EmptyState>
414-
</Bullseye>
415-
</Td>
416-
</Tr>
417-
) : (
418-
rows.map((row) => {
419-
let rowActions: IAction[];
420-
if (row.config.type === CounterType.STRONG_COUNTER) {
421-
rowActions = strongCountersActions(row);
422-
} else {
423-
rowActions = weakCountersActions(row);
424-
}
425-
return (
426-
<Tr key={row.name}>
427-
<Td dataLabel={columnNames.name}>{row.name}</Td>
428-
<Td dataLabel={columnNames.currVal}>{numberWithCommas(row.value)}</Td>
429-
<Td dataLabel={columnNames.initVal}>{numberWithCommas(row.config.initialValue)}</Td>
430-
<Td dataLabel={columnNames.storage}>{displayStorage(row.config.storage)}</Td>
431-
<Td dataLabel={columnNames.config}>{displayConfig(row.config)}</Td>
432-
<Td isActionCell data-cy={'actions-' + row.name}>
433-
<ActionsColumn items={rowActions} />
434-
</Td>
435-
</Tr>
436-
);
437-
})
438-
)}
439-
</Tbody>
440-
</Table>
441-
{filteredCounters.length !== 0 && (
442-
<Toolbar id="bottom-pagination-counter">
443-
<ToolbarItem variant={ToolbarItemVariant.pagination}>{pagination('up')}</ToolbarItem>
444-
</Toolbar>
445-
)}
443+
{page}
446444
<DeleteCounter
447445
name={counterToDelete}
448446
isModalOpen={counterToDelete != ''}

‎src/app/ProtoSchema/CreateProtoSchema.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -156,6 +156,7 @@ const CreateProtoSchema = (props: { isModalOpen: boolean; closeModal: (boolean)
156156

157157
return (
158158
<Modal
159+
id={'create-schema-modal'}
159160
isOpen={props.isModalOpen}
160161
className="pf-m-redhat-font"
161162
onClose={() => clearCreateProtoSchema(false)}

0 commit comments

Comments
 (0)