Skip to content

Commit 3a28c9c

Browse files
author
sam
committed
feat(subgraph): subgraph template
1 parent 2f73493 commit 3a28c9c

24 files changed

+669
-1
lines changed

‎template/cra-subgraph

-1
This file was deleted.

‎template/create-subgraph-app/.env.example

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
REACT_APP_GRAPH_NETWORK='Mainnet'
2+
REACT_APP_GRAPH_HTTP='https://api.thegraph.com/subgraphs/name/protofire/makerdao'
3+
REACT_APP_GRAPH_WS='wss://api.thegraph.com/subgraphs/name/protofire/makerdao'

‎template/create-subgraph-app/.eslintignore

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
!.eslintrc.js
2+
build
3+
config
4+
coverage
5+
node_modules
6+
public
7+
src/assets
8+
src/Tests
9+
src/global.js
10+
src/serviceWorker.js

‎template/create-subgraph-app/.eslintrc.json

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{
2+
"env": {
3+
"browser": true,
4+
"es6": true,
5+
"node": true
6+
},
7+
"extends": [
8+
"plugin:prettier/recommended",
9+
"plugin:react/recommended",
10+
"plugin:import/errors",
11+
"plugin:import/warnings",
12+
"prettier"
13+
],
14+
"plugins": ["react", "import", "prettier"],
15+
"parser": "babel-eslint",
16+
"rules": {
17+
"array-callback-return": 2,
18+
"no-unused-vars": [
19+
"error",
20+
{ "vars": "all", "args": "after-used", "ignoreRestSiblings": true }
21+
],
22+
"no-console": 1,
23+
"quotes": ["error", "single", { "avoidEscape": true }],
24+
"no-undef": 2
25+
}
26+
}

‎template/create-subgraph-app/.github/workflows/nodejs.yml

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
# GitHub Nodejs CI
2+
name: nodejs
3+
4+
on: [push, pull_request]
5+
6+
jobs:
7+
build:
8+
runs-on: ubuntu-latest
9+
10+
strategy:
11+
matrix:
12+
node-version: ['12.x']
13+
14+
steps:
15+
- uses: actions/checkout@v1
16+
- name: Use Node.js ${{ matrix.node-version }}
17+
uses: actions/setup-node@v1
18+
with:
19+
node-version: ${{ matrix.node-version }}
20+
- name: npm install, build, and test
21+
run: |
22+
npm install codecov -g
23+
npm install
24+
codecov
25+
env:
26+
CI: true

‎template/create-subgraph-app/.gitignore

+23
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# production
12+
/build
13+
14+
# misc
15+
.DS_Store
16+
.env.local
17+
.env.development.local
18+
.env.test.local
19+
.env.production.local
20+
21+
npm-debug.log*
22+
yarn-debug.log*
23+
yarn-error.log*

‎template/create-subgraph-app/.prettierignore

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
build
2+
config
3+
coverage
4+
node_modules
5+
public
6+
src/assets
7+
src/Tests
8+
src/global.js
9+
src/serviceWorker.js

‎template/create-subgraph-app/.prettierrc.js

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
module.exports = require('@protofire/subgraph-toolkit/prettier.config.js')

‎template/create-subgraph-app/package.json

+75
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
{
2+
"name": "cra-subgraph-boilerplate",
3+
"version": "0.1.0",
4+
"private": true,
5+
"dependencies": {
6+
"@apollo/react-hooks": "^3.0.1",
7+
"@protofire/subgraph-toolkit": "0.1.1",
8+
"@types/jest": "^24.0.18",
9+
"@types/node": "^12.7.3",
10+
"@types/react": "^16.9.2",
11+
"@types/react-dom": "^16.9.0",
12+
"apollo-cache-inmemory": "^1.6.3",
13+
"apollo-client": "^2.6.4",
14+
"apollo-link": "^1.2.12",
15+
"apollo-link-error": "^1.1.11",
16+
"apollo-link-http": "^1.5.15",
17+
"apollo-link-ws": "^1.0.18",
18+
"dotenv-flow": "^3.1.0",
19+
"graphql": "^14.5.4",
20+
"graphql-tag": "^2.10.1",
21+
"react": "^16.9.0",
22+
"react-dom": "^16.9.0",
23+
"react-scripts": "3.1.1",
24+
"subscriptions-transport-ws": "^0.9.16",
25+
"typescript": "^3.6.2"
26+
},
27+
"scripts": {
28+
"start": "react-scripts start",
29+
"build": "react-scripts build",
30+
"test": "react-scripts test",
31+
"eject": "react-scripts eject",
32+
"generateGQLTypes": "node scripts/generateGQLTypes.js"
33+
},
34+
"eslintConfig": {
35+
"extends": "react-app"
36+
},
37+
"browserslist": {
38+
"production": [
39+
">0.2%",
40+
"not dead",
41+
"not op_mini all"
42+
],
43+
"development": [
44+
"last 1 chrome version",
45+
"last 1 firefox version",
46+
"last 1 safari version"
47+
]
48+
},
49+
"husky": {
50+
"hooks": {
51+
"pre-commit": "yarn generateGQLTypes && git add ./src/types/generatedGQL.ts && yarn tsc && lint-staged"
52+
}
53+
},
54+
"lint-staged": {
55+
"**/*.{ts,tsx,json,graphql,md}": [
56+
"prettier --write",
57+
"git add"
58+
],
59+
"scr/**/*.{ts, tsx}": [
60+
"eslint --fix",
61+
"git add"
62+
]
63+
},
64+
"devDependencies": {
65+
"apollo": "^2.18.0",
66+
"eslint-config-prettier": "^6.0.0",
67+
"eslint-plugin-import": "^2.14.0",
68+
"eslint-plugin-prettier": "^3.0.0",
69+
"eslint-plugin-react": "^7.11.1",
70+
"husky": "^3.0.4",
71+
"lint-staged": "^9.2.5",
72+
"prettier": "^2.2.1",
73+
"yaml": "^1.10.0"
74+
}
75+
}

‎template/create-subgraph-app/schema.graphql

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
2+
# Metrics Module
3+
interface Metric @entity {
4+
id: ID!
5+
}
6+
7+
type Accumulator implements Metric @entity {
8+
id: ID!
9+
total: BigDecimal!
10+
}
11+
12+
type Counter implements Metric @entity {
13+
id: ID!
14+
count: BigInt!
15+
}

‎template/create-subgraph-app/scripts/generateGQLTypes.js

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
const { exec } = require('child_process')
2+
require('dotenv-flow').config()
3+
4+
exec(
5+
`apollo client:codegen src/types/generatedGQL.ts --endpoint ${process.env.REACT_APP_GRAPH_HTTP} --outputFlat --target typescript`,
6+
err => {
7+
if (err) {
8+
console.log(err)
9+
return
10+
}
11+
12+
console.log(`GQL Types generated from endpoint: ${process.env.REACT_APP_GRAPH_HTTP}`)
13+
},
14+
)

‎template/create-subgraph-app/src/apolloClientConfig.ts

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import { ApolloClient } from 'apollo-client'
2+
import { InMemoryCache } from 'apollo-cache-inmemory'
3+
import { split } from 'apollo-link'
4+
import { HttpLink } from 'apollo-link-http'
5+
import { WebSocketLink } from 'apollo-link-ws'
6+
import { getMainDefinition } from 'apollo-utilities'
7+
8+
// Create an http link:
9+
const httpLink = new HttpLink({
10+
uri: process.env.REACT_APP_GRAPH_HTTP,
11+
})
12+
13+
// Create a WebSocket link:
14+
const wsLink = new WebSocketLink({
15+
uri: process.env.REACT_APP_GRAPH_WS as string,
16+
options: {
17+
reconnect: true,
18+
},
19+
})
20+
21+
// using the ability to split links, you can send data to each link
22+
// depending on what kind of operation is being sent
23+
const link = split(
24+
// split based on operation type
25+
({ query }) => {
26+
const definition = getMainDefinition(query)
27+
return definition.kind === 'OperationDefinition' && definition.operation === 'subscription'
28+
},
29+
wsLink,
30+
httpLink,
31+
)
32+
33+
export const client = new ApolloClient({
34+
link,
35+
cache: new InMemoryCache(),
36+
})

‎template/create-subgraph-app/src/containers/App/index.css

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.App {
2+
text-align: center;
3+
}

‎template/create-subgraph-app/src/containers/App/index.test.tsx

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import React from 'react'
2+
import ReactDOM from 'react-dom'
3+
import App from './index'
4+
5+
it('renders without crashing', () => {
6+
const div = document.createElement('div')
7+
ReactDOM.render(<App />, div)
8+
ReactDOM.unmountComponentAtNode(div)
9+
})

‎template/create-subgraph-app/src/containers/App/index.tsx

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import React from 'react'
2+
3+
import ExampleMakerDaoCpdEngine from '../ExampleMakerDaoCpdEngine'
4+
5+
import './index.css'
6+
7+
function App() {
8+
return (
9+
<div className="App">
10+
<p>React Subgraph - starter kit</p>
11+
<ExampleMakerDaoCpdEngine />
12+
</div>
13+
)
14+
}
15+
16+
export default App

‎template/create-subgraph-app/src/containers/ExampleMakerDaoCpdEngine/CdpEngineDetail.tsx

+49
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
import React, { useEffect } from 'react'
2+
3+
import './index.css'
4+
5+
import { GetCdpEngine_cdpEngine } from '../../types/generatedGQL'
6+
7+
type Props = {
8+
data: GetCdpEngine_cdpEngine
9+
subscribeToChanges: () => void
10+
}
11+
12+
function SummaryDetail(props: Props) {
13+
const { data, subscribeToChanges } = props
14+
15+
useEffect(() => {
16+
subscribeToChanges()
17+
})
18+
19+
return (
20+
<div className="MakerDaoCdpEngineContainer">
21+
<div className="MakerDaoCdpEngineContainerDetail">
22+
<div>Total CDPs: </div>
23+
<div>{data.cdpCount}</div>
24+
</div>
25+
<div className="MakerDaoCdpEngineContainerDetail">
26+
<div>Total open CDPs</div>
27+
<div>{data.openCdpCount}</div>
28+
</div>
29+
<div className="MakerDaoCdpEngineContainerDetail">
30+
<div>Total collateral</div>
31+
<div>{data.totalCollateral}</div>
32+
</div>
33+
<div className="MakerDaoCdpEngineContainerDetail">
34+
<div>Total debt</div>
35+
<div>{data.totalDebt}</div>
36+
</div>
37+
<div className="MakerDaoCdpEngineContainerDetail">
38+
<div>Last block processed</div>
39+
<div>{data.lastBlock}</div>
40+
</div>
41+
<div className="MakerDaoCdpEngineContainerDetail">
42+
<div>Total unique owners</div>
43+
<div>{data.cdpOwners.length}</div>
44+
</div>
45+
</div>
46+
)
47+
}
48+
49+
export default SummaryDetail

‎template/create-subgraph-app/src/containers/ExampleMakerDaoCpdEngine/index.css

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
.MakerDaoCdpEngineContainer {
2+
display: flex;
3+
flex-direction: column;
4+
align-items: center;
5+
}
6+
7+
.MakerDaoCdpEngineContainerDetail {
8+
display: flex;
9+
flex-direction: row;
10+
justify-content: space-between;
11+
width: 50%;
12+
}

0 commit comments

Comments
 (0)