3.6 KiB
Package that contains react components for usage with WakuVoting
-VotingRoomListEmpty component showing that a list is empty with button. When user is connected button calls onCreateClick otherwise call onConnectClick.
type VotingRoomListEmptyProps = { theme: Theme account: string | null | undefined onCreateClick: () => void // callback when user is connected onConnectClick: () => void // callback when user is not connected }
-VoteModal modal that lets people vote in given voting room.
export interface VoteModalProps { setShowModal: (val: boolean) => void // function that sets showModal showModal: boolean // when true shows modal votingRoom: VotingRoom availableAmount: number // amount of tokens user holds selectedVote: number // selected vote 0:against 1:for wakuVoting: WakuVoting theme: Theme className?: string // defined to show mobile and tablet versions can be 'mobile' or 'tablet }
-VotingRoomList shows a list with all voting rooms on blockchain
type VotingRoomListProps = {
theme: Theme
wakuVoting: WakuVoting
votes: number[] // array of ids of voting rooms to show
availableAmount: number // available token amount of user
account: string | null | undefined // address of user account
mobileOnClick?: (votingRoom: VotingRoom) => void // callback when user clicks voting room card when list is in mobile mode
}
-VotingRoomCard a card used to show voting room
interface VotingRoomCardProps {
votingRoomId: number // id of voting room to show
theme: Theme
availableAmount: number // token balance of current user
wakuVoting: WakuVoting
account: string | null | undefined // address of current user
mobileOnClick?: (votingRoom: VotingRoom) => void // callback when user clicks on card in mobile mode
CustomVoteModal?: (props: VoteModalProps) => ReactElement // custom react component to show when user clicks on vote for or against
customAgainstClick?: () => void // custom callback for clicking Against button
customForClick?: () => void // custom callback for clicking For button
}
export interface VoteModalProps {
setShowModal: (val: boolean) => void // function setting state
showModal: boolean // state defining whether to show modal
votingRoom: VotingRoom
availableAmount: number
selectedVote: number
wakuVoting: WakuVoting
theme: Theme
className?: string // class name that defines mobile or tablet version
}
-VotingRoomListHeader a list header with button. When user is connected button calls onCreateClick otherwise call onConnectClick.
type VotingRoomListHeaderProps = {
theme: Theme
account: string | null | undefined // address of user account
onCreateClick: () => void // callback when user is connected
onConnectClick: () => void // callback when user is not connected
}
-NewVotingRoomModal modal that lets people create new voting room.
type NewVotingRoomModalProps = {
theme: Theme
showModal: boolean // state defining whether to show modal
setShowModal: (val: boolean) => void // function that updates showModal state
availableAmount: number // token balance of user
wakuVoting: WakuVoting
}
-NewVotingRoomMobile component for smaller width screen that allows to create new voting room
interface NewVotingRoomMobileProps {
availableAmount: number // token balance of user
wakuVoting: WakuVoting
}
-VotingRoomMobile voting room information for smaller width with ability to vote on given voting room
interface VotingRoomMobileProps {
wakuVoting: WakuVoting
availableAmount: number // token balance of user
account: string | null | undefined // address of user account
}