Electron Dynamic Routes - No routing

[CallumGracie95]

Having massive dramas getting dynamic routes in electron to work for me. Any help would be great, It's successfully getting Id and triggering click. I've tried various patterns from docs to no success. All my other routes work fine

The paths I have are

src\pages\vehicles$vehicleId.tsx

src\pages\vehicles\index.tsx

When I click a vehicle from the list it triggers the event and passes the ID even if logged in createRoute but it doesn't route me anywhere. Nothing happens except my breadcrumb is updated with the vehicle ID as expected.

export const VehiclesRoute = createRoute({
    getParentRoute: () => RootRoute,
    path: "/vehicles",
    component: VehiclePage,
});

// Vehicle detail route
export const VehicleDetailRoute = createRoute({
    getParentRoute: () => VehiclesRoute,
    path: "$vehicleId",
    component: VehicleDetailPage,
    params: {
        parse: (params: { vehicleId: string }) => {
            return params;
        }
    }
});



export const rootTree = RootRoute.addChildren([
    HomeRoute,
    VehiclesRoute.addChildren([
        VehicleDetailRoute,
    ]),

here is my click handler

const handleVehicleClick = (vehicle: Vehicle) => {
    // Update to use TanStack Router navigation
    navigate({ 
        to: '/vehicles/$vehicleId',
        params: { vehicleId: vehicle.id.toString() }
    });
    useLayoutStore.getState().setDynamicSegment(
        'id',
        `${vehicle.make} ${vehicle.model} (${vehicle.registrationNumber})`
    );
};

The page I'm trying to route on click

export default function VehicleDetailPage() {
  const { vehicleId } = useParams({ from: '/vehicles/$vehicleId' });