Next.js Discord

Discord Forum

UseRouter bug in Dynamic page

Unanswered
Polar bear posted this in #help-forum
Open in Discord
Polar bearOP
## ❓ Next.js custom useRouter not redirecting on dynamic page

Hey! I'm using a custom useRouter wrapper in a dynamic route [id]/page.tsx. When calling router.push("/projects"), nothing happens — no redirect.

### Page code
"use client";
import ProjectEB from "@shared/books/project/ProjectEB";
import { useTProject } from "@shared/hooks/models";
import { useRouter } from "custom-router";
import { useEffect, useState, use } from "react";

export default function ProjectPage({ params }: { params: any }) {
  const { id } = use<{ id: string }>(params);
  const { byId, update } = useTProject({ id });
  const router = useRouter();
  const [isEditorOpen, setIsEditorOpen] = useState(true);

  useEffect(() => {
    setIsEditorOpen(true);
  }, [id]);

  if (!byId.data) return <div>Loading...</div>;
  if (!isEditorOpen) return null;

  return (
    <ProjectEB
      isOpen={isEditorOpen}
      item={byId.data}
      onUpdate={update}
      onClose={() => {
        setIsEditorOpen(false);
        router.push("/projects"); // ← does nothing
      }}
    />
  );
}


### Custom useRouter snippet
export const useRouter = () => {
  const router = useRouterNext();
  const { baseUrl } = useCurrentUrl();

  return {
    push: (uri) => router.push(`${baseUrl}/${uri}`),
    replace: (uri) => router.replace(`${baseUrl}/${uri}`),
    refresh: () => router.refresh(),
  };
};


### ❗ Issue
push("/projects") becomes something like /[current]/projects because of the baseUrl logic. I want it to go to the actual /projects.

### ❓Question
How can I fix my wrapper to support absolute paths (starting with /) without breaking the baseUrl logic?

Thanks 🙏

1 Reply

Sloth bear
Can you not just return
{
    push: (uri) => router.push(uri),
   //  etc. ...
};

?

It's not clear to me why you need the baseUrl. (Or the custom useRouter)