How to mock useSearchParams hook in NextJs for RTL and Jest testing?

I'm using NextJS 14 for my project. In login component, I'm using hook useSearchParams to get the role_type from URL params and based on the value I'm showing forms. I'm new to Jest and RTL and I'm writing tests for login page and the tests are failing. Below I'm attaching the screenshot of the error I'm encountering.

I tried multiple solutions like

jest.mock("next/navigation", () => ({    ...jest.requireActual('next/navigation'),  useSearchParams: () => new URLSearchParams({ role_type: 'staff' }),}))

and

jest.mock("react-router-dom", () => ({    ...jest.requireActual("react-router-dom"),    useSearchParams: jest.fn(),  }));

I also tried the solution provided in this stackoverflow question, but none of them worked. If anyone having solution, please help me out here.