NextJS – not typing after fetching from Route Handler

I have a Route Handler like below.

app/api/auth/me

import { NextRequest, NextResponse } from "next/server";
import axios from "../../axios";


export interface DefaultResponse<T> {
  success: boolean;
  message?: string;
  data?: T;
}

export async function GET(): Promise<NextResponse<DefaultResponse<User>>> {
    const user = await axios.get(`/auth/me`);
    return NextResponse.json(
      { success: true, data: user.data },
      { status: 200 }
    );
}

Right now, when I fetch from the route handler

  useEffect(() => {
    async function fetchUserProfile() {
      try {
        const userProfileRaw = await fetch(`/api/auth/me`);
        const userRes = await userProfileRaw.json();
        ...
      } catch (err) {...}
    }
    fetchUserProfile();
  }, []);

There is no typing for userRes, which I expect should be DefaultResponse<User>.

Of course I am add the type manually like

 const userRes: DefaultResponse<User> = await userProfileRaw.json();

but it would be a lot of work if I have to do it every time.

Just wondering if it’s fixable?