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

Refactor ProposeModal (#75)

This commit is contained in:
Szymon Szlachtowicz 2021-06-30 15:20:45 +02:00 committed by GitHub
parent 3c54b91300
commit 3c89ffbb12
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 25 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -48,7 +48,6 @@ export function ProposeModal({
}: ProposeModalProps) { }: ProposeModalProps) {
const [proposingAmount, setProposingAmount] = useState(0) const [proposingAmount, setProposingAmount] = useState(0)
const [publicKey, setPublicKey] = useState('') const [publicKey, setPublicKey] = useState('')
const disabled = proposingAmount === 0
const loading = useCommunityDetails(publicKey, setCommunityFound) const loading = useCommunityDetails(publicKey, setCommunityFound)
const { votingContract } = useContracts() const { votingContract } = useContracts()
const { send } = useContractFunction(votingContract, 'initializeVotingRoom') const { send } = useContractFunction(votingContract, 'initializeVotingRoom')
@ -56,62 +55,41 @@ export function ProposeModal({
return ( return (
<ColumnFlexDiv> <ColumnFlexDiv>
<PublicKeyInput publicKey={publicKey} setPublicKey={setPublicKey} /> <PublicKeyInput publicKey={publicKey} setPublicKey={setPublicKey} />
<ProposingData>
{publicKey && communityFound && ( {communityFound ? <CardCommunity community={communityFound} /> : loading && <CommunitySkeleton />}
<ProposingData> {communityFound && !communityFound.validForAddition && (
<CardCommunity community={communityFound} /> <WarningWrap>
{communityFound.validForAddition ? ( <Warning
<VoteProposeWrap> icon="🤏"
<VotePropose text={`${communityFound.name} currently only has ${communityFound.numberOfMembers} members. A community needs more than 42 members before a vote to be added to the Status community directory can be proposed.`}
availableAmount={availableAmount} />
setProposingAmount={setProposingAmount} </WarningWrap>
proposingAmount={proposingAmount} )}
disabled={disabled} {((communityFound && communityFound.validForAddition) || loading) && (
/>
</VoteProposeWrap>
) : (
<WarningWrap>
<Warning
icon="🤏"
text={`${communityFound.name} currently only has ${communityFound.numberOfMembers} members. A community needs more than 42 members before a vote to be added to the Status community directory can be proposed.`}
/>
</WarningWrap>
)}
</ProposingData>
)}
{!communityFound && !publicKey && (
<ProposingInfo>
<span>ℹ️</span>
<InfoText>To propose a community, it must have at least 42 members and have a ENS domain.</InfoText>
</ProposingInfo>
)}
{loading && publicKey && (
<ProposingData>
<CommunitySkeleton />
<VoteProposeWrap> <VoteProposeWrap>
<VotePropose <VotePropose
availableAmount={availableAmount} availableAmount={availableAmount}
setProposingAmount={setProposingAmount} setProposingAmount={setProposingAmount}
proposingAmount={proposingAmount} proposingAmount={proposingAmount}
disabled={disabled} disabled={!communityFound || !proposingAmount}
/> />
</VoteProposeWrap> </VoteProposeWrap>
</ProposingData> )}
)} {!publicKey && (
<ProposingInfo>
<span>ℹ️</span>
<InfoText>To propose a community, it must have at least 42 members and have a ENS domain.</InfoText>
</ProposingInfo>
)}
</ProposingData>
{communityFound && !communityFound.validForAddition ? ( {communityFound && !communityFound.validForAddition ? (
<ConfirmBtn <ConfirmBtn onClick={() => setShowConfirmModal(false)}>
onClick={() => {
setShowConfirmModal(false)
}}
>
OK, let’s move on! <span>🤙</span> OK, let’s move on! <span>🤙</span>
</ConfirmBtn> </ConfirmBtn>
) : ( ) : (
<ProposingBtn <ProposingBtn
disabled={!communityFound || disabled} disabled={!communityFound || !proposingAmount}
onClick={() => { onClick={() => {
send(1, publicKey) send(1, publicKey)
setShowConfirmModal(true) setShowConfirmModal(true)
@ -149,7 +127,6 @@ const ProposingInfo = styled.div`
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
width: 100%;
margin-bottom: 32px; margin-bottom: 32px;
& > span { & > span {

4
packages/DApp/src/hooks/useCommunityDetails.ts
View File

@ -16,7 +16,9 @@ export function useCommunityDetails(publicKey: string, setCommunityDetail: (val:
} }
} }
setCommunityDetail(undefined) setCommunityDetail(undefined)
getDetails(publicKey) if (publicKey) {
getDetails(publicKey)
}
}, [publicKey]) }, [publicKey])
useEffect(() => setCommunityDetail(undefined), []) useEffect(() => setCommunityDetail(undefined), [])