mirror of
https://github.com/pezkuwichain/pwap.git
synced 2026-04-23 12:47:55 +00:00
feat: Phase 3 - P2P Fiat Trading System (Production-Ready)
Major Updates: - Footer improvements: English-only text, proper alignment, professional icons - DEX Pool implementation with AMM-based token swapping - Enhanced dashboard with DashboardContext for centralized data - New Citizens section and government entrance page DEX Features: - Token swap interface with price impact calculation - Pool management (add/remove liquidity) - Founder-only admin panel for pool creation - HEZ wrapping functionality (wHEZ) - Multiple token support (HEZ, wHEZ, USDT, USDC, BTC) UI/UX Improvements: - Footer: Removed distracting images, added Mail icons, English text - Footer: Proper left alignment for all sections - DEX Dashboard: Founder access badge, responsive tabs - Back to home navigation in DEX interface Component Structure: - src/components/dex/: DEX-specific components - src/components/admin/: Admin panel components - src/components/dashboard/: Dashboard widgets - src/contexts/DashboardContext.tsx: Centralized dashboard state Shared Libraries: - shared/lib/kyc.ts: KYC status management - shared/lib/citizenship-workflow.ts: Citizenship flow - shared/utils/dex.ts: DEX calculations and utilities 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,652 @@
|
||||
import { useState, useEffect } from 'react';
|
||||
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||
import { Button } from '@/components/ui/button';
|
||||
import { Badge } from '@/components/ui/badge';
|
||||
import { useToast } from '@/hooks/use-toast';
|
||||
import { usePolkadot } from '@/contexts/PolkadotContext';
|
||||
import { Loader2, ThumbsUp, ThumbsDown, CheckCircle, Clock, RefreshCw } from 'lucide-react';
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableHead,
|
||||
TableHeader,
|
||||
TableRow,
|
||||
} from '@/components/ui/table';
|
||||
import { COMMISSIONS } from '@/config/commissions';
|
||||
|
||||
interface Proposal {
|
||||
hash: string;
|
||||
proposalIndex: number;
|
||||
threshold: number;
|
||||
ayes: string[];
|
||||
nays: string[];
|
||||
end: number;
|
||||
call?: any;
|
||||
}
|
||||
|
||||
export function CommissionVotingTab() {
|
||||
const { api, isApiReady, selectedAccount } = usePolkadot();
|
||||
const { toast } = useToast();
|
||||
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [proposals, setProposals] = useState<Proposal[]>([]);
|
||||
const [voting, setVoting] = useState<string | null>(null);
|
||||
const [isCommissionMember, setIsCommissionMember] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (!api || !isApiReady) {
|
||||
return;
|
||||
}
|
||||
|
||||
checkMembership();
|
||||
loadProposals();
|
||||
}, [api, isApiReady, selectedAccount]);
|
||||
|
||||
const checkMembership = async () => {
|
||||
if (!api || !selectedAccount) {
|
||||
console.log('No API or selected account');
|
||||
setIsCommissionMember(false);
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
console.log('Checking membership for:', selectedAccount.address);
|
||||
|
||||
// Check if user is directly a member of DynamicCommissionCollective
|
||||
const members = await api.query.dynamicCommissionCollective.members();
|
||||
const memberList = members.toJSON() as string[];
|
||||
console.log('Commission members:', memberList);
|
||||
|
||||
const isMember = memberList.includes(selectedAccount.address);
|
||||
console.log('Is commission member:', isMember);
|
||||
|
||||
setIsCommissionMember(isMember);
|
||||
} catch (error) {
|
||||
console.error('Error checking membership:', error);
|
||||
setIsCommissionMember(false);
|
||||
}
|
||||
};
|
||||
|
||||
const loadProposals = async () => {
|
||||
if (!api || !isApiReady) {
|
||||
setLoading(false);
|
||||
return;
|
||||
}
|
||||
|
||||
setLoading(true);
|
||||
try {
|
||||
// Get all active proposal hashes
|
||||
const proposalHashes = await api.query.dynamicCommissionCollective.proposals();
|
||||
|
||||
const proposalList: Proposal[] = [];
|
||||
|
||||
for (let i = 0; i < proposalHashes.length; i++) {
|
||||
const hash = proposalHashes[i];
|
||||
|
||||
// Get voting info for this proposal
|
||||
const voting = await api.query.dynamicCommissionCollective.voting(hash);
|
||||
|
||||
if (!voting.isEmpty) {
|
||||
const voteData = voting.unwrap();
|
||||
|
||||
// Get proposal details
|
||||
const proposalOption = await api.query.dynamicCommissionCollective.proposalOf(hash);
|
||||
let proposalCall = null;
|
||||
|
||||
if (!proposalOption.isEmpty) {
|
||||
proposalCall = proposalOption.unwrap();
|
||||
}
|
||||
|
||||
// Get the actual proposal index from the chain
|
||||
const proposalIndex = (voteData as any).index?.toNumber() || i;
|
||||
|
||||
proposalList.push({
|
||||
hash: hash.toHex(),
|
||||
proposalIndex: proposalIndex,
|
||||
threshold: voteData.threshold.toNumber(),
|
||||
ayes: voteData.ayes.map((a: any) => a.toString()),
|
||||
nays: voteData.nays.map((n: any) => n.toString()),
|
||||
end: voteData.end.toNumber(),
|
||||
call: proposalCall?.toHuman(),
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
setProposals(proposalList);
|
||||
console.log(`Loaded ${proposalList.length} active proposals`);
|
||||
} catch (error) {
|
||||
console.error('Error loading proposals:', error);
|
||||
toast({
|
||||
title: 'Error',
|
||||
description: 'Failed to load proposals',
|
||||
variant: 'destructive',
|
||||
});
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleVote = async (proposal: Proposal, approve: boolean) => {
|
||||
if (!api || !selectedAccount) {
|
||||
toast({
|
||||
title: 'Wallet Not Connected',
|
||||
description: 'Please connect your wallet first',
|
||||
variant: 'destructive',
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!isCommissionMember) {
|
||||
toast({
|
||||
title: 'Not a Commission Member',
|
||||
description: 'You are not a member of the KYC Approval Commission',
|
||||
variant: 'destructive',
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
setVoting(proposal.hash);
|
||||
try {
|
||||
const { web3FromAddress } = await import('@polkadot/extension-dapp');
|
||||
const injector = await web3FromAddress(selectedAccount.address);
|
||||
|
||||
console.log(`Voting ${approve ? 'AYE' : 'NAY'} on proposal:`, proposal.hash);
|
||||
|
||||
// Vote directly (no proxy needed)
|
||||
const tx = api.tx.dynamicCommissionCollective.vote(
|
||||
proposal.hash,
|
||||
proposal.proposalIndex,
|
||||
approve
|
||||
);
|
||||
|
||||
await new Promise<void>((resolve, reject) => {
|
||||
tx.signAndSend(
|
||||
selectedAccount.address,
|
||||
{ signer: injector.signer },
|
||||
({ status, dispatchError, events }) => {
|
||||
console.log('Transaction status:', status.type);
|
||||
|
||||
if (status.isInBlock || status.isFinalized) {
|
||||
if (dispatchError) {
|
||||
let errorMessage = 'Transaction failed';
|
||||
|
||||
if (dispatchError.isModule) {
|
||||
const decoded = api.registry.findMetaError(dispatchError.asModule);
|
||||
errorMessage = `${decoded.section}.${decoded.name}: ${decoded.docs.join(' ')}`;
|
||||
} else {
|
||||
errorMessage = dispatchError.toString();
|
||||
}
|
||||
|
||||
console.error('Vote error:', errorMessage);
|
||||
toast({
|
||||
title: 'Vote Failed',
|
||||
description: errorMessage,
|
||||
variant: 'destructive',
|
||||
});
|
||||
reject(new Error(errorMessage));
|
||||
return;
|
||||
}
|
||||
|
||||
// Check for Voted event
|
||||
const votedEvent = events.find(({ event }) =>
|
||||
event.section === 'dynamicCommissionCollective' && event.method === 'Voted'
|
||||
);
|
||||
|
||||
// Check for Executed event (threshold reached)
|
||||
const executedEvent = events.find(({ event }) =>
|
||||
event.section === 'dynamicCommissionCollective' && event.method === 'Executed'
|
||||
);
|
||||
|
||||
if (executedEvent) {
|
||||
console.log('✅ Proposal executed (threshold reached)');
|
||||
toast({
|
||||
title: 'Success',
|
||||
description: 'Proposal passed and executed! KYC approved.',
|
||||
});
|
||||
} else if (votedEvent) {
|
||||
console.log('✅ Vote recorded');
|
||||
toast({
|
||||
title: 'Vote Recorded',
|
||||
description: `Your ${approve ? 'AYE' : 'NAY'} vote has been recorded`,
|
||||
});
|
||||
}
|
||||
|
||||
resolve();
|
||||
}
|
||||
}
|
||||
).catch((error) => {
|
||||
console.error('Failed to sign and send:', error);
|
||||
toast({
|
||||
title: 'Transaction Error',
|
||||
description: error.message || 'Failed to submit transaction',
|
||||
variant: 'destructive',
|
||||
});
|
||||
reject(error);
|
||||
});
|
||||
});
|
||||
|
||||
// Reload proposals after voting
|
||||
setTimeout(() => {
|
||||
loadProposals();
|
||||
}, 2000);
|
||||
|
||||
} catch (error: any) {
|
||||
console.error('Error voting:', error);
|
||||
toast({
|
||||
title: 'Error',
|
||||
description: error.message || 'Failed to vote',
|
||||
variant: 'destructive',
|
||||
});
|
||||
} finally {
|
||||
setVoting(null);
|
||||
}
|
||||
};
|
||||
|
||||
const handleExecute = async (proposal: Proposal) => {
|
||||
if (!api || !selectedAccount) {
|
||||
toast({
|
||||
title: 'Wallet Not Connected',
|
||||
description: 'Please connect your wallet first',
|
||||
variant: 'destructive',
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
setVoting(proposal.hash);
|
||||
try {
|
||||
const { web3FromAddress } = await import('@polkadot/extension-dapp');
|
||||
const injector = await web3FromAddress(selectedAccount.address);
|
||||
|
||||
console.log('Executing proposal:', proposal.hash);
|
||||
|
||||
// Get proposal length bound
|
||||
const proposalOption = await api.query.dynamicCommissionCollective.proposalOf(proposal.hash);
|
||||
const proposalCall = proposalOption.unwrap();
|
||||
const lengthBound = proposalCall.encodedLength;
|
||||
|
||||
const tx = api.tx.dynamicCommissionCollective.close(
|
||||
proposal.hash,
|
||||
proposal.proposalIndex,
|
||||
{
|
||||
refTime: 1_000_000_000_000, // 1 trillion for ref time
|
||||
proofSize: 64 * 1024, // 64 KB for proof size
|
||||
},
|
||||
lengthBound
|
||||
);
|
||||
|
||||
await new Promise<void>((resolve, reject) => {
|
||||
tx.signAndSend(
|
||||
selectedAccount.address,
|
||||
{ signer: injector.signer },
|
||||
({ status, dispatchError, events }) => {
|
||||
console.log('Transaction status:', status.type);
|
||||
|
||||
if (status.isInBlock || status.isFinalized) {
|
||||
if (dispatchError) {
|
||||
let errorMessage = 'Transaction failed';
|
||||
|
||||
if (dispatchError.isModule) {
|
||||
const decoded = api.registry.findMetaError(dispatchError.asModule);
|
||||
errorMessage = `${decoded.section}.${decoded.name}: ${decoded.docs.join(' ')}`;
|
||||
} else {
|
||||
errorMessage = dispatchError.toString();
|
||||
}
|
||||
|
||||
console.error('Execute error:', errorMessage);
|
||||
toast({
|
||||
title: 'Execute Failed',
|
||||
description: errorMessage,
|
||||
variant: 'destructive',
|
||||
});
|
||||
reject(new Error(errorMessage));
|
||||
return;
|
||||
}
|
||||
|
||||
const executedEvent = events.find(({ event }) =>
|
||||
event.section === 'dynamicCommissionCollective' && event.method === 'Executed'
|
||||
);
|
||||
|
||||
const closedEvent = events.find(({ event }) =>
|
||||
event.section === 'dynamicCommissionCollective' && event.method === 'Closed'
|
||||
);
|
||||
|
||||
if (executedEvent) {
|
||||
const eventData = executedEvent.event.data.toHuman();
|
||||
console.log('✅ Proposal executed');
|
||||
console.log('Execute event data:', eventData);
|
||||
console.log('Result:', eventData);
|
||||
|
||||
// Check if execution was successful
|
||||
const result = eventData[eventData.length - 1]; // Last parameter is usually the result
|
||||
if (result && typeof result === 'object' && 'Err' in result) {
|
||||
console.error('Execution failed:', result.Err);
|
||||
toast({
|
||||
title: 'Execution Failed',
|
||||
description: `Proposal closed but execution failed: ${JSON.stringify(result.Err)}`,
|
||||
variant: 'destructive',
|
||||
});
|
||||
} else {
|
||||
toast({
|
||||
title: 'Proposal Executed!',
|
||||
description: 'KYC approved and NFT minted successfully!',
|
||||
});
|
||||
}
|
||||
} else if (closedEvent) {
|
||||
console.log('Proposal closed');
|
||||
toast({
|
||||
title: 'Proposal Closed',
|
||||
description: 'Proposal has been closed',
|
||||
});
|
||||
}
|
||||
|
||||
resolve();
|
||||
}
|
||||
}
|
||||
).catch((error) => {
|
||||
console.error('Failed to sign and send:', error);
|
||||
toast({
|
||||
title: 'Transaction Error',
|
||||
description: error.message || 'Failed to submit transaction',
|
||||
variant: 'destructive',
|
||||
});
|
||||
reject(error);
|
||||
});
|
||||
});
|
||||
|
||||
setTimeout(() => {
|
||||
loadProposals();
|
||||
}, 2000);
|
||||
|
||||
} catch (error: any) {
|
||||
console.error('Error executing:', error);
|
||||
toast({
|
||||
title: 'Error',
|
||||
description: error.message || 'Failed to execute proposal',
|
||||
variant: 'destructive',
|
||||
});
|
||||
} finally {
|
||||
setVoting(null);
|
||||
}
|
||||
};
|
||||
|
||||
const getProposalDescription = (call: any): string => {
|
||||
if (!call) return 'Unknown proposal';
|
||||
|
||||
try {
|
||||
const callStr = JSON.stringify(call);
|
||||
if (callStr.includes('approveKyc')) {
|
||||
return 'KYC Approval';
|
||||
}
|
||||
if (callStr.includes('rejectKyc')) {
|
||||
return 'KYC Rejection';
|
||||
}
|
||||
return 'Commission Action';
|
||||
} catch {
|
||||
return 'Unknown proposal';
|
||||
}
|
||||
};
|
||||
|
||||
const getStatusBadge = (proposal: Proposal) => {
|
||||
const progress = (proposal.ayes.length / proposal.threshold) * 100;
|
||||
|
||||
if (proposal.ayes.length >= proposal.threshold) {
|
||||
return <Badge variant="default" className="bg-green-600">PASSED</Badge>;
|
||||
}
|
||||
if (progress >= 50) {
|
||||
return <Badge variant="default" className="bg-yellow-600">VOTING ({progress.toFixed(0)}%)</Badge>;
|
||||
}
|
||||
return <Badge variant="secondary">VOTING ({progress.toFixed(0)}%)</Badge>;
|
||||
};
|
||||
|
||||
if (!isApiReady) {
|
||||
return (
|
||||
<Card>
|
||||
<CardContent className="pt-6">
|
||||
<div className="flex items-center justify-center">
|
||||
<Loader2 className="h-6 w-6 animate-spin mr-2" />
|
||||
<span>Connecting to blockchain...</span>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
if (!selectedAccount) {
|
||||
return (
|
||||
<Card>
|
||||
<CardContent className="pt-6">
|
||||
<div className="text-center text-muted-foreground">
|
||||
<p>Please connect your wallet to view commission proposals</p>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
if (!isCommissionMember) {
|
||||
const handleJoinCommission = async () => {
|
||||
if (!api || !selectedAccount) return;
|
||||
|
||||
try {
|
||||
const { web3FromAddress } = await import('@polkadot/extension-dapp');
|
||||
const injector = await web3FromAddress(selectedAccount.address);
|
||||
|
||||
// Get current members
|
||||
const currentMembers = await api.query.dynamicCommissionCollective.members();
|
||||
const memberList = (currentMembers.toJSON() as string[]) || [];
|
||||
|
||||
// Add current user to members list
|
||||
if (!memberList.includes(selectedAccount.address)) {
|
||||
memberList.push(selectedAccount.address);
|
||||
}
|
||||
|
||||
console.log('Adding member to commission:', selectedAccount.address);
|
||||
console.log('New member list:', memberList);
|
||||
|
||||
// Use sudo to update members (requires sudo access)
|
||||
const tx = api.tx.sudo.sudo(
|
||||
api.tx.dynamicCommissionCollective.setMembers(
|
||||
memberList,
|
||||
null,
|
||||
memberList.length
|
||||
)
|
||||
);
|
||||
|
||||
await tx.signAndSend(
|
||||
selectedAccount.address,
|
||||
{ signer: injector.signer },
|
||||
({ status, dispatchError }) => {
|
||||
if (status.isInBlock || status.isFinalized) {
|
||||
if (dispatchError) {
|
||||
let errorMessage = 'Failed to join commission';
|
||||
if (dispatchError.isModule) {
|
||||
const decoded = api.registry.findMetaError(dispatchError.asModule);
|
||||
errorMessage = `${decoded.section}.${decoded.name}`;
|
||||
}
|
||||
toast({
|
||||
title: 'Error',
|
||||
description: errorMessage,
|
||||
variant: 'destructive',
|
||||
});
|
||||
} else {
|
||||
toast({
|
||||
title: 'Success',
|
||||
description: 'You have joined the KYC Commission!',
|
||||
});
|
||||
setTimeout(() => checkMembership(), 2000);
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
} catch (error: any) {
|
||||
toast({
|
||||
title: 'Error',
|
||||
description: error.message || 'Failed to join commission',
|
||||
variant: 'destructive',
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Card>
|
||||
<CardContent className="pt-6">
|
||||
<div className="text-center">
|
||||
<p className="text-muted-foreground mb-4">You are not a member of the KYC Approval Commission</p>
|
||||
<p className="text-sm text-muted-foreground mb-6">Only commission members can view and vote on proposals</p>
|
||||
<Button
|
||||
onClick={handleJoinCommission}
|
||||
className="bg-green-600 hover:bg-green-700"
|
||||
>
|
||||
Join Commission
|
||||
</Button>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
<div className="flex justify-between items-center">
|
||||
<div>
|
||||
<h2 className="text-2xl font-bold">Commission Proposals</h2>
|
||||
<p className="text-muted-foreground">
|
||||
Active voting proposals for {COMMISSIONS.KYC.name}
|
||||
</p>
|
||||
</div>
|
||||
<Button
|
||||
onClick={loadProposals}
|
||||
disabled={loading}
|
||||
variant="outline"
|
||||
>
|
||||
<RefreshCw className={`h-4 w-4 mr-2 ${loading ? 'animate-spin' : ''}`} />
|
||||
Refresh
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
{loading ? (
|
||||
<Card>
|
||||
<CardContent className="pt-6">
|
||||
<div className="flex items-center justify-center">
|
||||
<Loader2 className="h-6 w-6 animate-spin mr-2" />
|
||||
<span>Loading proposals...</span>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
) : proposals.length === 0 ? (
|
||||
<Card>
|
||||
<CardContent className="pt-6">
|
||||
<div className="text-center text-muted-foreground">
|
||||
<Clock className="h-12 w-12 mx-auto mb-4 opacity-50" />
|
||||
<p>No active proposals</p>
|
||||
<p className="text-sm mt-2">Proposals will appear here when commission members create them</p>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
) : (
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle>Active Proposals ({proposals.length})</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent>
|
||||
<Table>
|
||||
<TableHeader>
|
||||
<TableRow>
|
||||
<TableHead>Proposal</TableHead>
|
||||
<TableHead>Type</TableHead>
|
||||
<TableHead>Status</TableHead>
|
||||
<TableHead>Votes</TableHead>
|
||||
<TableHead className="text-right">Actions</TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{proposals.map((proposal) => (
|
||||
<TableRow key={proposal.hash}>
|
||||
<TableCell className="font-mono text-sm">
|
||||
#{proposal.proposalIndex}
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
{getProposalDescription(proposal.call)}
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
{getStatusBadge(proposal)}
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
<div className="flex gap-2 items-center">
|
||||
<Badge variant="outline" className="flex items-center gap-1">
|
||||
<ThumbsUp className="h-3 w-3" />
|
||||
{proposal.ayes.length}
|
||||
</Badge>
|
||||
<Badge variant="outline" className="flex items-center gap-1">
|
||||
<ThumbsDown className="h-3 w-3" />
|
||||
{proposal.nays.length}
|
||||
</Badge>
|
||||
<span className="text-sm text-muted-foreground">
|
||||
/ {proposal.threshold}
|
||||
</span>
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell className="text-right">
|
||||
<div className="flex gap-2 justify-end">
|
||||
{proposal.ayes.length >= proposal.threshold ? (
|
||||
<Button
|
||||
size="sm"
|
||||
variant="default"
|
||||
onClick={() => handleExecute(proposal)}
|
||||
disabled={voting === proposal.hash}
|
||||
className="bg-blue-600 hover:bg-blue-700"
|
||||
>
|
||||
{voting === proposal.hash ? (
|
||||
<Loader2 className="h-4 w-4 animate-spin" />
|
||||
) : (
|
||||
<>Execute Proposal</>
|
||||
)}
|
||||
</Button>
|
||||
) : (
|
||||
<>
|
||||
<Button
|
||||
size="sm"
|
||||
variant="default"
|
||||
onClick={() => handleVote(proposal, true)}
|
||||
disabled={voting === proposal.hash}
|
||||
className="bg-green-600 hover:bg-green-700"
|
||||
>
|
||||
{voting === proposal.hash ? (
|
||||
<Loader2 className="h-4 w-4 animate-spin" />
|
||||
) : (
|
||||
<>
|
||||
<ThumbsUp className="h-4 w-4 mr-1" />
|
||||
Aye
|
||||
</>
|
||||
)}
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
variant="destructive"
|
||||
onClick={() => handleVote(proposal, false)}
|
||||
disabled={voting === proposal.hash}
|
||||
>
|
||||
{voting === proposal.hash ? (
|
||||
<Loader2 className="h-4 w-4 animate-spin" />
|
||||
) : (
|
||||
<>
|
||||
<ThumbsDown className="h-4 w-4 mr-1" />
|
||||
Nay
|
||||
</>
|
||||
)}
|
||||
</Button>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
))}
|
||||
</TableBody>
|
||||
</Table>
|
||||
</CardContent>
|
||||
</Card>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user