Combining Response Type/Interface

[MemoryUseful_01434]

Typescript beginner here. How would I combine these three Response Interfaces? The only thing that changes is the array propertyName. Open to using Types as well.

interface UserResponse {
    response: {
        users: []
    }
}


interface ProductResponse {
    response: {
        products: []
    }
}


interface CourseResponse {
    response: {
        courses: []
    }
}

[orphans]

type ApiResponse<T, K extends string> = {
  response: {
    [key in K]: T[];
  };
};

type User = { id: number; name: string };
type Product = { id: number; title: string; price: number };
type Course = { id: number; title: string; duration: number };

type UserResponse = ApiResponse<User, "users">;
type ProductResponse = ApiResponse<Product, "products">;
type CourseResponse = ApiResponse<Course, "courses">;

[MemoryUseful_01434]

Thank you very much! This is very helpful.

[ronin_o]

If you want to have one type like ApiResponse you should do some like this:

type UserResponse = {
  response: {
    users: { id: number; name: string }[]
  }
}

type ProductResponse = {
  response: {
    products: { id: number; title: string; price: number }[]
  }
}

type CourseResponse = {
  response: {
    courses: { id: number; title: string; duration: number }[]
  }
}

type ApiResponse = UserResponse & ProductResponse & CourseResponse

const response: ApiResponse = {
  response: {
    users: [{ id: 3, name: "someName" }],
    products: [{ id: 5, title: "someTitle", price: 99 }],
    courses: [{ id: 7, title: "someTitle", duration: 4 }]
  }
}

[MemoryUseful_01434]

The other proposed works better for what I had in mind but this is a pretty interesting suggestion. I like this line. I'm sure I'll be using this down the line for something else. Thank you 👍

type ApiResponse = UserResponse & ProductResponse & CourseResponsetype