diff --git a/src/components/SpaceDelegatesCard.vue b/src/components/SpaceDelegatesCard.vue index 11e3699867ee..b19beb005e5f 100644 --- a/src/components/SpaceDelegatesCard.vue +++ b/src/components/SpaceDelegatesCard.vue @@ -3,9 +3,7 @@ import { explorerUrl } from '@/helpers/utils'; import { DelegateWithPercent, Profile, - ExtendedSpace, - DelegatesVote, - DelegatesProposal + ExtendedSpace } from '@/helpers/interfaces'; const props = defineProps<{ @@ -13,8 +11,8 @@ const props = defineProps<{ profiles: Record; space: ExtendedSpace; stats?: { - votes: DelegatesVote[]; - proposals: DelegatesProposal[]; + votes: number; + proposals: number; }; about?: string; }>(); @@ -134,12 +132,12 @@ function handleDropdownAction(action: string) {
- {{ formatCompactNumber(stats?.votes.length || 0) }} + {{ formatCompactNumber(stats?.votes || 0) }} votes
ยท
- {{ formatCompactNumber(stats?.proposals.length || 0) }} + {{ formatCompactNumber(stats?.proposals || 0) }} proposals
diff --git a/src/composables/useDelegates.ts b/src/composables/useDelegates.ts index edbaba9fe2a7..72f5e2654f9e 100644 --- a/src/composables/useDelegates.ts +++ b/src/composables/useDelegates.ts @@ -1,25 +1,19 @@ +import { LEADERBOARD_QUERY } from '@/helpers/queries'; import { getInstance } from '@snapshot-labs/lock/plugins/vue3'; -import { - DelegateWithPercent, - DelegatesVote, - DelegatesProposal, - ExtendedSpace -} from '@/helpers/interfaces'; +import { DelegateWithPercent, ExtendedSpace } from '@/helpers/interfaces'; import { DelegationTypes, setupDelegation as getDelegationAdapter } from '@/helpers/delegationV2'; -type DelegatesStats = Record< - string, - { votes: DelegatesVote[]; proposals: DelegatesProposal[] } ->; +type DelegatesStats = Record; const DELEGATES_LIMIT = 18; export function useDelegates(space: ExtendedSpace) { const auth = getInstance(); const { resolveName } = useResolveName(); + const { apolloQuery } = useApolloQuery(); const { reader, writer } = getDelegationAdapter(space, auth); @@ -54,6 +48,7 @@ export function useDelegates(space: ExtendedSpace) { try { const response = await fetchDelegateBatch(orderBy); delegates.value = response; + loadStats(response.map(d => d.id)); hasMoreDelegates.value = response.length === DELEGATES_LIMIT; } catch (e) { console.error(e); @@ -73,6 +68,7 @@ export function useDelegates(space: ExtendedSpace) { orderBy, delegates.value.length ); + loadStats(response.map(d => d.id)); delegates.value = [...delegates.value, ...response]; hasMoreDelegates.value = response.length === DELEGATES_LIMIT; } catch (e) { @@ -93,6 +89,7 @@ export function useDelegates(space: ExtendedSpace) { const resolvedAddress = await resolveName(addressOrEns); if (!resolvedAddress) return; const response = await reader.getDelegate(resolvedAddress); + loadStats([response.id]); delegate.value = response; } catch (e) { console.error(e); @@ -140,6 +137,26 @@ export function useDelegates(space: ExtendedSpace) { } } + async function loadStats(addresses: string[]) { + const leaderboards = await apolloQuery( + { + query: LEADERBOARD_QUERY, + variables: { + space: space.id, + user_in: addresses + } + }, + 'leaderboards' + ); + + leaderboards.forEach(leaderboard => { + delegatesStats.value[leaderboard.user] = { + votes: leaderboard.votesCount, + proposals: leaderboard.proposalsCount + }; + }); + } + return { isLoadingDelegate, isLoadingDelegates, diff --git a/src/helpers/queries.ts b/src/helpers/queries.ts index 834d86a13c42..09773dfd7ee5 100644 --- a/src/helpers/queries.ts +++ b/src/helpers/queries.ts @@ -529,3 +529,15 @@ export const SPACE_QUERY = gql` } } `; + +export const LEADERBOARD_QUERY = gql` + query Leaderboard($space: String!, $user_in: [String]) { + leaderboards(where: { space: $space, user_in: $user_in }) { + space + user + proposalsCount + votesCount + lastVote + } + } +`; diff --git a/src/views/SpaceDelegate.vue b/src/views/SpaceDelegate.vue index b2d26450ca1c..c0b4185fc309 100644 --- a/src/views/SpaceDelegate.vue +++ b/src/views/SpaceDelegate.vue @@ -4,6 +4,7 @@ import { useConfirmDialog } from '@vueuse/core'; import { clone } from '@snapshot-labs/snapshot.js/src/utils'; import { DelegatingTo } from '../helpers/delegationV2/types'; import { DelegationTypes } from '@/helpers/delegationV2'; +import { getAddress } from '@ethersproject/address'; const INITIAL_STATEMENT = { about: '', @@ -67,7 +68,7 @@ const showUndelegate = computed(() => { }); const delegateStats = computed(() => { - return delegatesStats.value?.[address.value]; + return delegatesStats.value?.[getAddress(address.value)]; }); const delegatorItems = computed(() => { @@ -88,12 +89,12 @@ const delegatorItems = computed(() => { }, { label: 'Proposals', - value: formatCompactNumber(delegateStats.value?.proposals.length || 0), + value: formatCompactNumber(delegateStats.value?.proposals || 0), tooltip: null }, { label: 'Votes', - value: formatCompactNumber(delegateStats.value?.votes.length || 0), + value: formatCompactNumber(delegateStats.value?.votes || 0), tooltip: null } ];