diff --git a/src/app/pages/ProposalDetailsPage/ProposalVotesCard.tsx b/src/app/pages/ProposalDetailsPage/ProposalVotesCard.tsx
index e7c7d0cb47..9a0f5abcdc 100644
--- a/src/app/pages/ProposalDetailsPage/ProposalVotesCard.tsx
+++ b/src/app/pages/ProposalDetailsPage/ProposalVotesCard.tsx
@@ -85,13 +85,15 @@ export const ProposalVotesView: FC = () => {
const proposalId = parseInt(useParams().proposalId!, 10)
const { clearFilters } = useVoteFiltering()
+ const results = useVotes(network, proposalId)
const {
- results,
isLoading,
+ tablePaginationProps,
+ data: votes,
hasNoResultsOnSelectedPage,
- hasNoResultsBecauseOfFilters,
hasNoResultsWhatsoever,
- } = useVotes(network, proposalId)
+ hasNoResultsBecauseOfFilters,
+ } = results
if (hasNoResultsOnSelectedPage) throw AppErrors.PageDoesNotExist
@@ -106,9 +108,9 @@ export const ProposalVotesView: FC = () => {
return (
)
}
diff --git a/src/app/pages/ProposalDetailsPage/hooks.ts b/src/app/pages/ProposalDetailsPage/hooks.ts
index 3fe1ac957e..f94024bc9a 100644
--- a/src/app/pages/ProposalDetailsPage/hooks.ts
+++ b/src/app/pages/ProposalDetailsPage/hooks.ts
@@ -17,6 +17,7 @@ import { useSearchParams } from 'react-router-dom'
export type AllVotesData = List & {
isLoading: boolean
isError: boolean
+ isFetched: boolean
loadedVotes: ExtendedVote[]
}
@@ -48,7 +49,7 @@ export const useAllVotes = (network: Network, proposalId: number): AllVotesData
isLoading: areValidatorsLoading,
isError: haveValidatorsFailed,
} = useValidatorMap(network)
- const { isLoading, isError, data } = query
+ const { isLoading, isFetched, isError, data } = query
const extendedVotes = (data?.data.votes || []).map(
(vote, index): ExtendedVote => ({
@@ -62,6 +63,7 @@ export const useAllVotes = (network: Network, proposalId: number): AllVotesData
return {
isLoading,
+ isFetched,
isError,
loadedVotes: DEBUG_MODE
? extendedVotes.map(v => ({ ...v, vote: getRandomVoteFor(v.address) })) || []
@@ -149,7 +151,7 @@ export const useVoteFiltering = () => {
}
export const useVotes = (network: Network, proposalId: number) => {
- const { hasFilters, wantedType, wantedNamePattern } = useVoteFiltering()
+ const { wantedType, wantedNamePattern } = useVoteFiltering()
const typeFilter = getFilterForVoteType(wantedType)
const nameFilter = getFilterForVoterNameFragment(wantedNamePattern)
@@ -157,28 +159,13 @@ export const useVotes = (network: Network, proposalId: number) => {
paramName: 'page',
clientPageSize: NUMBER_OF_ITEMS_ON_SEPARATE_PAGE,
serverPageSize: 1000,
- filter: (vote: ExtendedVote) => typeFilter(vote) && nameFilter(vote),
+ filters: [typeFilter, nameFilter],
})
// Get all the votes
const allVotes = useAllVotes(network, proposalId)
+ const { isLoading, isFetched } = allVotes
// Get the section of the votes that we should display in the table
- const results = pagination.getResults(allVotes)
-
- const { isLoading } = allVotes
- const isOnFirstPage = results.tablePaginationProps.selectedPage === 1
- const hasData = !!results.data?.length
- const hasNoResultsOnSelectedPage = !isLoading && !isOnFirstPage && !hasData
- const hasNoResultsWhatsoever = !isLoading && !allVotes.total_count
- const hasNoResultsBecauseOfFilters =
- !isLoading && !hasData && isOnFirstPage && hasFilters && !hasNoResultsWhatsoever
-
- return {
- results,
- isLoading,
- hasNoResultsOnSelectedPage,
- hasNoResultsBecauseOfFilters,
- hasNoResultsWhatsoever,
- }
+ return pagination.getResults(isLoading, isFetched, allVotes)
}
diff --git a/src/app/utils/vote.ts b/src/app/utils/vote.ts
index 7ed042dcbe..982a0d4ab4 100644
--- a/src/app/utils/vote.ts
+++ b/src/app/utils/vote.ts
@@ -4,18 +4,18 @@ import { hasTextMatch } from '../components/HighlightedText/text-matching'
export const getRandomVote = (): ProposalVoteValue =>
[ProposalVoteValue.yes, ProposalVoteValue.no, ProposalVoteValue.abstain][Math.floor(Math.random() * 3)]
-const voteFilters: Record = {
- any: () => true,
+const voteFilters: Record = {
+ any: undefined,
yes: vote => vote.vote === ProposalVoteValue.yes,
no: vote => vote.vote === ProposalVoteValue.no,
abstain: vote => vote.vote === ProposalVoteValue.abstain,
}
-export const getFilterForVoteType = (voteType: VoteType): VoteFilter => voteFilters[voteType]
+export const getFilterForVoteType = (voteType: VoteType) => voteFilters[voteType]
export const getFilterForVoterNameFragment = (fragment: string | undefined) => {
if (!fragment) {
- return () => true
+ return
}
return (vote: ExtendedVote) => hasTextMatch(vote.validator?.media?.name, [fragment])
}