status-im
/
community-dapp
mirror of https://github.com/status-im/community-dapp.git
2
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Use token contract (#175)

This commit is contained in:
Szymon Szlachtowicz 2021-07-30 14:34:49 +02:00 committed by GitHub
parent 8e88d925d8
commit c7ce5544cf
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
20 changed files with 85 additions and 98 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/DApp/src/components/Modal.tsx
View File

@ -51,6 +51,7 @@ const PopUpWindow = styled.div`
max-width: 475px;
margin: 20vh auto 2vh;
padding: 24px;
margin-bottom: 100px;
background-color: ${Colors.GrayLight};
box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.1);
border-radius: 6px;

2
packages/DApp/src/components/card/CardCommunity.tsx
View File

@ -80,7 +80,7 @@ export const CardCommunity = ({
setShowRemoveModal(val)
}}
>
<RemoveModal community={community} availableAmount={549739700} setShowConfirmModal={setNewModal} />{' '}
<RemoveModal community={community} setShowConfirmModal={setNewModal} />{' '}
</Modal>
)}
{showConfirmModal && (

2
packages/DApp/src/components/card/CardFeature.tsx
View File

@ -70,7 +70,7 @@ export const CardFeature = ({ community, heading, icon, sum, timeLeft, currentVo
<div>
{showFeatureModal && (
<Modal heading="Feature in “Weekly Featured”?" setShowModal={setShowFeatureModal}>
<FeatureModal community={community} availableAmount={549739700} setShowConfirmModal={setNewModal} />{' '}
<FeatureModal community={community} setShowConfirmModal={setNewModal} />{' '}
</Modal>
)}
{showConfirmModal && (

7
packages/DApp/src/components/card/CardVote/CardVote.tsx
View File

@ -25,7 +25,7 @@ export const CardVote = ({ room, hideModalFunction }: CardVoteProps) => {
const { account } = useEthers()
const [showVoteModal, setShowVoteModal] = useState(false)
const [showConfirmModal, setShowConfirmModal] = useState(false)
const [proposingAmount, setProposingAmount] = useState(0)
const [selectedVoted, setSelectedVoted] = useState(voteTypes['Add'].for)
const { votingContract } = useContracts()
@ -51,10 +51,6 @@ export const CardVote = ({ room, hideModalFunction }: CardVoteProps) => {
const voteConstants = voteTypes[vote.type]
const winner = getVotingWinner(vote)
const availableAmount = 65800076
const initialProposing = vote?.type === 'Remove' && availableAmount > 2000000 ? 2000000 : 0
const [proposingAmount, setProposingAmount] = useState(initialProposing)
if (!vote) {
return <CardVoteBlock />
@ -67,7 +63,6 @@ export const CardVote = ({ room, hideModalFunction }: CardVoteProps) => {
vote={vote}
room={room.roomNumber}
selectedVote={selectedVoted}
availableAmount={availableAmount}
proposingAmount={proposingAmount}
setShowConfirmModal={setNext}
setProposingAmount={setProposingAmount}

10
packages/DApp/src/components/card/FeatureModal.tsx
View File

@ -9,11 +9,10 @@ import { useSendWakuFeature } from '../../hooks/useSendWakuFeature'
interface FeatureModalProps {
community: CommunityDetail
availableAmount: number
setShowConfirmModal: (val: boolean) => void
}
export function FeatureModal({ community, availableAmount, setShowConfirmModal }: FeatureModalProps) {
export function FeatureModal({ community, setShowConfirmModal }: FeatureModalProps) {
const [proposingAmount, setProposingAmount] = useState(0)
const sendWaku = useSendWakuFeature()
const disabled = proposingAmount === 0
@ -22,12 +21,7 @@ export function FeatureModal({ community, availableAmount, setShowConfirmModal }
<ColumnFlexDiv>
<CardCommunity community={community} />
<VoteProposeWrap>
<VotePropose
availableAmount={availableAmount}
setProposingAmount={setProposingAmount}
proposingAmount={proposingAmount}
disabled={disabled}
/>
<VotePropose setProposingAmount={setProposingAmount} proposingAmount={proposingAmount} disabled={disabled} />
<VoteConfirmBtn
disabled={disabled}
onClick={async () => {

11
packages/DApp/src/components/card/ProposeModal.tsx
View File

@ -16,25 +16,19 @@ import { useProposeWarning } from '../../hooks/useProposeWarning'
import { PublicKeyInput } from '../PublicKeyInput'
interface ProposeModalProps {
availableAmount: number
setShowConfirmModal: (val: boolean) => void
setCommunityFound: (community: CommunityDetail | undefined) => void
communityFound: CommunityDetail | undefined
}
export function ProposeModal({
availableAmount,
setShowConfirmModal,
setCommunityFound,
communityFound,
}: ProposeModalProps) {
export function ProposeModal({ setShowConfirmModal, setCommunityFound, communityFound }: ProposeModalProps) {
const [proposingAmount, setProposingAmount] = useState(0)
const [publicKey, setPublicKey] = useState('')
const loading = useCommunityDetails(publicKey, setCommunityFound)
const { votingContract } = useContracts()
const { send, state } = useContractFunction(votingContract, 'initializeVotingRoom')
const warning = useProposeWarning(communityFound, availableAmount)
const warning = useProposeWarning(communityFound)
useEffect(() => {
if (state.status === 'Mining') {
@ -54,7 +48,6 @@ export function ProposeModal({
{communityFound && communityFound.validForAddition && publicKey && (
<VoteProposeWrap>
<VotePropose
availableAmount={availableAmount}
setProposingAmount={setProposingAmount}
proposingAmount={proposingAmount}
disabled={!communityFound}

13
packages/DApp/src/components/card/RemoveAmountPicker.tsx
View File

@ -8,15 +8,16 @@ import { ButtonPrimary } from '../Button'
import { VotePropose } from '../votes/VotePropose'
import { Warning } from '../votes/VoteWarning'
import { ConfirmBtn } from './VoteConfirmModal'
import { useAvailableAmount } from '../../hooks/useAvailableAmount'
import { BigNumber } from 'ethers'
interface RemoveAmountPickerProps {
community: CommunityDetail
availableAmount: number
setShowConfirmModal: (val: boolean) => void
}
export function RemoveAmountPicker({ community, availableAmount, setShowConfirmModal }: RemoveAmountPickerProps) {
export function RemoveAmountPicker({ community, setShowConfirmModal }: RemoveAmountPickerProps) {
const availableAmount = useAvailableAmount()
const [proposingAmount, setProposingAmount] = useState(0)
const disabled = proposingAmount === 0
const { votingContract } = useContracts()
@ -72,11 +73,7 @@ export function RemoveAmountPicker({ community, availableAmount, setShowConfirmM
}
return (
<VoteProposeWrap>
<VotePropose
availableAmount={availableAmount}
setProposingAmount={setProposingAmount}
proposingAmount={proposingAmount}
/>
<VotePropose setProposingAmount={setProposingAmount} proposingAmount={proposingAmount} />
<VoteConfirmBtn disabled={disabled} onClick={() => send(0, community.publicKey, BigNumber.from(proposingAmount))}>
Confirm vote to remove community
</VoteConfirmBtn>

9
packages/DApp/src/components/card/RemoveModal.tsx
View File

@ -6,19 +6,14 @@ import { RemoveAmountPicker } from '../card/RemoveAmountPicker'
interface RemoveModalProps {
community: CommunityDetail
availableAmount: number
setShowConfirmModal: (val: boolean) => void
}
export function RemoveModal({ community, availableAmount, setShowConfirmModal }: RemoveModalProps) {
export function RemoveModal({ community, setShowConfirmModal }: RemoveModalProps) {
return (
<ColumnFlexDiv>
<CardCommunity community={community} />
<RemoveAmountPicker
community={community}
availableAmount={availableAmount}
setShowConfirmModal={setShowConfirmModal}
/>
<RemoveAmountPicker community={community} setShowConfirmModal={setShowConfirmModal} />
</ColumnFlexDiv>
)
}

3
packages/DApp/src/components/card/VoteModal.tsx
View File

@ -11,7 +11,6 @@ import { ColumnFlexDiv } from '../../constants/styles'
export interface VoteModalProps {
vote: CurrentVoting
selectedVote: VoteType
availableAmount: number
proposingAmount: number
room: number
setShowConfirmModal: (show: boolean) => void
@ -22,7 +21,6 @@ export function VoteModal({
vote,
room,
selectedVote,
availableAmount,
proposingAmount,
setShowConfirmModal,
setProposingAmount,
@ -36,7 +34,6 @@ export function VoteModal({
<VotePropose
vote={vote}
selectedVote={selectedVote}
availableAmount={availableAmount}
setProposingAmount={setProposingAmount}
proposingAmount={proposingAmount}
/>

20
packages/DApp/src/components/votes/VotePropose.tsx
View File

@ -1,8 +1,9 @@
import React from 'react'
import React, { useEffect } from 'react'
import { useState } from 'react'
import styled from 'styled-components'
import { Colors, ColumnFlexDiv } from '../../constants/styles'
import { addCommas } from '../../helpers/addCommas'
import { useAvailableAmount } from '../../hooks/useAvailableAmount'
import { CurrentVoting } from '../../models/community'
import { Input } from '../Input'
import { Warning } from './VoteWarning'
@ -12,22 +13,21 @@ export interface VoteProposingProps {
selectedVote?: {
noun: string
}
availableAmount: number
setProposingAmount: (show: number) => void
proposingAmount: number
disabled?: boolean
}
export function VotePropose({
vote,
selectedVote,
availableAmount,
proposingAmount,
disabled,
setProposingAmount,
}: VoteProposingProps) {
export function VotePropose({ vote, selectedVote, proposingAmount, disabled, setProposingAmount }: VoteProposingProps) {
const availableAmount = useAvailableAmount()
const [displayAmount, setDisplayAmount] = useState(addCommas(proposingAmount) + ' SNT')
useEffect(() => {
const initialProposing = vote?.type === 'Remove' && availableAmount > 2000000 ? 2000000 : 0
setProposingAmount(initialProposing)
}, [])
let step = 10 ** (Math.floor(Math.log10(availableAmount)) - 2)
if (availableAmount < 100) {
step = 1

1
packages/DApp/src/components/votes/VotesInfo.tsx
View File

@ -28,7 +28,6 @@ export function VotesInfo() {
{showProposeModal && (
<Modal heading="Add community to directory" setShowModal={setShowProposeModal}>
<ProposeModal
availableAmount={65245346}
setShowConfirmModal={setNext}
setCommunityFound={setCommunityFound}
communityFound={communityFound}

43
packages/DApp/src/components/votes/VotingEmpty.tsx
View File

@ -36,20 +36,10 @@ export function VotingEmpty() {
}, [])
return (
<VotingEmptyWrap>
<p>😲</p>
<ColumnFlexDiv>
<EmptyHeading>There are no ongoing votes at the moment!</EmptyHeading>
<EmptyText>
If you know of a community that you think should be added to the Community Directory, feel free to propose
it's addition by starting a vote
</EmptyText>
</ColumnFlexDiv>
<div>
{showProposeModal && (
<Modal heading="Add community to directory" setShowModal={setShowProposeModal}>
<ProposeModal
availableAmount={65245346}
setShowConfirmModal={setNext}
setCommunityFound={setCommunityFound}
communityFound={communityFound}
@ -65,17 +55,28 @@ export function VotingEmpty() {
/>
</Modal>
)}
<VotingEmptyWrap>
<p>😲</p>
{!mobileVersion && (
<div>
{account ? (
<ProposeButton onClick={() => setShowProposeModal(true)}>Propose community</ProposeButton>
) : (
<ConnectButton />
)}
</div>
)}
</VotingEmptyWrap>
<ColumnFlexDiv>
<EmptyHeading>There are no ongoing votes at the moment!</EmptyHeading>
<EmptyText>
If you know of a community that you think should be added to the Community Directory, feel free to propose
it's addition by starting a vote
</EmptyText>
</ColumnFlexDiv>
{!mobileVersion && (
<div>
{account ? (
<ProposeButton onClick={() => setShowProposeModal(true)}>Propose community</ProposeButton>
) : (
<ConnectButton />
)}
</div>
)}
</VotingEmptyWrap>
</div>
)
}

6
packages/DApp/src/componentsMobile/CardVoteMobile.tsx
View File

@ -41,10 +41,7 @@ export const CardVoteMobile = ({ room }: CardVoteMobileProps) => {
const voteConstants = voteTypes[vote.type]
const winner = getVotingWinner(vote)
const availableAmount = 65800076
const initialProposing = vote?.type === 'Remove' && availableAmount > 2000000 ? 2000000 : 0
const [proposingAmount, setProposingAmount] = useState(initialProposing)
const [proposingAmount, setProposingAmount] = useState(0)
const [showHistory, setShowHistory] = useState(false)
const isDisabled = room.details.votingHistory.length === 0
@ -76,7 +73,6 @@ export const CardVoteMobile = ({ room }: CardVoteMobileProps) => {
<VotePropose
vote={vote}
selectedVote={selectedVoted}
availableAmount={availableAmount}
proposingAmount={proposingAmount}
setProposingAmount={setProposingAmount}
/>

6
packages/DApp/src/componentsMobile/FeatureMobile.tsx
View File

@ -46,11 +46,7 @@ export function FeatureMobile() {
<MobileBlock>
<FeatureHeading>{`Feature ${community.name}?`}</FeatureHeading>
<VotePropose
availableAmount={60000000}
setProposingAmount={setProposingAmount}
proposingAmount={proposingAmount}
/>
<VotePropose setProposingAmount={setProposingAmount} proposingAmount={proposingAmount} />
<FeatureBtn disabled={disabled}>
Feature this community! <span style={{ fontSize: '20px' }}>⭐️</span>
</FeatureBtn>

4
packages/DApp/src/componentsMobile/ProposeMobile.tsx
View File

@ -25,7 +25,6 @@ import { InfoText, ProposingInfo, VoteProposeWrap, WarningWrap } from '../compon
import { HistoryLink } from './CardVoteMobile'
export function ProposeMobile() {
const availableAmount = 60000000
const [proposingAmount, setProposingAmount] = useState(0)
const [communityFound, setCommunityFound] = useState<CommunityDetail | undefined>(undefined)
const [publicKey, setPublicKey] = useState('')
@ -33,7 +32,7 @@ export function ProposeMobile() {
const { votingContract } = useContracts()
const { send } = useContractFunction(votingContract, 'initializeVotingRoom')
const warning = useProposeWarning(communityFound, availableAmount)
const warning = useProposeWarning(communityFound)
const [showHistory, setShowHistory] = useState(false)
const isDisabled = communityFound ? communityFound.votingHistory.length === 0 : false
@ -66,7 +65,6 @@ export function ProposeMobile() {
<VoteProposeWrap>
<ProposingHeadingMobile>{` Add ${communityFound.name}?`}</ProposingHeadingMobile>
<VotePropose
availableAmount={availableAmount}
setProposingAmount={setProposingAmount}
proposingAmount={proposingAmount}
disabled={!communityFound}

1
packages/DApp/src/componentsMobile/RemoveMobile.tsx
View File

@ -31,7 +31,6 @@ export function RemoveMobile() {
<RemoveAmountPicker
community={community}
availableAmount={60000000}
setShowConfirmModal={(val: boolean) => {
val
}}

18
packages/DApp/src/hooks/useAvailableAmount.ts Normal file
View File

@ -0,0 +1,18 @@
import { useEthers, useTokenBalance } from '@usedapp/core'
import { useConfig } from '../providers/config'
import { BigNumber } from 'ethers'
import { useEffect, useState } from 'react'
export function useAvailableAmount() {
const { config } = useConfig()
const { account, chainId } = useEthers()
const tokenBalance = useTokenBalance(config.contracts[chainId ?? 3].tokenContract, account)
const [availableAmount, setAvailableAmount] = useState(0)
useEffect(() => {
setAvailableAmount(tokenBalance?.div(BigNumber.from('0xDE0B6B3A7640000')).toNumber() ?? 0)
}, [tokenBalance?.toString()])
return availableAmount
}

5
packages/DApp/src/hooks/useProposeWarning.tsx
View File

@ -1,9 +1,12 @@
import { useContractCall } from '@usedapp/core'
import { useEffect, useState } from 'react'
import { CommunityDetail } from '../models/community'
import { useAvailableAmount } from './useAvailableAmount'
import { useContracts } from './useContracts'
export function useProposeWarning(communityFound: CommunityDetail | undefined, availableAmount: number) {
export function useProposeWarning(communityFound: CommunityDetail | undefined) {
const availableAmount = useAvailableAmount()
const [warning, setWarning] = useState({ icon: '', text: '' })
const { directoryContract, votingContract } = useContracts()

20
packages/DApp/src/providers/config/config.ts
View File

@ -17,31 +17,35 @@ interface EnvConfigs {
const contracts = {
3: {
votingContract: '0xb3bb261Ac080059A46879d3B3f8B5779b9AF26dF',
directoryContract: '0xfEB894511bC1B92EFA4f7fa050fC0BF7697Df6a2',
votingContract: '0xF6fb0EBfa21958440e2AA8ee603DFDc885C4F694',
directoryContract: '0x56dF4644483Dbb5607d0eB162Aa64536bD5c2C24',
tokenContract: '0x80ee48b5ba5c3EA556b7fF6D850d2fB2c4bc7412',
},
1337: {
votingContract: process.env.GANACHE_VOTING_CONTRACT ?? '0x0000000000000000000000000000000000000000',
directoryContract: process.env.GANACHE_DIRECTORY_CONTRACT ?? '0x0000000000000000000000000000000000000000',
tokenContract: process.env.GANACHE_TOKEN_CONTRACT ?? '0x0000000000000000000000000000000000000000',
},
}
const version = '0.0.6'
export const config: EnvConfigs = {
localhost: {
wakuTopic: `/myApp/localhost/${uuidv4()}/0.0.5/votingRoom/`,
wakuFeatureTopic: `/myApp/localhost/${uuidv4()}/0.0.5/feature/`,
wakuTopic: `/myApp/localhost/${uuidv4()}/${version}/votingRoom/`,
wakuFeatureTopic: `/myApp/localhost/${uuidv4()}/${version}/feature/`,
numberPerPage: 2,
contracts,
},
development: {
wakuTopic: '/myApp/development/0.0.5/votingRoom/',
wakuFeatureTopic: `/myApp/development/0.0.5/feature/`,
wakuTopic: `/myApp/development/${version}/votingRoom/`,
wakuFeatureTopic: `/myApp/development/${version}/feature/`,
numberPerPage: 3,
contracts,
},
production: {
wakuTopic: '/myApp/production/0.0.5/votingRoom/',
wakuFeatureTopic: `/myApp/production/0.0.5/feature/`,
wakuTopic: `/myApp/production/${version}/votingRoom/`,
wakuFeatureTopic: `/myApp/production/${version}/feature/`,
numberPerPage: 4,
contracts,
},

1
packages/DApp/webpack.config.js
View File

@ -70,6 +70,7 @@ module.exports = (env) => {
'process.env.GANACHE_VOTING_CONTRACT': JSON.stringify(process.env.GANACHE_VOTING_CONTRACT),
'process.env.GANACHE_DIRECTORY_CONTRACT': JSON.stringify(process.env.GANACHE_DIRECTORY_CONTRACT),
'process.env.GANACHE_MULTICALL_CONTRACT': JSON.stringify(process.env.GANACHE_MULTICALL_CONTRACT),
'process.env.GANACHE_TOKEN_CONTRACT': JSON.stringify(process.env.GANACHE_TOKEN_CONTRACT),
}),
new webpack.ProvidePlugin({
process: 'process/browser.js',