Style paginator component

src/lib/pagination/pagination.ts

@@ -1,6 +1,4 @@
-import { identity } from 'ramda'
-import { flow, A } from '@mobily/ts-belt'
-const { drop, take } = A
+import { identity, drop, take, pipe } from 'ramda'
 
 export interface PaginationQuery {
   offset?: number
@@ -14,7 +12,9 @@ export interface PaginationResult<ItemType> {
 }
 
 export function dropAndTake<Item>({ offset = 0, limit = Infinity }) {
-  return flow(drop<Item>(offset), take<Item>(limit))
+  return pipe(drop<Item>(offset), take<Item>(limit)) as (
+    items: Item[]
+  ) => Item[]
 }
 
 export function filterByPropContains<Item>(filters: Record<string, string>) {

src/lib/pagination/searchParams.test.ts

@@ -42,22 +42,37 @@ describe('get search params', () => {
   })
 
   test('should parse values into searchParams for first page', () => {
-    const params = 'tags/News/page/1'
-    expect(getPaginationSearchParams(7, params).toString()).toEqual(
+    const params = {
+      pageSize: 7,
+      page: 1,
+      filters: {
+        tags: 'News',
+      },
+    }
+    expect(getPaginationSearchParams(params).toString()).toEqual(
       'limit=7&offset=0&tags=News'
     )
   })
 
   test('should parse values into searchParams for third page', () => {
-    const params = 'tags/News/page/3'
-    expect(getPaginationSearchParams(7, params).toString()).toEqual(
+    const params = {
+      pageSize: 7,
+      page: 3,
+      filters: {
+        tags: 'News',
+      },
+    }
+    expect(getPaginationSearchParams(params).toString()).toEqual(
       'limit=7&offset=14&tags=News'
     )
   })
 
   test('should return first page without any params specified', () => {
-    const params = ''
-    expect(getPaginationSearchParams(7, params).toString()).toEqual(
+    const params = {
+      pageSize: 7,
+      page: 1,
+    }
+    expect(getPaginationSearchParams(params).toString()).toEqual(
       'limit=7&offset=0'
     )
   })

src/lib/pagination/searchParams.ts

@@ -34,12 +34,26 @@ export function parseParams(params: string) {
   return Object.fromEntries(splits)
 }
 
+export function toParams(records: Record<string, string>) {
+  return Object.entries(records)
+    .map(([key, value]) => `${key}/${value}`)
+    .join('/')
+}
+
+export interface PaginationSearchParams {
+  pageSize: number
+  page: number
+  filters?: Record<string, string>
+}
+
 /**
  * Convert svelte `load` params into a `URLSearchParams` so they can be used to fetch endpoints with pagination queries
  */
-export function getPaginationSearchParams(pageSize: number, params: string) {
-  const { page = 1, ...filters } = parseParams(params)
-
+export function getPaginationSearchParams({
+  pageSize,
+  page,
+  filters,
+}: PaginationSearchParams) {
   const offset = pageSize * (page - 1)
   const limit = pageSize
   return new URLSearchParams({ limit, offset, ...filters })