title: next js Router.push reloads page
body: <p>When I do <code>Router.push</code> my page reloads, I would expect pushState to be used.</p>
  
  <p>Using the following code in the component:</p>
  
  <pre><code>import Router from "next/router";
  //other code
  const search = useCallback(
    e =&gt; {
      e.preventDefault();
      Router.push(
        `/products-search/${encodeURIComponent(
          searchText
        )}`,
        `/products-search?q=${encodeURIComponent(
          searchText
        )}`
      );
    },
    [searchText]
  );
  //other code
  &lt;form onSubmit={search}&gt;
    &lt;input
      type="text"
      onChange={change}
      value={searchText}
      pattern=".{3,}"
      title="3 characters minimum"
      required
    /&gt;
    &lt;button type="submit"&gt;OK&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>My page/products-search.js</p>
  
  <pre><code>ProductsSearch.getInitialProps = ({ query, store }) =&gt; {
    //added try catch as next js may reload if there is an error
    //  running this on the client side
    try {
      const queryWithPage = withPage(query);
      return {
        query: queryWithPage
      };
    } catch (e) {
      debugger;
    }
  };
  </code></pre>