mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2024-12-25 04:34:06 -08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix(editor): Ensure Datatable component renders All option (#10525)
Some checks are pending
Test Master / install-and-build (push) Waiting to run
Details
Test Master / Unit tests (18.x) (push) Blocked by required conditions
Details
Test Master / Unit tests (20.x) (push) Blocked by required conditions
Details
Test Master / Unit tests (22.4) (push) Blocked by required conditions
Details
Test Master / Lint (push) Blocked by required conditions
Details
Test Master / Notify Slack on failure (push) Blocked by required conditions
Details

Browse source
This commit is contained in:
Iván Ovejero 2024-08-27 10:12:39 +02:00 committed by GitHub
parent f71281221e
commit bc27beb662
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 31 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
packages/design-system/src/components/N8nDatatable/Datatable.vue
View file

@ -7,6 +7,8 @@ import type { DatatableColumn, DatatableRow, DatatableRowDataType } from '../../
import { useI18n } from '../../composables/useI18n';
import { getValueByPath } from '../../utils';
const ALL_ROWS = -1;
interface DatatableProps {
columns: DatatableColumn[];
rows: DatatableRow[];
@ -41,6 +43,8 @@ const totalRows = computed(() => {
});
const visibleRows = computed(() => {
if (props.rowsPerPage === ALL_ROWS) return props.rows;
const start = (props.currentPage - 1) * props.rowsPerPage;
const end = start + props.rowsPerPage;
@ -59,6 +63,11 @@ function onUpdateCurrentPage(value: number) {
function onRowsPerPageChange(value: number) {
emit('update:rowsPerPage', value);
if (value === ALL_ROWS) {
onUpdateCurrentPage(1);
return;
}
const maxPage = Math.ceil(totalRows.value / value);
if (maxPage < props.currentPage) {
onUpdateCurrentPage(maxPage);
@ -131,7 +140,7 @@ function getThStyle(column: DatatableColumn) {
:label="`${size}`"
:value="size"
/>
<N8nOption :label="`All`" value="*"> </N8nOption>
<N8nOption :label="`All`" :value="ALL_ROWS"> </N8nOption>
</N8nSelect>
</div>
</div>

21
packages/design-system/src/components/N8nDatatable/__tests__/Datatable.spec.ts
View file

@ -75,5 +75,26 @@ describe('components', () => {
);
expect(wrapper.container.querySelector('tbody td')?.textContent).toEqual('Row slot');
});
it('should render all rows when rowsPerPage is set to -1', () => {
const wrapper = render(N8nDatatable, {
props: { columns, rows, rowsPerPage: -1 },
global: { stubs },
});
const pagination = wrapper.container.querySelector('.pagination');
expect(pagination?.querySelector('.el-pager')).toBeNull();
const pageSizeSelector = wrapper.container.querySelector('.pageSizeSelector');
expect(pageSizeSelector?.textContent).toContain('Page size');
const allOption = wrapper.getByText('All');
expect(allOption).not.toBeNull();
expect(wrapper.container.querySelectorAll('tbody tr').length).toEqual(rows.length);
expect(wrapper.container.querySelectorAll('tbody tr td').length).toEqual(
columns.length * rows.length,
);
});
});
});