Cannot get route type for some routes

export const Route = createFileRoute("/_authenticated/campaigns/drafts")({
  component: CampaignsDraftsComponent,
  loader(ctx) {
    ctx.context.queryClient.ensureQueryData(
      convexQuery(api.campaigns.queries.getCampaigns, {
        filter: {
          anyOfStatus: ["draft"],
        },
      })
    );
  },
});

<NavMain
  item={{
    title: "Campaigns",
    route: campaignRoute, // <-- this works!
    icon: Megaphone,
    subItems: [
      {
        title: "Overview",
        route: campaignRoute, // <-- this works!
      },
      {
        title: "Drafts",
        route: campaignDraftsRoute, // <-- this doesn't work! :\
      },

export function NavMain<TRoute extends AnyRoute>({
  title,
  item,
}: {
  title?: string;
  item: {
    title: string;
    route: TRoute;
    icon?: LucideIcon;
    subItems?: {
      title: string;
      route: TRoute;
    }[];
  };
}) {
...

// this type of route works:
export const Route = createFileRoute("/_authenticated/campaigns/overview")({
  component: CampaignsOverviewComponent,
});

// a route with a loader does not:
export const Route = createFileRoute("/_authenticated/campaigns/overview")({
  component: CampaignsOverviewComponent,
  loader(ctx) {
     ...
   }
});