Skip to content

Commit 51f0c10

Browse files
cctdanielcctdaniel
authored
[xc-admin] fix xc-admin-frontend bugs (#681)
* allow proposing without connecting wallet * show voted icon on proposals
1 parent 3d8215e commit 51f0c10

File tree

3 files changed

+109
-22
lines changed

3 files changed

+109
-22
lines changed

‎governance/xc_admin/packages/xc_admin_frontend/components/tabs/General.tsx

Lines changed: 6 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@ import { AnchorProvider, Program } from '@coral-xyz/anchor'
22
import { AccountType, getPythProgramKeyForCluster } from '@pythnetwork/client'
33
import { PythOracle, pythOracleProgram } from '@pythnetwork/client/lib/anchor'
44
import { useWallet } from '@solana/wallet-adapter-react'
5-
import { WalletModalButton } from '@solana/wallet-adapter-react-ui'
65
import { Cluster, PublicKey, TransactionInstruction } from '@solana/web3.js'
76
import { useCallback, useContext, useEffect, useState } from 'react'
87
import toast from 'react-hot-toast'
@@ -697,18 +696,12 @@ const General = () => {
697696
<p className="mb-8 leading-6">No proposed changes.</p>
698697
)}
699698
{Object.keys(changes).length > 0 ? (
700-
!connected ? (
701-
<div className="flex justify-center">
702-
<WalletModalButton className="action-btn text-base" />
703-
</div>
704-
) : (
705-
<button
706-
className="action-btn text-base"
707-
onClick={handleSendProposalButtonClick}
708-
>
709-
{isSendProposalButtonLoading ? <Spinner /> : 'Send Proposal'}
710-
</button>
711-
)
699+
<button
700+
className="action-btn text-base"
701+
onClick={handleSendProposalButtonClick}
702+
>
703+
{isSendProposalButtonLoading ? <Spinner /> : 'Send Proposal'}
704+
</button>
712705
) : null}
713706
</>
714707
)

‎governance/xc_admin/packages/xc_admin_frontend/components/tabs/Proposals.tsx

Lines changed: 80 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import * as Tooltip from '@radix-ui/react-tooltip'
2+
import { useWallet } from '@solana/wallet-adapter-react'
23
import { AccountMeta, PublicKey } from '@solana/web3.js'
34
import { MultisigAccount, TransactionAccount } from '@sqds/mesh/lib/types'
45
import { useRouter } from 'next/router'
@@ -28,6 +29,7 @@ import { usePythContext } from '../../contexts/PythContext'
2829
import { StatusFilterContext } from '../../contexts/StatusFilterContext'
2930
import { PRICE_FEED_MULTISIG } from '../../hooks/useMultisig'
3031
import VerifiedIcon from '../../images/icons/verified.inline.svg'
32+
import VotedIcon from '../../images/icons/voted.inline.svg'
3133
import { capitalizeFirstLetter } from '../../utils/capitalizeFirstLetter'
3234
import ClusterSwitch from '../ClusterSwitch'
3335
import CopyPubkey from '../common/CopyPubkey'
@@ -56,11 +58,13 @@ const getMappingCluster = (cluster: string) => {
5658
const ProposalRow = ({
5759
proposal,
5860
verified,
61+
voted,
5962
setCurrentProposalPubkey,
6063
multisig,
6164
}: {
6265
proposal: TransactionAccount
6366
verified: boolean
67+
voted: boolean
6468
setCurrentProposalPubkey: Dispatch<SetStateAction<string | undefined>>
6569
multisig: MultisigAccount | undefined
6670
}) => {
@@ -100,7 +104,10 @@ const ProposalRow = ({
100104
'...' +
101105
proposal.publicKey.toBase58().slice(-6)}
102106
</span>{' '}
103-
{verified ? <VerifiedIconWithTooltip /> : null}
107+
<div className="mr-2 items-center flex">
108+
{verified ? <VerifiedIconWithTooltip /> : null}
109+
</div>
110+
{voted ? <VotedIconWithTooltip /> : null}
104111
</div>
105112
<div>
106113
<StatusTag proposalStatus={status} />
@@ -167,6 +174,25 @@ const VerifiedIconWithTooltip = () => {
167174
)
168175
}
169176

177+
const VotedIconWithTooltip = () => {
178+
return (
179+
<div className="flex items-center">
180+
<Tooltip.Provider delayDuration={100} skipDelayDuration={500}>
181+
<Tooltip.Root>
182+
<Tooltip.Trigger>
183+
<VotedIcon />
184+
</Tooltip.Trigger>
185+
<Tooltip.Content side="top" sideOffset={8}>
186+
<span className="inline-block bg-darkGray3 p-2 text-xs text-light hoverable:bg-darkGray">
187+
You have voted on this proposal.
188+
</span>
189+
</Tooltip.Content>
190+
</Tooltip.Root>
191+
</Tooltip.Provider>
192+
</div>
193+
)
194+
}
195+
170196
const ParsedAccountPubkeyRow = ({
171197
mapping,
172198
title,
@@ -187,7 +213,7 @@ const ParsedAccountPubkeyRow = ({
187213
}
188214

189215
const getProposalStatus = (
190-
proposal: TransactionAccount | undefined,
216+
proposal: TransactionAccount | ClientProposal | undefined,
191217
multisig: MultisigAccount | undefined
192218
): string => {
193219
if (multisig && proposal) {
@@ -1054,6 +1080,8 @@ const Proposal = ({
10541080
)
10551081
}
10561082

1083+
type ClientProposal = TransactionAccount & { verified: boolean; voted: boolean }
1084+
10571085
const Proposals = ({
10581086
publisherKeyToNameMapping,
10591087
multisigSignerKeyToNameMapping,
@@ -1062,11 +1090,13 @@ const Proposals = ({
10621090
multisigSignerKeyToNameMapping: Record<string, string>
10631091
}) => {
10641092
const router = useRouter()
1093+
const { connected, publicKey: signerPublicKey } = useWallet()
10651094
const [currentProposal, setCurrentProposal] = useState<TransactionAccount>()
10661095
const [currentProposalIndex, setCurrentProposalIndex] = useState<number>()
10671096
const [allProposalsVerifiedArr, setAllProposalsVerifiedArr] = useState<
10681097
boolean[]
10691098
>([])
1099+
const [proposalsVotedArr, setProposalsVotedArr] = useState<boolean[]>([])
10701100
const [currentProposalPubkey, setCurrentProposalPubkey] = useState<string>()
10711101
const { cluster } = useContext(ClusterContext)
10721102
const { statusFilter } = useContext(StatusFilterContext)
@@ -1076,9 +1106,9 @@ const Proposals = ({
10761106
allProposalsIxsParsed,
10771107
isLoading: isMultisigLoading,
10781108
} = useMultisigContext()
1079-
const [filteredProposals, setFilteredProposals] = useState<
1080-
TransactionAccount[]
1081-
>(priceFeedMultisigProposals)
1109+
const [filteredProposals, setFilteredProposals] = useState<ClientProposal[]>(
1110+
[]
1111+
)
10821112

10831113
useEffect(() => {
10841114
if (!isMultisigLoading) {
@@ -1160,19 +1190,59 @@ const Proposals = ({
11601190
])
11611191

11621192
useEffect(() => {
1193+
const allClientProposals = priceFeedMultisigProposals.map(
1194+
(proposal, idx) => ({
1195+
...proposal,
1196+
verified: allProposalsVerifiedArr[idx],
1197+
voted: proposalsVotedArr[idx],
1198+
})
1199+
)
11631200
// filter price feed multisig proposals by status
11641201
if (statusFilter === 'all') {
1165-
setFilteredProposals(priceFeedMultisigProposals)
1202+
// pass priceFeedMultisigProposals and add verified and voted props
1203+
setFilteredProposals(allClientProposals)
11661204
} else {
11671205
setFilteredProposals(
1168-
priceFeedMultisigProposals.filter(
1206+
allClientProposals.filter(
11691207
(proposal) =>
11701208
getProposalStatus(proposal, priceFeedMultisigAccount) ===
11711209
statusFilter
11721210
)
11731211
)
11741212
}
1175-
}, [statusFilter, priceFeedMultisigAccount, priceFeedMultisigProposals])
1213+
}, [
1214+
statusFilter,
1215+
priceFeedMultisigAccount,
1216+
priceFeedMultisigProposals,
1217+
allProposalsVerifiedArr,
1218+
proposalsVotedArr,
1219+
])
1220+
1221+
useEffect(() => {
1222+
if (priceFeedMultisigAccount && connected && signerPublicKey) {
1223+
const res: boolean[] = []
1224+
priceFeedMultisigProposals.map((proposal) => {
1225+
// check if proposal.approved, proposal.cancelled, proposal.rejected has wallet pubkey and return true if anyone of them has wallet pubkey
1226+
const isProposalVoted =
1227+
proposal.approved.some(
1228+
(p) => p.toBase58() === signerPublicKey.toBase58()
1229+
) ||
1230+
proposal.cancelled.some(
1231+
(p) => p.toBase58() === signerPublicKey.toBase58()
1232+
) ||
1233+
proposal.rejected.some(
1234+
(p) => p.toBase58() === signerPublicKey.toBase58()
1235+
)
1236+
res.push(isProposalVoted)
1237+
})
1238+
setProposalsVotedArr(res)
1239+
}
1240+
}, [
1241+
priceFeedMultisigAccount,
1242+
priceFeedMultisigProposals,
1243+
connected,
1244+
signerPublicKey,
1245+
])
11761246

11771247
return (
11781248
<div className="relative">
@@ -1210,7 +1280,8 @@ const Proposals = ({
12101280
<ProposalRow
12111281
key={idx}
12121282
proposal={proposal}
1213-
verified={allProposalsVerifiedArr[idx]}
1283+
verified={proposal.verified}
1284+
voted={proposal.voted}
12141285
setCurrentProposalPubkey={setCurrentProposalPubkey}
12151286
multisig={priceFeedMultisigAccount}
12161287
/>

‎governance/xc_admin/packages/xc_admin_frontend/images/icons/voted.inline.svg

Lines changed: 23 additions & 0 deletions
Loading

0 commit comments

Comments
 (0)