From fcd389d79c8cca097a15c7bb0dd307bde29d6bcc Mon Sep 17 00:00:00 2001 From: Kyle Lawlor-Bagcal Date: Thu, 20 Jul 2023 20:35:09 -0400 Subject: [PATCH] feat: add useGraphQLClient and useGroupHistoricalProposals --- src/App.tsx | 7 ------- src/graphqlRequestContext.ts | 10 ++++++++++ src/hooks/use-query.ts | 23 +++++++++++++++++++++++ src/pages/group-page.tsx | 6 ++++++ 4 files changed, 39 insertions(+), 7 deletions(-) create mode 100644 src/graphqlRequestContext.ts diff --git a/src/App.tsx b/src/App.tsx index 0be5568..df679ac 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -7,17 +7,10 @@ import { Wallet } from 'store/wallet.store' import { EnableKeplr } from 'pages/enable-keplr-page' import { InstallKeplr } from 'pages/install-keplr-page' import { Loading } from '@/molecules/loading' -import request from 'graphql-request' -import { useQuery } from '@tanstack/react-query' -import { AllProposalsDocument } from 'gql/graphql' export default function App() { useKeplr() const snap = useSnapshot(Wallet) - const { data } = useQuery(['proposals'], async () => - request('http://localhost:5000/indexer/graphql', AllProposalsDocument), - ) - console.log(data?.allProposals?.nodes) switch (snap.keplrStatus) { case 'ready': diff --git a/src/graphqlRequestContext.ts b/src/graphqlRequestContext.ts new file mode 100644 index 0000000..c2fce60 --- /dev/null +++ b/src/graphqlRequestContext.ts @@ -0,0 +1,10 @@ +import { createContext, useContext } from 'react' +import { GraphQLClient } from 'graphql-request' + +const client = new GraphQLClient('http://localhost:5000/indexer/graphql') + +const GraphqlRequestContext = createContext(client) + +export function useGraphQLClient() { + return useContext(GraphqlRequestContext) +} diff --git a/src/hooks/use-query.ts b/src/hooks/use-query.ts index 59cbe06..b5de8d3 100644 --- a/src/hooks/use-query.ts +++ b/src/hooks/use-query.ts @@ -15,6 +15,8 @@ import { fetchVotesByProposal, } from 'api/proposal.actions' import { fetchValidators } from 'api/staking.actions' +import { ProposalsByGroupPolicyAddressDocument } from 'gql/graphql' +import { useGraphQLClient } from 'graphqlRequestContext' import { Chain } from 'store/chain.store' import { Wallet } from 'store/wallet.store' @@ -90,6 +92,27 @@ export function useGroupProposals(groupId?: string) { }) } +export function useGroupHistoricalProposals(groupId?: string) { + const { data: policies, isLoading } = useGroupPolicies(groupId) + const policyIds = policies?.map((p) => p.address) || [] + const client = useGraphQLClient() + return useQuery({ + queryKey: ['historicalProposals', groupId], + queryFn: async () => { + const proposals = await Promise.all( + policyIds.map(async (address) => { + const res = await client.request(ProposalsByGroupPolicyAddressDocument, { + groupPolicyAddress: address, + }) + return res.allProposals?.nodes + }), + ) + return proposals.flat() + }, + enabled: !isLoading, + }) +} + export function useBalances(address?: string) { return useQuery({ queryKey: ['balances', address], diff --git a/src/pages/group-page.tsx b/src/pages/group-page.tsx index edd46fb..498c205 100644 --- a/src/pages/group-page.tsx +++ b/src/pages/group-page.tsx @@ -9,6 +9,7 @@ import { useDerivedProposals } from 'hooks/use-derived-proposals' import { useBalances, useGroup, + useGroupHistoricalProposals, useGroupPolicies, useGroupProposals, } from 'hooks/use-query' @@ -22,6 +23,8 @@ export default function GroupPage() { const { data: group, isLoading: isLoadingGroup } = useGroup(groupId) const { data: policies, isLoading: isLoadingPolicies } = useGroupPolicies(groupId) const { data: proposals, isLoading: isLoadingProposals } = useGroupProposals(groupId) + const { data: historicalProposals, isLoading: isLoadingHistoricalProposals } = + useGroupHistoricalProposals(groupId) const { toastSuccess, toastErr } = useTxToasts() const groupPolicy = policies?.[0] @@ -37,12 +40,15 @@ export default function GroupPage() { isLoadingGroup || isLoadingPolicies || isLoadingProposals || + isLoadingHistoricalProposals || isInitialLoadingBalances || isRefetchingBalances ) { return } + console.log({ proposals, historicalProposals }) + if (!group) { logError('Group not found') redirect('/')