title: Different actions wanna perform on a common component
body: <p>Having a grid component but I am facing difficulty to call their actions for different pages.
  I made it work through router but that jump page and get that action and than return back to the same page. Is there any way I can do without router in next js?</p>
  <p>Here is my code:</p>
  <pre><code>const handleActions = (btnPress, row) =&gt; {
      if (btnPress === &quot;Add&quot;) router.push(`/admin/${actions}/[id]`, `/admin/${actions}/add`);
      else if (btnPress === &quot;Edit&quot;) router.push(`/admin/${actions}/[id]`, `/admin/${actions}/${row.original._id}`)
      else if (btnPress === &quot;Delete&quot;) router.push(`/admin/${actions}`, `/admin/${actions}/${row.original._id}`)}
  </code></pre>