From f6b77f8579679a1fec16dc130d0721cb6331310f Mon Sep 17 00:00:00 2001 From: Tom French Date: Mon, 10 Aug 2020 00:01:01 +0100 Subject: [PATCH 1/3] refactor: moved graphql queries in react templates to subgraph.js --- .../react/packages/react-app/src/App.js.hbs | 4 -- src/helpers/templates.ts | 1 + .../aave/packages/react-app/src/App.js.ctx | 17 +------ .../react-app/src/graphql/subgraph.js | 17 +++++++ .../packages/react-app/src/App.js.ctx | 29 +----------- .../react-app/src/graphql/subgraph.js | 29 ++++++++++++ .../default/packages/react-app/src/App.js.ctx | 15 +----- .../react-app/src/graphql/subgraph.js | 15 ++++++ .../kyber/packages/react-app/src/App.js.ctx | 21 +-------- .../react-app/src/graphql/subgraph.js | 21 +++++++++ .../maker/packages/react-app/src/App.js.ctx | 24 +--------- .../react-app/src/graphql/subgraph.js | 24 ++++++++++ .../packages/react-app/src/App.js.ctx | 46 +------------------ .../react-app/src/graphql/subgraph.js | 46 +++++++++++++++++++ .../packages/react-app/src/App.js.ctx | 25 +--------- .../react-app/src/graphql/subgraph.js | 25 ++++++++++ .../packages/react-app/src/App.js.ctx | 15 +----- .../react-app/src/graphql/subgraph.js | 15 ++++++ .../packages/react-app/src/App.js.ctx | 15 +----- .../react-app/src/graphql/subgraph.js | 14 ++++++ 20 files changed, 225 insertions(+), 193 deletions(-) create mode 100644 templates/react/aave/packages/react-app/src/graphql/subgraph.js create mode 100644 templates/react/compound/packages/react-app/src/graphql/subgraph.js create mode 100644 templates/react/default/packages/react-app/src/graphql/subgraph.js create mode 100644 templates/react/kyber/packages/react-app/src/graphql/subgraph.js create mode 100644 templates/react/maker/packages/react-app/src/graphql/subgraph.js create mode 100644 templates/react/sablier-v1/packages/react-app/src/graphql/subgraph.js create mode 100644 templates/react/synthetix/packages/react-app/src/graphql/subgraph.js create mode 100644 templates/react/uniswap-v1/packages/react-app/src/graphql/subgraph.js create mode 100644 templates/react/uniswap-v2/packages/react-app/src/graphql/subgraph.js diff --git a/handlebars/react/packages/react-app/src/App.js.hbs b/handlebars/react/packages/react-app/src/App.js.hbs index 59ad3244..51782101 100644 --- a/handlebars/react/packages/react-app/src/App.js.hbs +++ b/handlebars/react/packages/react-app/src/App.js.hbs @@ -2,16 +2,12 @@ import React from "react"; import logo from "./ethereumLogo.png"; import { Contract } from "@ethersproject/contracts"; import { getDefaultProvider } from "@ethersproject/providers"; -import { gql } from "apollo-boost"; import { useQuery } from "@apollo/react-hooks"; {{#each imports}} {{{ this }}} {{/each}} import "./App.css"; -{{#each graphqlQuery }} -{{{ this }}} -{{/each}} async function readOnChainData() { {{#each readOnChainData}} diff --git a/src/helpers/templates.ts b/src/helpers/templates.ts index 4f510f78..5a7782f5 100644 --- a/src/helpers/templates.ts +++ b/src/helpers/templates.ts @@ -24,6 +24,7 @@ export const standardFiles: Record = { "packages/react-app/README.md", "packages/react-app/src/index.js", "packages/react-app/src/App.js", + "packages/react-app/src/graphql/subgraph.js", ], vue: [ "package.json", diff --git a/templates/react/aave/packages/react-app/src/App.js.ctx b/templates/react/aave/packages/react-app/src/App.js.ctx index 1df3ef56..981f363e 100644 --- a/templates/react/aave/packages/react-app/src/App.js.ctx +++ b/templates/react/aave/packages/react-app/src/App.js.ctx @@ -1,22 +1,9 @@ { "callToAction": "Read On-Chain Balance", - "graphqlQuery": [ - "const GET_LENDING_POOL_CONFIGURATION_HISTORY_ITEMS = gql`", - " {", - " lendingPoolConfigurationHistoryItems(first: 5) {", - " id", - " provider {", - " id", - " }", - " lendingPool", - " lendingPoolCore", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_LENDING_POOL_CONFIGURATION_HISTORY_ITEMS", "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@aave-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@aave-app/contracts\";", + "import GET_LENDING_POOL_CONFIGURATION_HISTORY_ITEMS from \"./graphql/subgraph\";" ], "hooks": { "readData": [ diff --git a/templates/react/aave/packages/react-app/src/graphql/subgraph.js b/templates/react/aave/packages/react-app/src/graphql/subgraph.js new file mode 100644 index 00000000..c957a521 --- /dev/null +++ b/templates/react/aave/packages/react-app/src/graphql/subgraph.js @@ -0,0 +1,17 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/aave/protocol +const GET_LENDING_POOL_CONFIGURATION_HISTORY_ITEMS = gql` + { + lendingPoolConfigurationHistoryItems(first: 5) { + id + provider { + id + } + lendingPool + lendingPoolCore + } + } +`; + +export default GET_LENDING_POOL_CONFIGURATION_HISTORY_ITEMS; diff --git a/templates/react/compound/packages/react-app/src/App.js.ctx b/templates/react/compound/packages/react-app/src/App.js.ctx index 7e20f2fe..0416dbfa 100644 --- a/templates/react/compound/packages/react-app/src/App.js.ctx +++ b/templates/react/compound/packages/react-app/src/App.js.ctx @@ -1,31 +1,5 @@ { "callToAction": "Read On-Chain Balance", - "graphqlQuery": [ - "const GET_MONEY_MARKETS = gql`", - " {", - " markets(first: 7) {", - " borrowRate", - " cash", - " collateralFactor", - " exchangeRate", - " interestRateModelAddress", - " name", - " reserves", - " supplyRate", - " symbol", - " id", - " totalBorrows", - " totalSupply", - " underlyingAddress", - " underlyingName", - " underlyingPrice", - " underlyingSymbol", - " reserveFactor", - " underlyingPriceUSD", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_MONEY_MARKETS", "hooks": { "readData": [ @@ -35,7 +9,8 @@ ] }, "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@compound-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@compound-app/contracts\";", + "import GET_MONEY_MARKETS from \"./graphql/subgraph\";" ], "learnUrl": "https://compound.finance/developers", "readOnChainData": [ diff --git a/templates/react/compound/packages/react-app/src/graphql/subgraph.js b/templates/react/compound/packages/react-app/src/graphql/subgraph.js new file mode 100644 index 00000000..44376185 --- /dev/null +++ b/templates/react/compound/packages/react-app/src/graphql/subgraph.js @@ -0,0 +1,29 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/graphprotocol/compound-v2 +const GET_MONEY_MARKETS = gql` + { + markets(first: 7) { + borrowRate + cash + collateralFactor + exchangeRate + interestRateModelAddress + name + reserves + supplyRate + symbol + id + totalBorrows + totalSupply + underlyingAddress + underlyingName + underlyingPrice + underlyingSymbol + reserveFactor + underlyingPriceUSD + } + } +`; + +export default GET_MONEY_MARKETS; diff --git a/templates/react/default/packages/react-app/src/App.js.ctx b/templates/react/default/packages/react-app/src/App.js.ctx index 9b07848a..c2fcb18b 100644 --- a/templates/react/default/packages/react-app/src/App.js.ctx +++ b/templates/react/default/packages/react-app/src/App.js.ctx @@ -1,17 +1,5 @@ { "callToAction": "Read On-Chain Balance", - "graphqlQuery": [ - "const GET_TRANSFERS = gql`", - " {", - " transfers(first: 10) {", - " id", - " from", - " to", - " value", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_TRANSFERS", "hooks": { "readData": [ @@ -21,7 +9,8 @@ ] }, "imports": [ - "import { addresses, abis } from \"@project/contracts\";" + "import { addresses, abis } from \"@project/contracts\";", + "import GET_TRANSFERS from \"./graphql/subgraph\";" ], "learnUrl": "https://thegraph.com/docs/quick-start", "readOnChainData": [ diff --git a/templates/react/default/packages/react-app/src/graphql/subgraph.js b/templates/react/default/packages/react-app/src/graphql/subgraph.js new file mode 100644 index 00000000..82dbdaf1 --- /dev/null +++ b/templates/react/default/packages/react-app/src/graphql/subgraph.js @@ -0,0 +1,15 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/paulrberg/create-eth-app +const GET_TRANSFERS = gql` + { + transfers(first: 10) { + id + from + to + value + } + } +`; + +export default GET_TRANSFERS; diff --git a/templates/react/kyber/packages/react-app/src/App.js.ctx b/templates/react/kyber/packages/react-app/src/App.js.ctx index a34823cf..2bbaf096 100644 --- a/templates/react/kyber/packages/react-app/src/App.js.ctx +++ b/templates/react/kyber/packages/react-app/src/App.js.ctx @@ -1,23 +1,5 @@ { "callToAction": "Read On-Chain Exchange Rates", - "graphqlQuery": [ - "const GET_FULL_TRADES = gql`", - " {", - " fullTrades(first: 5) {", - " id", - " trader {", - " id", - " }", - " src {", - " id", - " }", - " dest {", - " id", - " }", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_FULL_TRADES", "hooks": { "readData": [ @@ -27,7 +9,8 @@ ] }, "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@kyber-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@kyber-app/contracts\";", + "import GET_FULL_TRADES from \"./graphql/subgraph\";" ], "learnUrl": "https://developer.kyber.network/", "readOnChainData": [ diff --git a/templates/react/kyber/packages/react-app/src/graphql/subgraph.js b/templates/react/kyber/packages/react-app/src/graphql/subgraph.js new file mode 100644 index 00000000..7c49a8d6 --- /dev/null +++ b/templates/react/kyber/packages/react-app/src/graphql/subgraph.js @@ -0,0 +1,21 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/protofire/kyber +const GET_FULL_TRADES = gql` + { + fullTrades(first: 5) { + id + trader { + id + } + src { + id + } + dest { + id + } + } + } +`; + +export default GET_FULL_TRADES; diff --git a/templates/react/maker/packages/react-app/src/App.js.ctx b/templates/react/maker/packages/react-app/src/App.js.ctx index 6d7c3cc0..782fab4a 100644 --- a/templates/react/maker/packages/react-app/src/App.js.ctx +++ b/templates/react/maker/packages/react-app/src/App.js.ctx @@ -1,29 +1,9 @@ { "callToAction": "Read On-Chain Collateral Information", - "graphqlQuery": [ - "const GET_COLLATERAL_TYPES = gql`", - " {", - " collateralTypes(orderBy: addedAt) {", - " name: id", - " price {", - " block", - " value", - " }", - " debtCeiling", - " totalDebt", - " liquidationLotSize", - " liquidationPenalty", - " liquidationRatio", - " stabilityFee", - " auctionCount", - " vaultCount", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_COLLATERAL_TYPES", "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@maker-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@maker-app/contracts\";", + "import GET_COLLATERAL_TYPES from \"./graphql/subgraph\";" ], "hooks": { "readData": [ diff --git a/templates/react/maker/packages/react-app/src/graphql/subgraph.js b/templates/react/maker/packages/react-app/src/graphql/subgraph.js new file mode 100644 index 00000000..75fd887e --- /dev/null +++ b/templates/react/maker/packages/react-app/src/graphql/subgraph.js @@ -0,0 +1,24 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/protofire/maker-protocol +const GET_COLLATERAL_TYPES = gql` + { + collateralTypes(orderBy: addedAt) { + name: id + price { + block + value + } + debtCeiling + totalDebt + liquidationLotSize + liquidationPenalty + liquidationRatio + stabilityFee + auctionCount + vaultCount + } + } +`; + +export default GET_COLLATERAL_TYPES; diff --git a/templates/react/sablier-v1/packages/react-app/src/App.js.ctx b/templates/react/sablier-v1/packages/react-app/src/App.js.ctx index f5fededb..1f8bc4d6 100644 --- a/templates/react/sablier-v1/packages/react-app/src/App.js.ctx +++ b/templates/react/sablier-v1/packages/react-app/src/App.js.ctx @@ -1,48 +1,5 @@ { "callToAction": "Read On-Chain Data", - "graphqlQuery": [ - "const GET_STREAMS = gql`", - " {", - " streams(first: 10, orderBy: timestamp, orderDirection: desc) {", - " id", - " cancellation {", - " recipientBalance", - " recipientInterest", - " timestamp", - " txhash", - " }", - " deposit", - " exchangeRateInitial", - " ratePerSecond", - " recipient", - " recipientSharePercentage", - " sender", - " senderSharePercentage", - " startTime", - " stopTime", - " timestamp", - " token {", - " id", - " decimals", - " name", - " symbol", - " }", - " txs {", - " id", - " block", - " event", - " from", - " timestamp", - " to", - " }", - " withdrawals {", - " id", - " amount", - " }", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_STREAMS", "hooks": { "readData": [ @@ -52,7 +9,8 @@ ] }, "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@sablier-v1-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@sablier-v1-app/contracts\";", + "import GET_STREAMS from \"./graphql/subgraph\";" ], "learnUrl": "https://docs.sablier.finance/", "readOnChainData": [ diff --git a/templates/react/sablier-v1/packages/react-app/src/graphql/subgraph.js b/templates/react/sablier-v1/packages/react-app/src/graphql/subgraph.js new file mode 100644 index 00000000..bca62fc8 --- /dev/null +++ b/templates/react/sablier-v1/packages/react-app/src/graphql/subgraph.js @@ -0,0 +1,46 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/sablierhq/sablier +const GET_STREAMS = gql` + { + streams(first: 10, orderBy: timestamp, orderDirection: desc) { + id + cancellation { + recipientBalance + recipientInterest + timestamp + txhash + } + deposit + exchangeRateInitial + ratePerSecond + recipient + recipientSharePercentage + sender + senderSharePercentage + startTime + stopTime + timestamp + token { + id + decimals + name + symbol + } + txs { + id + block + event + from + timestamp + to + } + withdrawals { + id + amount + } + } + } +`; + +export default GET_STREAMS; diff --git a/templates/react/synthetix/packages/react-app/src/App.js.ctx b/templates/react/synthetix/packages/react-app/src/App.js.ctx index 9bec5699..8d52ae73 100644 --- a/templates/react/synthetix/packages/react-app/src/App.js.ctx +++ b/templates/react/synthetix/packages/react-app/src/App.js.ctx @@ -1,27 +1,5 @@ { "callToAction": "Read On-Chain Balance", - "graphqlQuery": [ - "const GET_TRANSFERS = gql`", - " {", - " transfers(", - " where: {", - " source_in: [\"sETH\", \"sUSD\"]", - " to_not: \"0x0000000000000000000000000000000000000000\"", - " from_not: \"0x0000000000000000000000000000000000000000\"", - " }", - " orderBy: timestamp", - " orderDirection: desc", - " ) {", - " id", - " from", - " to", - " value", - " source", - " block", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_TRANSFERS", "hooks": { "readData": [ @@ -32,7 +10,8 @@ }, "imports": [ "import { MAINNET_ID, addresses, abis } from \"@synthetix-app/contracts\";", - "import { SynthetixJs } from \"synthetix-js\";" + "import { SynthetixJs } from \"synthetix-js\";", + "import GET_TRANSFERS from \"./graphql/subgraph\";" ], "learnUrl": "https://docs.synthetix.io/", "readOnChainData": [ diff --git a/templates/react/synthetix/packages/react-app/src/graphql/subgraph.js b/templates/react/synthetix/packages/react-app/src/graphql/subgraph.js new file mode 100644 index 00000000..fca8b2ee --- /dev/null +++ b/templates/react/synthetix/packages/react-app/src/graphql/subgraph.js @@ -0,0 +1,25 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/synthetixio-team/synthetix +const GET_TRANSFERS = gql` + { + transfers( + where: { + source_in: ["sETH", "sUSD"] + to_not: "0x0000000000000000000000000000000000000000" + from_not: "0x0000000000000000000000000000000000000000" + } + orderBy: timestamp + orderDirection: desc + ) { + id + from + to + value + source + block + } + } +`; + +export default GET_TRANSFERS; diff --git a/templates/react/uniswap-v1/packages/react-app/src/App.js.ctx b/templates/react/uniswap-v1/packages/react-app/src/App.js.ctx index ad0c1869..f23f2bf8 100644 --- a/templates/react/uniswap-v1/packages/react-app/src/App.js.ctx +++ b/templates/react/uniswap-v1/packages/react-app/src/App.js.ctx @@ -1,17 +1,5 @@ { "callToAction": "Read On-Chain Exchange Rate", - "graphqlQuery": [ - "const GET_EXCHANGES = gql`", - " {", - " exchanges(first: 5) {", - " id", - " tokenAddress", - " tokenSymbol", - " tokenName", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_EXCHANGES", "hooks": { "readData": [ @@ -21,7 +9,8 @@ ] }, "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@uniswap-v1-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@uniswap-v1-app/contracts\";", + "import GET_EXCHANGES from \"./graphql/subgraph\";" ], "learnUrl": "https://uniswap.org/docs/v1/", "readOnChainData": [ diff --git a/templates/react/uniswap-v1/packages/react-app/src/graphql/subgraph.js b/templates/react/uniswap-v1/packages/react-app/src/graphql/subgraph.js new file mode 100644 index 00000000..14690ab3 --- /dev/null +++ b/templates/react/uniswap-v1/packages/react-app/src/graphql/subgraph.js @@ -0,0 +1,15 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/graphprotocol/uniswap +const GET_EXCHANGES = gql` + { + exchanges(first: 5) { + id + tokenAddress + tokenSymbol + tokenName + } + } +`; + +export default GET_EXCHANGES; diff --git a/templates/react/uniswap-v2/packages/react-app/src/App.js.ctx b/templates/react/uniswap-v2/packages/react-app/src/App.js.ctx index cb62fa87..779303b7 100644 --- a/templates/react/uniswap-v2/packages/react-app/src/App.js.ctx +++ b/templates/react/uniswap-v2/packages/react-app/src/App.js.ctx @@ -1,17 +1,5 @@ { "callToAction": "Read On-Chain Reserves", - "graphqlQuery": [ - "// See more example queries on https://thegraph.com/explorer/subgraph/uniswap/uniswap-v2", - "const GET_AGGREGATED_UNISWAP_DATA = gql`", - " {", - " uniswapFactories(first: 1) {", - " pairCount", - " totalVolumeUSD", - " totalLiquidityUSD", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_AGGREGATED_UNISWAP_DATA", "hooks": { "readData": [ @@ -21,7 +9,8 @@ ] }, "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@uniswap-v2-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@uniswap-v2-app/contracts\";", + "import GET_AGGREGATED_UNISWAP_DATA from \"./graphql/subgraph\";" ], "learnUrl": "https://uniswap.org/docs/v2/", "readOnChainData": [ diff --git a/templates/react/uniswap-v2/packages/react-app/src/graphql/subgraph.js b/templates/react/uniswap-v2/packages/react-app/src/graphql/subgraph.js new file mode 100644 index 00000000..66209652 --- /dev/null +++ b/templates/react/uniswap-v2/packages/react-app/src/graphql/subgraph.js @@ -0,0 +1,14 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/uniswap/uniswap-v2 +const GET_AGGREGATED_UNISWAP_DATA = gql` + { + uniswapFactories(first: 1) { + pairCount + totalVolumeUSD + totalLiquidityUSD + } + } +`; + +export default GET_AGGREGATED_UNISWAP_DATA; From b554d94c3c6b375322a127b4c88afbd625b1f83d Mon Sep 17 00:00:00 2001 From: Tom French Date: Sat, 15 Aug 2020 13:50:35 +0100 Subject: [PATCH 2/3] refactor: moved graphql queries in vue templates to subgraph.js --- .../vue-app/src/components/HelloWorld.vue.hbs | 4 -- src/helpers/templates.ts | 1 + .../vue-app/src/components/HelloWorld.vue.ctx | 17 +------ .../packages/vue-app/src/graphql/subgraph.js | 29 ++++++++++++ .../vue-app/src/components/HelloWorld.vue.ctx | 29 +----------- .../packages/vue-app/src/graphql/subgraph.js | 17 +++++++ .../vue-app/src/components/HelloWorld.vue.ctx | 15 +----- .../packages/vue-app/src/graphql/subgraph.js | 15 ++++++ .../vue-app/src/components/HelloWorld.vue.ctx | 21 +-------- .../packages/vue-app/src/graphql/subgraph.js | 21 +++++++++ .../vue-app/src/components/HelloWorld.vue.ctx | 24 +--------- .../packages/vue-app/src/graphql/subgraph.js | 24 ++++++++++ .../vue-app/src/components/HelloWorld.vue.ctx | 46 +------------------ .../packages/vue-app/src/graphql/subgraph.js | 46 +++++++++++++++++++ .../vue-app/src/components/HelloWorld.vue.ctx | 25 +--------- .../packages/vue-app/src/graphql/subgraph.js | 25 ++++++++++ .../vue-app/src/components/HelloWorld.vue.ctx | 15 +----- .../packages/vue-app/src/graphql/subgraph.js | 15 ++++++ .../vue-app/src/components/HelloWorld.vue.ctx | 15 +----- .../packages/vue-app/src/graphql/subgraph.js | 14 ++++++ 20 files changed, 225 insertions(+), 193 deletions(-) create mode 100644 templates/vue/aave/packages/vue-app/src/graphql/subgraph.js create mode 100644 templates/vue/compound/packages/vue-app/src/graphql/subgraph.js create mode 100644 templates/vue/default/packages/vue-app/src/graphql/subgraph.js create mode 100644 templates/vue/kyber/packages/vue-app/src/graphql/subgraph.js create mode 100644 templates/vue/maker/packages/vue-app/src/graphql/subgraph.js create mode 100644 templates/vue/sablier-v1/packages/vue-app/src/graphql/subgraph.js create mode 100644 templates/vue/synthetix/packages/vue-app/src/graphql/subgraph.js create mode 100644 templates/vue/uniswap-v1/packages/vue-app/src/graphql/subgraph.js create mode 100644 templates/vue/uniswap-v2/packages/vue-app/src/graphql/subgraph.js diff --git a/handlebars/vue/packages/vue-app/src/components/HelloWorld.vue.hbs b/handlebars/vue/packages/vue-app/src/components/HelloWorld.vue.hbs index 01da863e..3fa39c58 100644 --- a/handlebars/vue/packages/vue-app/src/components/HelloWorld.vue.hbs +++ b/handlebars/vue/packages/vue-app/src/components/HelloWorld.vue.hbs @@ -57,10 +57,6 @@ {{{ this }}} {{/each}} - {{#each graphqlQuery }} - {{{ this }}} - {{/each}} - export default { methods: { readOnchainData: async function () { diff --git a/src/helpers/templates.ts b/src/helpers/templates.ts index 5a7782f5..f60c0889 100644 --- a/src/helpers/templates.ts +++ b/src/helpers/templates.ts @@ -36,6 +36,7 @@ export const standardFiles: Record = { "packages/vue-app/README.md", "packages/vue-app/src/main.js", "packages/vue-app/src/components/HelloWorld.vue", + "packages/vue-app/src/graphql/subgraph.js", ], }; diff --git a/templates/vue/aave/packages/vue-app/src/components/HelloWorld.vue.ctx b/templates/vue/aave/packages/vue-app/src/components/HelloWorld.vue.ctx index b6783997..5522e074 100644 --- a/templates/vue/aave/packages/vue-app/src/components/HelloWorld.vue.ctx +++ b/templates/vue/aave/packages/vue-app/src/components/HelloWorld.vue.ctx @@ -1,22 +1,9 @@ { "callToAction": "Read On-Chain Balance", - "graphqlQuery": [ - "const GET_LENDING_POOL_CONFIGURATION_HISTORY_ITEMS = gql`", - " {", - " lendingPoolConfigurationHistoryItems(first: 5) {", - " id", - " provider {", - " id", - " }", - " lendingPool", - " lendingPoolCore", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_LENDING_POOL_CONFIGURATION_HISTORY_ITEMS", "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@aave-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@aave-app/contracts\";", + "import GET_LENDING_POOL_CONFIGURATION_HISTORY_ITEMS from \"../graphql/subgraph\";" ], "learnItems": [ { diff --git a/templates/vue/aave/packages/vue-app/src/graphql/subgraph.js b/templates/vue/aave/packages/vue-app/src/graphql/subgraph.js new file mode 100644 index 00000000..44376185 --- /dev/null +++ b/templates/vue/aave/packages/vue-app/src/graphql/subgraph.js @@ -0,0 +1,29 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/graphprotocol/compound-v2 +const GET_MONEY_MARKETS = gql` + { + markets(first: 7) { + borrowRate + cash + collateralFactor + exchangeRate + interestRateModelAddress + name + reserves + supplyRate + symbol + id + totalBorrows + totalSupply + underlyingAddress + underlyingName + underlyingPrice + underlyingSymbol + reserveFactor + underlyingPriceUSD + } + } +`; + +export default GET_MONEY_MARKETS; diff --git a/templates/vue/compound/packages/vue-app/src/components/HelloWorld.vue.ctx b/templates/vue/compound/packages/vue-app/src/components/HelloWorld.vue.ctx index 2b821ccc..1a37ff9f 100644 --- a/templates/vue/compound/packages/vue-app/src/components/HelloWorld.vue.ctx +++ b/templates/vue/compound/packages/vue-app/src/components/HelloWorld.vue.ctx @@ -1,34 +1,9 @@ { "callToAction": "Read On-Chain Balance", - "graphqlQuery": [ - "const GET_MONEY_MARKETS = gql`", - " {", - " markets(first: 7) {", - " borrowRate", - " cash", - " collateralFactor", - " exchangeRate", - " interestRateModelAddress", - " name", - " reserves", - " supplyRate", - " symbol", - " id", - " totalBorrows", - " totalSupply", - " underlyingAddress", - " underlyingName", - " underlyingPrice", - " underlyingSymbol", - " reserveFactor", - " underlyingPriceUSD", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_MONEY_MARKETS", "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@compound-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@compound-app/contracts\";", + "import GET_MONEY_MARKETS from \"../graphql/subgraph\";" ], "learnItems": [ { diff --git a/templates/vue/compound/packages/vue-app/src/graphql/subgraph.js b/templates/vue/compound/packages/vue-app/src/graphql/subgraph.js new file mode 100644 index 00000000..c957a521 --- /dev/null +++ b/templates/vue/compound/packages/vue-app/src/graphql/subgraph.js @@ -0,0 +1,17 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/aave/protocol +const GET_LENDING_POOL_CONFIGURATION_HISTORY_ITEMS = gql` + { + lendingPoolConfigurationHistoryItems(first: 5) { + id + provider { + id + } + lendingPool + lendingPoolCore + } + } +`; + +export default GET_LENDING_POOL_CONFIGURATION_HISTORY_ITEMS; diff --git a/templates/vue/default/packages/vue-app/src/components/HelloWorld.vue.ctx b/templates/vue/default/packages/vue-app/src/components/HelloWorld.vue.ctx index 9e0b3478..963dc5f8 100644 --- a/templates/vue/default/packages/vue-app/src/components/HelloWorld.vue.ctx +++ b/templates/vue/default/packages/vue-app/src/components/HelloWorld.vue.ctx @@ -1,20 +1,9 @@ { "callToAction": "Read On-Chain Balance", - "graphqlQuery": [ - "const GET_TRANSFERS = gql`", - " {", - " transfers(first: 10) {", - " id", - " from", - " to", - " value", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_TRANSFERS", "imports": [ - "import { addresses, abis } from \"@project/contracts\";" + "import { addresses, abis } from \"@project/contracts\";", + "import GET_TRANSFERS from \"../graphql/subgraph\";" ], "learnItems": [ { diff --git a/templates/vue/default/packages/vue-app/src/graphql/subgraph.js b/templates/vue/default/packages/vue-app/src/graphql/subgraph.js new file mode 100644 index 00000000..82dbdaf1 --- /dev/null +++ b/templates/vue/default/packages/vue-app/src/graphql/subgraph.js @@ -0,0 +1,15 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/paulrberg/create-eth-app +const GET_TRANSFERS = gql` + { + transfers(first: 10) { + id + from + to + value + } + } +`; + +export default GET_TRANSFERS; diff --git a/templates/vue/kyber/packages/vue-app/src/components/HelloWorld.vue.ctx b/templates/vue/kyber/packages/vue-app/src/components/HelloWorld.vue.ctx index d28b1650..9d93b91b 100644 --- a/templates/vue/kyber/packages/vue-app/src/components/HelloWorld.vue.ctx +++ b/templates/vue/kyber/packages/vue-app/src/components/HelloWorld.vue.ctx @@ -1,26 +1,9 @@ { "callToAction": "Read On-Chain Exchange Rate", - "graphqlQuery": [ - "const GET_FULL_TRADES = gql`", - " {", - " fullTrades(first: 5) {", - " id", - " trader {", - " id", - " }", - " src {", - " id", - " }", - " dest {", - " id", - " }", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_FULL_TRADES", "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@kyber-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@kyber-app/contracts\";", + "import GET_FULL_TRADES from \"../graphql/subgraph\";" ], "learnItems": [ { diff --git a/templates/vue/kyber/packages/vue-app/src/graphql/subgraph.js b/templates/vue/kyber/packages/vue-app/src/graphql/subgraph.js new file mode 100644 index 00000000..7c49a8d6 --- /dev/null +++ b/templates/vue/kyber/packages/vue-app/src/graphql/subgraph.js @@ -0,0 +1,21 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/protofire/kyber +const GET_FULL_TRADES = gql` + { + fullTrades(first: 5) { + id + trader { + id + } + src { + id + } + dest { + id + } + } + } +`; + +export default GET_FULL_TRADES; diff --git a/templates/vue/maker/packages/vue-app/src/components/HelloWorld.vue.ctx b/templates/vue/maker/packages/vue-app/src/components/HelloWorld.vue.ctx index 073ef14e..d960e989 100644 --- a/templates/vue/maker/packages/vue-app/src/components/HelloWorld.vue.ctx +++ b/templates/vue/maker/packages/vue-app/src/components/HelloWorld.vue.ctx @@ -1,29 +1,9 @@ { "callToAction": "Read On-Chain Collateral Information", - "graphqlQuery": [ - "const GET_COLLATERAL_TYPES = gql`", - " {", - " collateralTypes(orderBy: addedAt) {", - " name: id", - " price {", - " block", - " value", - " }", - " debtCeiling", - " totalDebt", - " liquidationLotSize", - " liquidationPenalty", - " liquidationRatio", - " stabilityFee", - " auctionCount", - " vaultCount", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_COLLATERAL_TYPES", "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@maker-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@maker-app/contracts\";", + "import GET_COLLATERAL_TYPES from \"../graphql/subgraph\";" ], "learnItems": [ { diff --git a/templates/vue/maker/packages/vue-app/src/graphql/subgraph.js b/templates/vue/maker/packages/vue-app/src/graphql/subgraph.js new file mode 100644 index 00000000..75fd887e --- /dev/null +++ b/templates/vue/maker/packages/vue-app/src/graphql/subgraph.js @@ -0,0 +1,24 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/protofire/maker-protocol +const GET_COLLATERAL_TYPES = gql` + { + collateralTypes(orderBy: addedAt) { + name: id + price { + block + value + } + debtCeiling + totalDebt + liquidationLotSize + liquidationPenalty + liquidationRatio + stabilityFee + auctionCount + vaultCount + } + } +`; + +export default GET_COLLATERAL_TYPES; diff --git a/templates/vue/sablier-v1/packages/vue-app/src/components/HelloWorld.vue.ctx b/templates/vue/sablier-v1/packages/vue-app/src/components/HelloWorld.vue.ctx index a32fa0ed..3e5ad887 100644 --- a/templates/vue/sablier-v1/packages/vue-app/src/components/HelloWorld.vue.ctx +++ b/templates/vue/sablier-v1/packages/vue-app/src/components/HelloWorld.vue.ctx @@ -1,51 +1,9 @@ { "callToAction": "Read On-Chain Data", - "graphqlQuery": [ - "const GET_STREAMS = gql`", - " {", - " streams(first: 10, orderBy: timestamp, orderDirection: desc) {", - " id", - " cancellation {", - " recipientBalance", - " recipientInterest", - " timestamp", - " txhash", - " }", - " deposit", - " exchangeRateInitial", - " ratePerSecond", - " recipient", - " recipientSharePercentage", - " sender", - " senderSharePercentage", - " startTime", - " stopTime", - " timestamp", - " token {", - " id", - " decimals", - " name", - " symbol", - " }", - " txs {", - " id", - " block", - " event", - " from", - " timestamp", - " to", - " }", - " withdrawals {", - " id", - " amount", - " }", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_STREAMS", "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@sablier-v1-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@sablier-v1-app/contracts\";", + "import GET_STREAMS from \"../graphql/subgraph\";" ], "learnItems": [ { diff --git a/templates/vue/sablier-v1/packages/vue-app/src/graphql/subgraph.js b/templates/vue/sablier-v1/packages/vue-app/src/graphql/subgraph.js new file mode 100644 index 00000000..bca62fc8 --- /dev/null +++ b/templates/vue/sablier-v1/packages/vue-app/src/graphql/subgraph.js @@ -0,0 +1,46 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/sablierhq/sablier +const GET_STREAMS = gql` + { + streams(first: 10, orderBy: timestamp, orderDirection: desc) { + id + cancellation { + recipientBalance + recipientInterest + timestamp + txhash + } + deposit + exchangeRateInitial + ratePerSecond + recipient + recipientSharePercentage + sender + senderSharePercentage + startTime + stopTime + timestamp + token { + id + decimals + name + symbol + } + txs { + id + block + event + from + timestamp + to + } + withdrawals { + id + amount + } + } + } +`; + +export default GET_STREAMS; diff --git a/templates/vue/synthetix/packages/vue-app/src/components/HelloWorld.vue.ctx b/templates/vue/synthetix/packages/vue-app/src/components/HelloWorld.vue.ctx index 5cad2600..7c8c8d36 100644 --- a/templates/vue/synthetix/packages/vue-app/src/components/HelloWorld.vue.ctx +++ b/templates/vue/synthetix/packages/vue-app/src/components/HelloWorld.vue.ctx @@ -1,31 +1,10 @@ { "callToAction": "Read On-Chain Balance", - "graphqlQuery": [ - "const GET_TRANSFERS = gql`", - " {", - " transfers(", - " where: {", - " source_in: [\"sETH\", \"sUSD\"]", - " to_not: \"0x0000000000000000000000000000000000000000\"", - " from_not: \"0x0000000000000000000000000000000000000000\"", - " }", - " orderBy: timestamp", - " orderDirection: desc", - " ) {", - " id", - " from", - " to", - " value", - " source", - " block", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_TRANSFERS", "imports": [ "import { MAINNET_ID, addresses, abis } from \"@synthetix-app/contracts\";", - "import { SynthetixJs } from \"synthetix-js\";" + "import { SynthetixJs } from \"synthetix-js\";", + "import GET_TRANSFERS from \"../graphql/subgraph\";" ], "learnItems": [ { diff --git a/templates/vue/synthetix/packages/vue-app/src/graphql/subgraph.js b/templates/vue/synthetix/packages/vue-app/src/graphql/subgraph.js new file mode 100644 index 00000000..fca8b2ee --- /dev/null +++ b/templates/vue/synthetix/packages/vue-app/src/graphql/subgraph.js @@ -0,0 +1,25 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/synthetixio-team/synthetix +const GET_TRANSFERS = gql` + { + transfers( + where: { + source_in: ["sETH", "sUSD"] + to_not: "0x0000000000000000000000000000000000000000" + from_not: "0x0000000000000000000000000000000000000000" + } + orderBy: timestamp + orderDirection: desc + ) { + id + from + to + value + source + block + } + } +`; + +export default GET_TRANSFERS; diff --git a/templates/vue/uniswap-v1/packages/vue-app/src/components/HelloWorld.vue.ctx b/templates/vue/uniswap-v1/packages/vue-app/src/components/HelloWorld.vue.ctx index 29eca4fd..452e8332 100644 --- a/templates/vue/uniswap-v1/packages/vue-app/src/components/HelloWorld.vue.ctx +++ b/templates/vue/uniswap-v1/packages/vue-app/src/components/HelloWorld.vue.ctx @@ -1,20 +1,9 @@ { "callToAction": "Read On-Chain Exchange Rate", - "graphqlQuery": [ - "const GET_EXCHANGES = gql`", - " {", - " exchanges(first: 5) {", - " id", - " tokenAddress", - " tokenSymbol", - " tokenName", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_EXCHANGES", "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@uniswap-v1-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@uniswap-v1-app/contracts\";", + "import GET_EXCHANGES from \"../graphql/subgraph\";" ], "learnItems": [ { diff --git a/templates/vue/uniswap-v1/packages/vue-app/src/graphql/subgraph.js b/templates/vue/uniswap-v1/packages/vue-app/src/graphql/subgraph.js new file mode 100644 index 00000000..14690ab3 --- /dev/null +++ b/templates/vue/uniswap-v1/packages/vue-app/src/graphql/subgraph.js @@ -0,0 +1,15 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/graphprotocol/uniswap +const GET_EXCHANGES = gql` + { + exchanges(first: 5) { + id + tokenAddress + tokenSymbol + tokenName + } + } +`; + +export default GET_EXCHANGES; diff --git a/templates/vue/uniswap-v2/packages/vue-app/src/components/HelloWorld.vue.ctx b/templates/vue/uniswap-v2/packages/vue-app/src/components/HelloWorld.vue.ctx index 9ac36e9c..360d9bab 100644 --- a/templates/vue/uniswap-v2/packages/vue-app/src/components/HelloWorld.vue.ctx +++ b/templates/vue/uniswap-v2/packages/vue-app/src/components/HelloWorld.vue.ctx @@ -1,20 +1,9 @@ { "callToAction": "Read On-Chain Reserves", - "graphqlQuery": [ - "// See more example queries on https://thegraph.com/explorer/subgraph/uniswap/uniswap-v2", - "const GET_AGGREGATED_UNISWAP_DATA = gql`", - " {", - " uniswapFactories(first: 1) {", - " pairCount", - " totalVolumeUSD", - " totalLiquidityUSD", - " }", - " }", - "`;" - ], "graphqlQueryName": "GET_AGGREGATED_UNISWAP_DATA", "imports": [ - "import { MAINNET_ID, addresses, abis } from \"@uniswap-v2-app/contracts\";" + "import { MAINNET_ID, addresses, abis } from \"@uniswap-v2-app/contracts\";", + "import GET_AGGREGATED_UNISWAP_DATA from \"../graphql/subgraph\";" ], "learnItems": [ { diff --git a/templates/vue/uniswap-v2/packages/vue-app/src/graphql/subgraph.js b/templates/vue/uniswap-v2/packages/vue-app/src/graphql/subgraph.js new file mode 100644 index 00000000..66209652 --- /dev/null +++ b/templates/vue/uniswap-v2/packages/vue-app/src/graphql/subgraph.js @@ -0,0 +1,14 @@ +import { gql } from "apollo-boost"; + +// See more example queries on https://thegraph.com/explorer/subgraph/uniswap/uniswap-v2 +const GET_AGGREGATED_UNISWAP_DATA = gql` + { + uniswapFactories(first: 1) { + pairCount + totalVolumeUSD + totalLiquidityUSD + } + } +`; + +export default GET_AGGREGATED_UNISWAP_DATA; From aeeadbfc43fce1d85f9255e141b57338e5c50b8d Mon Sep 17 00:00:00 2001 From: Tom French Date: Sat, 15 Aug 2020 13:53:50 +0100 Subject: [PATCH 3/3] fix: use correct import for gql in vue templates' subgraph.js --- .../vue/packages/vue-app/src/components/HelloWorld.vue.hbs | 1 - templates/vue/aave/packages/vue-app/src/graphql/subgraph.js | 2 +- .../vue/compound/packages/vue-app/src/graphql/subgraph.js | 2 +- templates/vue/default/packages/vue-app/src/graphql/subgraph.js | 2 +- templates/vue/kyber/packages/vue-app/src/graphql/subgraph.js | 2 +- templates/vue/maker/packages/vue-app/src/graphql/subgraph.js | 2 +- .../vue/sablier-v1/packages/vue-app/src/graphql/subgraph.js | 2 +- .../vue/synthetix/packages/vue-app/src/graphql/subgraph.js | 3 ++- .../vue/uniswap-v1/packages/vue-app/src/graphql/subgraph.js | 2 +- .../vue/uniswap-v2/packages/vue-app/src/graphql/subgraph.js | 2 +- 10 files changed, 10 insertions(+), 10 deletions(-) diff --git a/handlebars/vue/packages/vue-app/src/components/HelloWorld.vue.hbs b/handlebars/vue/packages/vue-app/src/components/HelloWorld.vue.hbs index 3fa39c58..c98f6c63 100644 --- a/handlebars/vue/packages/vue-app/src/components/HelloWorld.vue.hbs +++ b/handlebars/vue/packages/vue-app/src/components/HelloWorld.vue.hbs @@ -50,7 +50,6 @@