1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
|
import { useEffect, useState } from "react";
export default function GetMedia(session, stats) {
const [anime, setAnime] = useState([]);
const [manga, setManga] = useState([]);
const [recommendations, setRecommendations] = useState([]);
const accessToken = session?.user?.token || null;
const username = session?.user?.name;
const status = stats || null;
const fetchGraphQL = async (query, variables) => {
const response = await fetch("https://graphql.anilist.co/", {
method: "POST",
headers: {
"Content-Type": "application/json",
...(accessToken && { Authorization: `Bearer ${accessToken}` }),
},
body: JSON.stringify({ query, variables }),
});
return response.json();
};
useEffect(() => {
if (!username || !accessToken) return;
const queryMedia = `
query ($username: String, $status: MediaListStatus, $sort: [RecommendationSort]) {
Page(page: 1, perPage: 10) {
recommendations(sort: $sort, onList: true) {
mediaRecommendation {
id
title {
userPreferred
}
description
format
type
status(version: 2)
bannerImage
isAdult
coverImage {
extraLarge
}
}
}
}
anime: MediaListCollection(userName: $username, type: ANIME, status: $status, sort: UPDATED_TIME_DESC) {
lists {
status
name
entries {
id
mediaId
status
progress
score
media {
id
status
nextAiringEpisode {
timeUntilAiring
episode
}
title {
english
romaji
}
episodes
coverImage {
large
}
}
}
}
}
manga: MediaListCollection(userName: $username, type: MANGA, status: $status, sort: UPDATED_TIME_DESC) {
lists {
status
name
entries {
id
mediaId
status
progress
score
media {
id
status
nextAiringEpisode {
timeUntilAiring
episode
}
title {
english
romaji
}
episodes
coverImage {
large
}
}
}
}
}
}
`;
fetchGraphQL(queryMedia, {
username,
status: status?.stats,
sort: "ID_DESC",
}).then((data) => {
setAnime(data.data.anime?.lists);
setManga(data.data.manga?.lists);
setRecommendations(
data.data.Page.recommendations.map((i) => i.mediaRecommendation)
);
});
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [username, accessToken, status?.stats]);
return { anime, manga, recommendations };
}
|