|
1 | | -import 'dotenv/config'; |
2 | | -import 'cross-fetch/polyfill'; |
3 | | -import ApolloClient, { gql } from 'apollo-boost'; |
4 | | - |
5 | | -let state = { |
6 | | - organization: null, |
7 | | -}; |
8 | | - |
9 | | -const client = new ApolloClient({ |
10 | | - uri: 'https://api.github.com/graphql', |
11 | | - request: operation => { |
12 | | - operation.setContext({ |
13 | | - headers: { |
14 | | - authorization: `Bearer ${process.env.GITHUB_PERSONAL_ACCESS_TOKEN}`, |
15 | | - }, |
16 | | - }); |
17 | | - }, |
18 | | -}); |
19 | | - |
20 | | -// QUERY |
21 | | - |
22 | | -const GET_REPOSITORIES_OF_ORGANIZATION = gql` |
23 | | - query($organization: String!, $cursor: String) { |
24 | | - organization(login: $organization) { |
25 | | - name |
26 | | - url |
27 | | - repositories( |
28 | | - first: 5 |
29 | | - orderBy: { direction: DESC, field: STARGAZERS } |
30 | | - after: $cursor |
31 | | - ) { |
32 | | - edges { |
33 | | - node { |
34 | | - ...repository |
35 | | - } |
36 | | - } |
37 | | - pageInfo { |
38 | | - endCursor |
39 | | - hasNextPage |
40 | | - } |
41 | | - } |
42 | | - } |
43 | | - } |
44 | | -
|
45 | | - fragment repository on Repository { |
46 | | - name |
47 | | - url |
48 | | - } |
49 | | -`; |
50 | | - |
51 | | -client |
52 | | - .query({ |
53 | | - query: GET_REPOSITORIES_OF_ORGANIZATION, |
54 | | - variables: { |
55 | | - organization: 'the-road-to-learn-react', |
56 | | - cursor: undefined, |
57 | | - }, |
58 | | - }) |
59 | | - // resolve first page |
60 | | - .then(result => { |
61 | | - const { pageInfo, edges } = result.data.organization.repositories; |
62 | | - const { endCursor, hasNextPage } = pageInfo; |
63 | | - |
64 | | - console.log('second page', edges.length); |
65 | | - console.log('endCursor', endCursor); |
66 | | - |
67 | | - return pageInfo; |
68 | | - }) |
69 | | - // query second page |
70 | | - .then(({ endCursor, hasNextPage }) => { |
71 | | - if (!hasNextPage) { |
72 | | - throw Error('no next page'); |
73 | | - } |
74 | | - |
75 | | - return client.query({ |
76 | | - query: GET_REPOSITORIES_OF_ORGANIZATION, |
77 | | - variables: { |
78 | | - organization: 'the-road-to-learn-react', |
79 | | - cursor: endCursor, |
80 | | - }, |
81 | | - }); |
82 | | - }) |
83 | | - // resolve second page |
84 | | - .then(result => { |
85 | | - const { pageInfo, edges } = result.data.organization.repositories; |
86 | | - const { endCursor, hasNextPage } = pageInfo; |
87 | | - |
88 | | - console.log('second page', edges.length); |
89 | | - console.log('endCursor', endCursor); |
90 | | - |
91 | | - return pageInfo; |
92 | | - }) |
93 | | - // log error when there is no next page |
94 | | - .catch(console.log); |
95 | | - |
96 | | -// MUTATION |
97 | | - |
98 | | -const ADD_STAR = gql` |
99 | | - mutation AddStar($repositoryId: ID!) { |
100 | | - addStar(input: { starrableId: $repositoryId }) { |
101 | | - starrable { |
102 | | - id |
103 | | - viewerHasStarred |
104 | | - } |
105 | | - } |
106 | | - } |
107 | | -`; |
108 | | - |
109 | | -const REMOVE_STAR = gql` |
110 | | - mutation RemoveStar($repositoryId: ID!) { |
111 | | - removeStar(input: { starrableId: $repositoryId }) { |
112 | | - starrable { |
113 | | - id |
114 | | - viewerHasStarred |
115 | | - } |
116 | | - } |
117 | | - } |
118 | | -`; |
119 | | - |
120 | | -client |
121 | | - .mutate({ |
122 | | - mutation: ADD_STAR, |
123 | | - variables: { |
124 | | - repositoryId: 'MDEwOlJlcG9zaXRvcnk2MzM1MjkwNw==', |
125 | | - }, |
126 | | - }) |
127 | | - .then(console.log); |
0 commit comments