I'm looking for a way to make a type/interface from this API response, The nested comments
property is challenging for me.
"data": [
{
"id": 1,
"comment": "This is the comment to another comment",
"approved": true,
"archived": 0,
"pinned": 0,
"reported": 0,
"created_at": "2022-06-24T06:12:25.000000Z",
"updated_at": "2022-06-24T06:12:25.000000Z",
"comments": [
{
"id": 2,
"comment": "This is the comment to another comment",
"approved": true,
"archived": 0,
"pinned": 0,
"reported": 0,
"created_at": "2022-06-24T06:12:37.000000Z",
"updated_at": "2022-06-24T06:12:37.000000Z",
"comments": [
{
"id": 3,
"comment": "This is the comment to another comment",
"approved": true,
"archived": 0,
"pinned": 0,
"reported": 0,
"created_at": "2022-06-24T06:32:52.000000Z",
"updated_at": "2022-06-24T06:32:52.000000Z",
"comments": [],
"commented": {
"id": 1,
"first_name": "Test",
"last_name": "Testi",
"full_name": "Test Testi"
}
},
{
"id": 4,
"comment": "This is the comment to another comment",
"approved": true,
"archived": 0,
"pinned": 0,
"reported": 0,
"created_at": "2022-06-24T06:32:57.000000Z",
"updated_at": "2022-06-24T06:32:57.000000Z",
"comments": [],
"commented": {
"id": 1,
"first_name": "Test",
"last_name": "Testi",
"full_name": "Test Testi"
}
}
],
"commented": {
"id": 1,
"first_name": "Test",
"last_name": "Testi",
"full_name": "Test Testi"
}
}
],
"commented": {
"id": 1,
"first_name": "Test",
"last_name": "Testi",
"full_name": "Test Testi"
}
},
],
CodePudding user response:
export interface Comment {
id: number;
comment: string;
approved: boolean;
archived: boolean;
pinned: boolean;
reported: boolean;
created_at: string;
updated_at: string;
comments: Comment[];
commented: {
id: number;
first_name: string;
last_name: string;
full_name: string;
};
}
CodePudding user response:
Comment
is part of lib.dom.d.ts
, so better use CommentData
instead
interface CommentData {
id: number;
comment: string;
approved: boolean;
archived: number;
pinned: number;
reported: number;
created_at: string;
updated_at: string;
comments: CommentData[];
commented: User;
}
interface User {
id: number;
first_name: string;
last_name: string;
full_name: string;
}
interface Data {
data: CommentData[];
}
const data: Data = {
data: [
{
id: 1,
comment: "This is the comment to another comment",
approved: true,
archived: 0,
pinned: 0,
reported: 0,
created_at: "2022-06-24T06:12:25.000000Z",
updated_at: "2022-06-24T06:12:25.000000Z",
comments: [
{
id: 2,
comment: "This is the comment to another comment",
approved: true,
archived: 0,
pinned: 0,
reported: 0,
created_at: "2022-06-24T06:12:37.000000Z",
updated_at: "2022-06-24T06:12:37.000000Z",
comments: [
{
id: 3,
comment: "This is the comment to another comment",
approved: true,
archived: 0,
pinned: 0,
reported: 0,
created_at: "2022-06-24T06:32:52.000000Z",
updated_at: "2022-06-24T06:32:52.000000Z",
comments: [],
commented: {
id: 1,
first_name: "Test",
last_name: "Testi",
full_name: "Test Testi",
},
},
{
id: 4,
comment: "This is the comment to another comment",
approved: true,
archived: 0,
pinned: 0,
reported: 0,
created_at: "2022-06-24T06:32:57.000000Z",
updated_at: "2022-06-24T06:32:57.000000Z",
comments: [],
commented: {
id: 1,
first_name: "Test",
last_name: "Testi",
full_name: "Test Testi",
},
},
],
commented: {
id: 1,
first_name: "Test",
last_name: "Testi",
full_name: "Test Testi",
},
},
],
commented: {
id: 1,
first_name: "Test",
last_name: "Testi",
full_name: "Test Testi",
},
},
],
};
console.log(data);