diff --git a/src/components/paginator-ui-component.ts b/src/components/paginator-ui-component.ts index 446c85a..d39cc76 100644 --- a/src/components/paginator-ui-component.ts +++ b/src/components/paginator-ui-component.ts @@ -10,8 +10,8 @@ import type { Nullable, } from '../internal/types'; -export type PaginatorActionIdFn = StringReturnableFn; +export type PaginatorActionIdFn = +StringReturnableFn; export interface PageCountTextFnParams { page: number; @@ -28,10 +28,11 @@ interface PaginatorUIComponentParams { previousButtonText: Nullable; pageCountTextFunction: Nullable; actionIdFunction: PaginatorActionIdFn; - builderFunction: PaginatorBuilderFn, + builderFunction: PaginatorBuilderFn; } -const defaultPageCountText = ({ page, totalPages }: PageCountTextFnParams) => `Page ${page} of ${totalPages}`; +const defaultPageCountText = ({ page, totalPages }: PageCountTextFnParams) => + `Page ${page} of ${totalPages}`; export class PaginatorUIComponent { private readonly items: T[]; @@ -65,6 +66,28 @@ export class PaginatorUIComponent { blocksForEach.push(this.builderFunction({ item: this.items[i] }).flat()); } + const actionButtons = []; + + if (this.paginator.getPage() > 1) { + actionButtons.push(Elements.Button({ + text: this.previousButtonText, + actionId: this.actionIdFunction({ + buttonId: PaginatorButtonId.Previous, + ...this.paginator.getPreviousPageState(), + }), + })); + } + + if (this.paginator.getPage() < this.paginator.getTotalPages()) { + actionButtons.push(Elements.Button({ + text: this.nextButtonText, + actionId: this.actionIdFunction({ + buttonId: PaginatorButtonId.Next, + ...this.paginator.getNextPageState(), + }), + })); + } + const unpruned = this.paginator.getTotalPages() > 1 ? [ ...blocksForEach.flat(), @@ -73,23 +96,7 @@ export class PaginatorUIComponent { totalPages: this.paginator.getTotalPages(), })), Blocks.Divider(), - Blocks.Actions() - .elements( - Elements.Button({ - text: this.previousButtonText, - actionId: this.actionIdFunction({ - buttonId: PaginatorButtonId.Previous, - ...this.paginator.getPreviousPageState(), - }), - }), - Elements.Button({ - text: this.nextButtonText, - actionId: this.actionIdFunction({ - buttonId: PaginatorButtonId.Next, - ...this.paginator.getNextPageState(), - }), - }), - ), + Blocks.Actions().elements(...actionButtons), ] : blocksForEach.flat(); diff --git a/tests/components/easy-paginator.spec.ts b/tests/components/easy-paginator.spec.ts index 0e5b8bf..7e66f9c 100644 --- a/tests/components/easy-paginator.spec.ts +++ b/tests/components/easy-paginator.spec.ts @@ -15,7 +15,7 @@ const getModalString = (blocks: BlockBuilder[]): string => Modal({ title: 'Testi .buildToJSON(); describe('Testing Easy Paginator:', () => { - test('Creating a paginator with the default parameters creates the correct UI and callback data.', () => { + test('Creating a paginator with the default parameters creates the correct UI and callback data for the first page.', () => { const result = getModalString(EasyPaginator({ page: 1, perPage: 5, @@ -184,14 +184,6 @@ describe('Testing Easy Paginator:', () => { }, { elements: [ - { - text: { - type: 'plain_text', - text: 'Previous', - }, - action_id: '{"buttonId":"previous","totalItems":20,"perPage":5,"totalPages":4,"offset":15,"page":4}', - type: 'button', - }, { text: { type: 'plain_text', @@ -401,7 +393,7 @@ describe('Testing Easy Paginator:', () => { })); }); - test('Creating a paginator with the default parameters creates the correct UI and callback data.', () => { + test('Creating a paginator with the default parameters creates the correct UI and callback data for the last page.', () => { const result = getModalString(EasyPaginator({ items: humans, page: 4, @@ -581,14 +573,6 @@ describe('Testing Easy Paginator:', () => { action_id: '{"buttonId":"previous","totalItems":20,"perPage":5,"totalPages":4,"offset":10,"page":3}', type: 'button', }, - { - text: { - type: 'plain_text', - text: 'TEST FORWARD', - }, - action_id: '{"buttonId":"next","totalItems":20,"perPage":5,"totalPages":4,"offset":0,"page":1}', - type: 'button', - }, ], type: 'actions', }, diff --git a/tests/components/paginator.spec.ts b/tests/components/paginator.spec.ts index ab7e065..8f71e04 100644 --- a/tests/components/paginator.spec.ts +++ b/tests/components/paginator.spec.ts @@ -19,7 +19,7 @@ const getModalString = (blocks: BlockBuilder[]): string => Modal({ title: 'Testi .buildToJSON(); describe('Testing Paginator:', () => { - test('Creating a paginator with the default parameters creates the correct UI and callback data.', () => { + test('Creating a paginator with the default parameters creates the correct UI and callback data for the first page.', () => { const items = [humans[0], humans[1], humans[2], humans[3], humans[4]]; const result = getModalString(Paginator({ items, @@ -190,14 +190,6 @@ describe('Testing Paginator:', () => { }, { elements: [ - { - text: { - type: 'plain_text', - text: 'Previous', - }, - action_id: '{"buttonId":"previous","totalItems":20,"perPage":5,"totalPages":4,"offset":15,"page":4}', - type: 'button', - }, { text: { type: 'plain_text', @@ -409,7 +401,7 @@ describe('Testing Paginator:', () => { })); }); - test('Creating a paginator with the default parameters creates the correct UI and callback data.', () => { + test('Creating a paginator on the last page creates the correct UI and callback data.', () => { const items = [humans[15], humans[16], humans[17], humans[18], humans[19]]; const result = getModalString(Paginator({ items, @@ -591,14 +583,6 @@ describe('Testing Paginator:', () => { action_id: '{"buttonId":"previous","totalItems":20,"perPage":5,"totalPages":4,"offset":10,"page":3}', type: 'button', }, - { - text: { - type: 'plain_text', - text: 'TEST FORWARD', - }, - action_id: '{"buttonId":"next","totalItems":20,"perPage":5,"totalPages":4,"offset":0,"page":1}', - type: 'button', - }, ], type: 'actions', }, @@ -789,14 +773,6 @@ describe('Testing Paginator:', () => { }, { elements: [ - { - text: { - type: 'plain_text', - text: 'Previous', - }, - action_id: '{"buttonId":"previous","totalItems":20,"perPage":5,"totalPages":4,"offset":15,"page":4}', - type: 'button', - }, { text: { type: 'plain_text',