From a9efb7e54079eda3442ce4714e6a494d01ae39fb Mon Sep 17 00:00:00 2001 From: Fabrizio Vigevani Date: Thu, 9 Apr 2020 11:48:38 -0300 Subject: [PATCH 1/4] Graph queries: Add and update names --- src/queries/appeals.js | 4 ++-- src/queries/balances.js | 4 ++-- src/queries/jurorDrafts.js | 2 +- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/queries/appeals.js b/src/queries/appeals.js index 4ae6cfac..9080a999 100644 --- a/src/queries/appeals.js +++ b/src/queries/appeals.js @@ -1,7 +1,7 @@ import gql from 'graphql-tag' export const AppealsByMaker = gql` - subscription($maker: Bytes!, $settled: Boolean!) { + subscription AppealsByMaker($maker: Bytes!, $settled: Boolean!) { appeals(where: { maker: $maker, settled: $settled }) { id round { @@ -27,7 +27,7 @@ export const AppealsByMaker = gql` ` export const AppealsByTaker = gql` - subscription($taker: Bytes!, $settled: Boolean!) { + subscription AppealsByTaker($taker: Bytes!, $settled: Boolean!) { appeals(where: { taker: $taker, settled: $settled }) { id round { diff --git a/src/queries/balances.js b/src/queries/balances.js index 2338447e..866b1987 100644 --- a/src/queries/balances.js +++ b/src/queries/balances.js @@ -1,7 +1,7 @@ import gql from 'graphql-tag' export const ANJBalance = gql` - subscription ANJBalance($id: ID!) { + subscription ANJWalletBalance($id: ID!) { anjbalance(id: $id) { amount } @@ -9,7 +9,7 @@ export const ANJBalance = gql` ` export const Juror = gql` - subscription Juror($id: ID!, $from: BigInt!) { + subscription Balances($id: ID!, $from: BigInt!) { juror(id: $id) { activeBalance lockedBalance diff --git a/src/queries/jurorDrafts.js b/src/queries/jurorDrafts.js index 8730b657..ddb8b933 100644 --- a/src/queries/jurorDrafts.js +++ b/src/queries/jurorDrafts.js @@ -2,7 +2,7 @@ import gql from 'graphql-tag' // All juror drafts by `id` not yet rewarded export const JurorDraftsNotRewarded = gql` - subscription JurorDraft($id: ID!) { + subscription JurorDraftsNotRewarded($id: ID!) { juror(id: $id) { id drafts(where: { rewarded: false }) { From 155d0f0bbe091fe9400bda1ec2a86df6fd44306e Mon Sep 17 00:00:00 2001 From: Fabrizio Vigevani Date: Thu, 9 Apr 2020 12:36:24 -0300 Subject: [PATCH 2/4] Add graphql-exchanges Update graphql query names Reorder imports --- src/App.js | 8 ++++---- src/graphql-exchanges.js | 37 +++++++++++++++++++++++++++++++++++++ src/index.js | 32 +++++--------------------------- src/queries/balances.js | 2 +- src/queries/disputes.js | 24 ++---------------------- src/queries/jurorDrafts.js | 7 +++---- 6 files changed, 52 insertions(+), 58 deletions(-) create mode 100644 src/graphql-exchanges.js diff --git a/src/App.js b/src/App.js index 89822d4e..9b9133e4 100644 --- a/src/App.js +++ b/src/App.js @@ -2,15 +2,15 @@ import React from 'react' import { BrowserRouter } from 'react-router-dom' import { Main, ToastHub } from '@aragon/ui' import theme from './theme-court' +import AppLoader from './components/AppLoader' +import GlobalErrorHandler from './GlobalErrorHandler' import MainView from './components/MainView' +import OnboardingLoader from './components/OnboardingLoader' +import Routes from './Routes' import { ActivityProvider } from './components/Activity/ActivityProvider' import { CourtClockProvider } from './providers/CourtClock' import { CourtConfigProvider } from './providers/CourtConfig' import { WalletProvider } from './providers/Wallet' -import AppLoader from './components/AppLoader' -import OnboardingLoader from './components/OnboardingLoader' -import Routes from './Routes' -import GlobalErrorHandler from './GlobalErrorHandler' function App() { return ( diff --git a/src/graphql-exchanges.js b/src/graphql-exchanges.js new file mode 100644 index 00000000..c5dd99a4 --- /dev/null +++ b/src/graphql-exchanges.js @@ -0,0 +1,37 @@ +import { fetchExchange, subscriptionExchange } from 'urql' +import { SubscriptionClient } from 'subscriptions-transport-ws' +import { captureMessage } from '@sentry/browser' +import endpoints from './endpoints' + +const GRAPH_API_ENDPOINTS = endpoints() +const subscriptionClient = new SubscriptionClient(GRAPH_API_ENDPOINTS[1], { + reconnect: true, + reconnectionAttempts: 10, +}) + +// Default exchanges +const DEFAULT_FETCH_EXCHANGE = fetchExchange +const DEFAULT_SUBSCRIPTION_EXCHANGE = subscriptionExchange({ + forwardSubscription: operation => subscriptionClient.request(operation), +}) + +export function getFetchExchange() { + return DEFAULT_FETCH_EXCHANGE +} + +export function getSubscriptionExchange() { + return DEFAULT_SUBSCRIPTION_EXCHANGE +} + +let connectionAttempts = 0 +subscriptionClient.onConnected(() => (connectionAttempts = 0)) + +// Check for connection errors and if reaches max attempts send error log to Sentry +subscriptionClient.onError(err => { + const maxReconnectionAttempts = subscriptionClient.reconnectionAttempts + + if (maxReconnectionAttempts === ++connectionAttempts) { + captureMessage(`Connection error, could not connect to ${err.target.url}`) + } + console.log('Retrying connection...') +}) diff --git a/src/index.js b/src/index.js index 93eaa480..67ad7604 100644 --- a/src/index.js +++ b/src/index.js @@ -5,11 +5,9 @@ import { Provider as UrqlProvider, cacheExchange, debugExchange, - fetchExchange, - subscriptionExchange, } from 'urql' -import { SubscriptionClient } from 'subscriptions-transport-ws' -import { captureMessage } from '@sentry/browser' +import { getFetchExchange, getSubscriptionExchange } from './graphql-exchanges' + import { devtoolsExchange } from '@urql/devtools' import { createGlobalStyle } from 'styled-components' import App from './App' @@ -18,12 +16,7 @@ import initializeSentry from './sentry' initializeSentry() -const [GRAPH_API_ENDPOINT_HTTP, GRAPH_API_ENDPOINT_WS] = endpoints() - -const subscriptionClient = new SubscriptionClient(GRAPH_API_ENDPOINT_WS, { - reconnect: true, - reconnectionAttempts: 10, -}) +const [GRAPH_API_ENDPOINT_HTTP] = endpoints() const client = createClient({ url: GRAPH_API_ENDPOINT_HTTP, @@ -31,26 +24,11 @@ const client = createClient({ debugExchange, devtoolsExchange, cacheExchange, - fetchExchange, - subscriptionExchange({ - forwardSubscription: operation => subscriptionClient.request(operation), - }), + getFetchExchange(), + getSubscriptionExchange(), ], }) -let connectionAttempts = 0 -subscriptionClient.onConnected(() => (connectionAttempts = 0)) - -// Check for connection errors and if reaches max attempts send error log to Sentry -subscriptionClient.onError(err => { - const maxReconnectionAttempts = subscriptionClient.reconnectionAttempts - - if (maxReconnectionAttempts === ++connectionAttempts) { - captureMessage(`Connection error, could not connect to ${err.target.url}`) - } - console.log('Retrying connection...') -}) - const GlobalStyle = createGlobalStyle` body img { user-select:none; diff --git a/src/queries/balances.js b/src/queries/balances.js index 866b1987..d53ee44c 100644 --- a/src/queries/balances.js +++ b/src/queries/balances.js @@ -48,7 +48,7 @@ export const JurorTreasuryBalances = gql` ` export const FirstANJActivationMovement = gql` - query Juror($id: ID!) { + query JurorFirstANJActivationMovement($id: ID!) { juror(id: $id) { anjMovements( where: { type: "Activation" } diff --git a/src/queries/disputes.js b/src/queries/disputes.js index 6264df2b..6b4f0dcc 100644 --- a/src/queries/disputes.js +++ b/src/queries/disputes.js @@ -4,27 +4,16 @@ export const AllDisputes = gql` subscription AllDisputes($limit: Int) { disputes(first: $limit, orderBy: createdAt, orderDirection: desc) { id - txHash - createTermId - possibleRulings finalRuling lastRoundId state metadata - createdAt rounds { id state number draftTermId - jurorsNumber - settledPenalties - jurorFees delayedTerms - selectedJurors - coherentJurors - collectedTokens - createdAt jurors { juror { id @@ -32,18 +21,9 @@ export const AllDisputes = gql` commitment outcome } - vote { - id - winningOutcome - } + appeal { id - maker - appealedRuling - taker - opposedRuling - settled - createdAt } } } @@ -51,7 +31,7 @@ export const AllDisputes = gql` ` export const SingleDispute = gql` - subscription Dispute($id: ID!) { + subscription SingleDispute($id: ID!) { dispute(id: $id) { id txHash diff --git a/src/queries/jurorDrafts.js b/src/queries/jurorDrafts.js index ddb8b933..0786d307 100644 --- a/src/queries/jurorDrafts.js +++ b/src/queries/jurorDrafts.js @@ -8,8 +8,6 @@ export const JurorDraftsNotRewarded = gql` drafts(where: { rewarded: false }) { id weight - locked - rewarded outcome round { number @@ -30,7 +28,7 @@ export const JurorDraftsNotRewarded = gql` // First juror draft already rewarded export const JurorDraftRewarded = gql` - query JurorDraft($id: ID!) { + query JurorDraftRewarded($id: ID!) { juror(id: $id) { id drafts(where: { rewarded: true }, first: 1) { @@ -42,7 +40,7 @@ export const JurorDraftRewarded = gql` // Jurors drafts by `id` for current term export const CurrentTermJurorDrafts = gql` - subscription JurorDrafts($id: ID!, $from: BigInt!) { + subscription CurrentTermJurorDrafts($id: ID!, $from: BigInt!) { juror(id: $id) { id drafts(where: { createdAt_gt: $from }) { @@ -54,6 +52,7 @@ export const CurrentTermJurorDrafts = gql` ` // All juror drafts by `id` +// Useful query to know all disputes that the juror by `$id` is part of export const JurorDrafts = gql` query JurorDrafts($id: ID!) { juror(id: $id) { From e6c1e487ce7dc994ac3cfc8a94a5020f5098e5d5 Mon Sep 17 00:00:00 2001 From: Fabrizio Vigevani Date: Thu, 9 Apr 2020 12:59:50 -0300 Subject: [PATCH 3/4] Rename subscription and query names --- src/hooks/query-hooks.js | 9 ++++++--- src/hooks/subscription-hooks.js | 29 ++++++++++++++++++----------- src/queries/balances.js | 10 +++++----- src/queries/jurorDrafts.js | 12 ++++++------ 4 files changed, 35 insertions(+), 25 deletions(-) diff --git a/src/hooks/query-hooks.js b/src/hooks/query-hooks.js index 4751c0d9..b638b61f 100644 --- a/src/hooks/query-hooks.js +++ b/src/hooks/query-hooks.js @@ -1,8 +1,11 @@ import { useQuery } from 'urql' -import { JurorDrafts } from '../queries/jurorDrafts' +import { + ActiveJurors, + JurorFirstANJActivationMovement, +} from '../queries/balances' import { JurorFeesClaimed } from '../queries/juror' -import { ActiveJurors, FirstANJActivationMovement } from '../queries/balances' +import { JurorDrafts } from '../queries/jurorDrafts' export function useJurorDraftQuery(jurorId) { const [result] = useQuery({ @@ -42,7 +45,7 @@ export function useJurorRewardsEverClaimedQuery(jurorId) { export function useFirstANJActivationQuery(jurorId, { pause = false }) { const [result] = useQuery({ - query: FirstANJActivationMovement, + query: JurorFirstANJActivationMovement, variables: { id: jurorId.toLowerCase() }, pause, }) diff --git a/src/hooks/subscription-hooks.js b/src/hooks/subscription-hooks.js index daf6c725..58fa839e 100644 --- a/src/hooks/subscription-hooks.js +++ b/src/hooks/subscription-hooks.js @@ -1,38 +1,45 @@ import { useMemo } from 'react' import { useSubscription } from 'urql' +import { useCourtConfig } from '../providers/CourtConfig' + +// queries import { OpenTasks } from '../queries/tasks' import { CourtConfig, FeeMovements, JurorsRegistryModule, } from '../queries/court' -import { useCourtConfig } from '../providers/CourtConfig' -import { SingleDispute, AllDisputes } from '../queries/disputes' +import { AllDisputes, SingleDispute } from '../queries/disputes' import { AppealsByMaker, AppealsByTaker } from '../queries/appeals' -import { ANJBalance, Juror, JurorTreasuryBalances } from '../queries/balances' import { - JurorDraftsNotRewarded, - CurrentTermJurorDrafts, -} from '../queries/jurorDrafts' -import { CourtModuleType } from '../types/court-module-types' + JurorANJBalances, + JurorANJWalletBalance, + JurorTreasuryBalances, +} from '../queries/balances' +import { JurorDraftsFrom, JurorDraftsNotRewarded } from '../queries/jurorDrafts' + +// utils import { bigNum } from '../lib/math-utils' import { dayjs } from '../utils/date-utils' import { groupMovements } from '../utils/anj-movement-utils' import { transformAppealDataAttributes } from '../utils/appeal-utils' import { transformDisputeDataAttributes } from '../utils/dispute-utils' import { transformJurorDataAttributes } from '../utils/juror-draft-utils' +import { transformClaimedFeesDataAttributes } from '../utils/subscription-utils' import { getModuleAddress, transformCourtConfigDataAttributes, } from '../utils/court-utils' -import { transformClaimedFeesDataAttributes } from '../utils/subscription-utils' + +// types +import { CourtModuleType } from '../types/court-module-types' const NO_AMOUNT = bigNum(0) // Subscription to get juror's wallet balance function useANJBalance(jurorId) { const [{ data, error }] = useSubscription({ - query: ANJBalance, + query: JurorANJWalletBalance, variables: { id: jurorId.toLowerCase() }, }) @@ -48,7 +55,7 @@ function useJuror(jurorId) { .unix() const [{ data, error }] = useSubscription({ - query: Juror, + query: JurorANJBalances, variables: { id: jurorId.toLowerCase(), from: yesterday }, }) @@ -227,7 +234,7 @@ export function useCurrentTermJurorDraftsSubscription( pause ) { const [result] = useSubscription({ - query: CurrentTermJurorDrafts, + query: JurorDraftsFrom, variables: { id: jurorId.toLowerCase(), from: termStartTime }, pause, }) diff --git a/src/queries/balances.js b/src/queries/balances.js index d53ee44c..07aecc21 100644 --- a/src/queries/balances.js +++ b/src/queries/balances.js @@ -1,15 +1,15 @@ import gql from 'graphql-tag' -export const ANJBalance = gql` - subscription ANJWalletBalance($id: ID!) { +export const JurorANJWalletBalance = gql` + subscription JurorANJWalletBalance($id: ID!) { anjbalance(id: $id) { amount } } ` -export const Juror = gql` - subscription Balances($id: ID!, $from: BigInt!) { +export const JurorANJBalances = gql` + subscription JurorANJBalances($id: ID!, $from: BigInt!) { juror(id: $id) { activeBalance lockedBalance @@ -47,7 +47,7 @@ export const JurorTreasuryBalances = gql` } ` -export const FirstANJActivationMovement = gql` +export const JurorFirstANJActivationMovement = gql` query JurorFirstANJActivationMovement($id: ID!) { juror(id: $id) { anjMovements( diff --git a/src/queries/jurorDrafts.js b/src/queries/jurorDrafts.js index 0786d307..f2ad1a6c 100644 --- a/src/queries/jurorDrafts.js +++ b/src/queries/jurorDrafts.js @@ -27,8 +27,8 @@ export const JurorDraftsNotRewarded = gql` ` // First juror draft already rewarded -export const JurorDraftRewarded = gql` - query JurorDraftRewarded($id: ID!) { +export const JurorDraftsRewarded = gql` + query JurorDraftsRewarded($id: ID!) { juror(id: $id) { id drafts(where: { rewarded: true }, first: 1) { @@ -38,9 +38,9 @@ export const JurorDraftRewarded = gql` } ` -// Jurors drafts by `id` for current term -export const CurrentTermJurorDrafts = gql` - subscription CurrentTermJurorDrafts($id: ID!, $from: BigInt!) { +// Jurors drafts for juror with id `$id` created from `$from` +export const JurorDraftsFrom = gql` + subscription JurorDraftsFrom($id: ID!, $from: BigInt!) { juror(id: $id) { id drafts(where: { createdAt_gt: $from }) { @@ -51,7 +51,7 @@ export const CurrentTermJurorDrafts = gql` } ` -// All juror drafts by `id` +// All juror drafts for juror with id `id` // Useful query to know all disputes that the juror by `$id` is part of export const JurorDrafts = gql` query JurorDrafts($id: ID!) { From 4e7ff4af2011979979453085a7f520d01e2683b2 Mon Sep 17 00:00:00 2001 From: Fabrizio Vigevani Date: Thu, 9 Apr 2020 13:24:14 -0300 Subject: [PATCH 4/4] Do minor refactor and add comments --- src/components/Disputes/DisputeActions.js | 1 + src/hooks/query-hooks.js | 7 ++----- src/hooks/subscription-hooks.js | 2 +- src/queries/balances.js | 7 ------- src/queries/juror.js | 8 ++++++++ src/queries/jurorDrafts.js | 2 +- 6 files changed, 13 insertions(+), 14 deletions(-) diff --git a/src/components/Disputes/DisputeActions.js b/src/components/Disputes/DisputeActions.js index 47a33c24..d1ce3992 100644 --- a/src/components/Disputes/DisputeActions.js +++ b/src/components/Disputes/DisputeActions.js @@ -187,6 +187,7 @@ function InformationSection({ } // Helper function that returns main attributes for the YourVoteInfo component +// TODO: Contemplate final round cases (when a juror has voted, the ANJ amount is pre-slashed) const useInfoAttributes = ({ hasJurorVoted, jurorDraft, diff --git a/src/hooks/query-hooks.js b/src/hooks/query-hooks.js index b638b61f..52578f50 100644 --- a/src/hooks/query-hooks.js +++ b/src/hooks/query-hooks.js @@ -1,10 +1,7 @@ import { useQuery } from 'urql' -import { - ActiveJurors, - JurorFirstANJActivationMovement, -} from '../queries/balances' -import { JurorFeesClaimed } from '../queries/juror' +import { JurorFirstANJActivationMovement } from '../queries/balances' +import { ActiveJurors, JurorFeesClaimed } from '../queries/juror' import { JurorDrafts } from '../queries/jurorDrafts' export function useJurorDraftQuery(jurorId) { diff --git a/src/hooks/subscription-hooks.js b/src/hooks/subscription-hooks.js index 58fa839e..d3d79646 100644 --- a/src/hooks/subscription-hooks.js +++ b/src/hooks/subscription-hooks.js @@ -210,7 +210,7 @@ export function useDisputesSubscription() { const disputes = useMemo( () => - data && data.disputes + data?.disputes ? data.disputes.map(dispute => transformDisputeDataAttributes(dispute, courtConfig) ) diff --git a/src/queries/balances.js b/src/queries/balances.js index 07aecc21..1cce4086 100644 --- a/src/queries/balances.js +++ b/src/queries/balances.js @@ -64,10 +64,3 @@ export const JurorFirstANJActivationMovement = gql` } } ` -export const ActiveJurors = gql` - query Jurors { - jurors(first: 1000, where: { activeBalance_gt: 0 }) { - id - } - } -` diff --git a/src/queries/juror.js b/src/queries/juror.js index b1b21cfd..ce53a1de 100644 --- a/src/queries/juror.js +++ b/src/queries/juror.js @@ -8,3 +8,11 @@ export const JurorFeesClaimed = gql` } } ` + +export const ActiveJurors = gql` + query ActiveJurors { + jurors(first: 1000, where: { activeBalance_gt: 0 }) { + id + } + } +` diff --git a/src/queries/jurorDrafts.js b/src/queries/jurorDrafts.js index f2ad1a6c..851c2b95 100644 --- a/src/queries/jurorDrafts.js +++ b/src/queries/jurorDrafts.js @@ -38,7 +38,7 @@ export const JurorDraftsRewarded = gql` } ` -// Jurors drafts for juror with id `$id` created from `$from` +// Jurors drafts for juror with id `$id` created since `$from` export const JurorDraftsFrom = gql` subscription JurorDraftsFrom($id: ID!, $from: BigInt!) { juror(id: $id) {