next js Router.push reloads page

In case some lost soul comes here with my issue, it was kind of invisible.

router.push(
      '/organizations/[oid]/clients/[uid]',
      `/organizations/${oid}/clients/${id}`
    );

is what I wrote and it navigated without a refresh.

router.push(
      '/organizations/[oid]/clients/[cid]',// cid mistaken name but still worked. Should be uid
      `/organizations/${oid}/clients/${id}`
    );

The mistaken id name was causing the refresh, though it still navigated to the right page. So, make sure the id names are correct.

When I pass an object to Router.push it works as expected:

const search = useCallback(
  e => {
    e.preventDefault();
    Router.push({
      pathname: "/products-search",
      query: { q: searchText }
    });
  },
  [searchText]
);