Pagination component not keep track of existing parameters.

[htack210]

When I move between pages and I add a parameter like '&status=open' the page number updates as expected, but the 'status=open' piece drops off. As far as I can tell, my code matches what is in the course except for some of the formatting.

`"use client";

import { ChevronLeftIcon, ChevronRightIcon, DoubleArrowLeftIcon, DoubleArrowRightIcon, } from "@radix-ui/react-icons"; import { Button, Flex, Text } from "@radix-ui/themes"; import { useRouter, useSearchParams } from "next/navigation"; import React from "react";

interface Props { itemCount: number; pageSize: number; currentPage: number; }

const Pagination = ({ itemCount, pageSize, currentPage }: Props) => { const router = useRouter(); const searchParams = useSearchParams();

const pageCount = Math.ceil(itemCount / pageSize); if (pageCount <= 1) return null;

const changePage = (page: number) => { const params = new URLSearchParams(searchParams); params.set("page", page.toString()); router.push("?" + params.toString()); };

return (

Page {currentPage} of {pageCount} changePage(1)} > changePage(currentPage - 1)} > changePage(currentPage + 1)} > changePage(pageCount)} >

); };

export default Pagination; `

[htack210]

UPDATE: I fixed the problem by adding .toString(). It was: const changePage = (page: number) => { const params = new URLSearchParams(searchParams); params.set("page", page.toString()); router.push("?" + params.toString()); };

I changed that to this: const changePage = (page: number) => { const params = new URLSearchParams(searchParams.toString()); params.set("page", page.toString()); router.push("?" + params.toString()); };

Now it holds onto other query parameters.