refactor: simplify pagination (#66)

* refactor: make `page` required in PaginateFn and let StickyNavigation handle page reset

* test: adjust test to new implementation

* chore: implement pr suggestions

Author: HendrikThePendric

src/components/line-list/__tests__/line-list.spec.tsx

@@ -163,7 +163,7 @@ describe('LineList', () => {
             ).getByText('50')
             await user.click(option50)
 
-            expect(onPaginate).toHaveBeenCalledWith({ pageSize: 50 })
+            expect(onPaginate).toHaveBeenCalledWith({ page: 1, pageSize: 50 })
         })
 
         it('displays pagination information correctly', async () => {

src/components/line-list/sticky-pagination.tsx

@@ -40,7 +40,7 @@ const StickyPagination = ({
     )
     const onPageSizeChange = useCallback(
         (pageSize: number) => {
-            onPaginate({ pageSize })
+            onPaginate({ page: 1, pageSize })
         },
         [onPaginate]
     )

src/components/line-list/types.ts

@@ -52,10 +52,6 @@ export type DataSortPayload = {
     dimension: string
     direction?: SortDirection
 }
-export type PaginatePayload = {
-    page?: number
-    pageSize?: number
-}
 export type DataSortFn = (payload: DataSortPayload) => void
-export type PaginateFn = (payload: PaginatePayload) => void
+export type PaginateFn = (payload: { page: number; pageSize?: number }) => void
 export type ColumnHeaderClickFn = (cleanedHeaderName: string) => void

src/components/plugin-wrapper/line-list-plugin.tsx

@@ -4,7 +4,11 @@ import { useLineListAnalyticsData } from './hooks/use-line-list-analytics-data'
 import type { MetadataInput } from '@components/app-wrapper/metadata-helpers'
 import { LineList } from '@components/line-list'
 import type { LineListAnalyticsData } from '@components/line-list'
-import type { DataSortFn, DataSortPayload } from '@components/line-list/types'
+import type {
+    DataSortFn,
+    DataSortPayload,
+    PaginateFn,
+} from '@components/line-list/types'
 import { transformVisualization } from '@modules/visualization'
 import type { CurrentUser, CurrentVisualization, SortDirection } from '@types'
 
@@ -19,9 +23,6 @@ type LineListPluginProps = {
     onResponseReceived?: (metadata: MetadataInput) => void
 }
 
-const FIRST_PAGE: number = 1
-const PAGE_SIZE: number = 100
-
 export const LineListPlugin: FC<LineListPluginProps> = ({
     displayProperty,
     visualization: originalVisualization,
@@ -52,8 +53,8 @@ export const LineListPlugin: FC<LineListPluginProps> = ({
             ...newPagination,
         }),
         {
-            page: FIRST_PAGE,
-            pageSize: PAGE_SIZE,
+            page: 1,
+            pageSize: 100,
         }
     )
 
@@ -62,15 +63,11 @@ export const LineListPlugin: FC<LineListPluginProps> = ({
         ? visualization.sorting[0]
         : { dimension: undefined, direction: undefined }
 
-    const onPaginate = useCallback(({ page, pageSize }) => {
+    const onPaginate = useCallback<PaginateFn>(({ page, pageSize }) => {
         if (pageSize) {
-            setPagination({ page: pageSize ? FIRST_PAGE : page, pageSize })
-        } else if (page) {
-            setPagination({ page })
+            setPagination({ page, pageSize })
         } else {
-            throw new Error(
-                'onPaginate was called with neither a page nor pageSize. At least one is expected'
-            )
+            setPagination({ page })
         }
     }, [])