Remove wallet logic for Poll component
To keep it simple.
This commit is contained in:
parent
415be0a8cc
commit
7203020317
|
@ -1,53 +1,45 @@
|
|||
import React, { useState } from 'react'
|
||||
import { useConfig, useEthers } from '@usedapp/core'
|
||||
|
||||
import { useConfig } from '@usedapp/core'
|
||||
import { ChainId } from '@usedapp/core/src/constants'
|
||||
import styled from 'styled-components'
|
||||
import { PollList, PollCreation } from '@waku/poll-sdk-react-components'
|
||||
import { JsonRpcSigner } from '@ethersproject/providers'
|
||||
import { PollCreation, PollList } from '@waku/poll-sdk-react-components'
|
||||
import { JsonRpcSigner, Web3Provider } from '@ethersproject/providers'
|
||||
import { useWakuPolling } from '@waku/poll-sdk-react-hooks'
|
||||
import { Modal, Networks, CreateButton } from '@waku/vote-poll-sdk-react-components'
|
||||
import { CreateButton } from '@waku/vote-poll-sdk-react-components'
|
||||
import { Theme } from '@waku/vote-poll-sdk-react-components/dist/esm/src/style/themes'
|
||||
|
||||
type WakuPollingProps = {
|
||||
type PollProps = {
|
||||
appName: string
|
||||
library: Web3Provider | undefined
|
||||
signer: JsonRpcSigner | undefined
|
||||
chainId: ChainId | undefined
|
||||
account: string | null | undefined
|
||||
theme: Theme
|
||||
tokenAddress: string
|
||||
}
|
||||
|
||||
export function Poll({ appName, signer, theme, tokenAddress }: WakuPollingProps) {
|
||||
const { activateBrowserWallet, account, library, chainId } = useEthers()
|
||||
export function Poll({ appName, library, signer, chainId, account, theme, tokenAddress }: PollProps) {
|
||||
const config = useConfig()
|
||||
const [showPollCreation, setShowPollCreation] = useState(false)
|
||||
const [selectConnect, setSelectConnect] = useState(false)
|
||||
const wakuPolling = useWakuPolling(appName, tokenAddress, library, config?.multicallAddresses?.[chainId ?? 1337])
|
||||
|
||||
const disabled = !signer
|
||||
|
||||
return (
|
||||
<Wrapper>
|
||||
{showPollCreation && signer && (
|
||||
<PollCreation wakuPolling={wakuPolling} setShowPollCreation={setShowPollCreation} theme={theme} />
|
||||
)}
|
||||
{account ? (
|
||||
<CreateButton theme={theme} disabled={!signer} onClick={() => setShowPollCreation(true)}>
|
||||
{
|
||||
<CreateButton
|
||||
style={{ backgroundColor: disabled ? 'lightgrey' : theme.primaryColor }}
|
||||
theme={theme}
|
||||
disabled={disabled}
|
||||
onClick={() => setShowPollCreation(true)}
|
||||
>
|
||||
Create a poll
|
||||
</CreateButton>
|
||||
) : (
|
||||
<CreateButton
|
||||
theme={theme}
|
||||
onClick={() => {
|
||||
if ((window as any)?.ethereum) {
|
||||
activateBrowserWallet()
|
||||
} else setSelectConnect(true)
|
||||
}}
|
||||
>
|
||||
Connect to vote
|
||||
</CreateButton>
|
||||
)}
|
||||
{selectConnect && (
|
||||
<Modal heading="Connect" theme={theme} setShowModal={setSelectConnect}>
|
||||
<Networks />
|
||||
</Modal>
|
||||
)}
|
||||
|
||||
}
|
||||
<PollList wakuPolling={wakuPolling} account={account} theme={theme} />
|
||||
</Wrapper>
|
||||
)
|
||||
|
|
|
@ -1,16 +1,15 @@
|
|||
import React, { useEffect, useState } from 'react'
|
||||
import styled from 'styled-components'
|
||||
import { DAppProvider, ChainId, useEthers } from '@usedapp/core'
|
||||
import { ChainId, DAppProvider, useEthers } from '@usedapp/core'
|
||||
import { DEFAULT_CONFIG } from '@usedapp/core/dist/cjs/src/model/config/default'
|
||||
import { Poll } from './components/Poll'
|
||||
import { TopBar, GlobalStyle } from '@waku/vote-poll-sdk-react-components'
|
||||
import { GlobalStyle, TopBar } from '@waku/vote-poll-sdk-react-components'
|
||||
import pollingIcon from './assets/images/pollingIcon.png'
|
||||
import { JsonRpcSigner } from '@ethersproject/providers'
|
||||
import { orangeTheme } from '@waku/vote-poll-sdk-react-components/dist/esm/src/style/themes'
|
||||
import ReactDOM from 'react-dom'
|
||||
import { BrowserRouter } from 'react-router-dom'
|
||||
import { BrowserRouter, useLocation } from 'react-router-dom'
|
||||
import { Route, Switch } from 'react-router'
|
||||
import { useLocation } from 'react-router-dom'
|
||||
|
||||
const sntTokenAddress = '0x744d70FDBE2Ba4CF95131626614a1763DF805B9E'
|
||||
|
||||
|
@ -32,11 +31,16 @@ const config = {
|
|||
}
|
||||
|
||||
export function PollPage({ tokenAddress }: { tokenAddress: string }) {
|
||||
const { account, library, activateBrowserWallet, deactivate } = useEthers()
|
||||
const { account, library, activateBrowserWallet, deactivate, chainId } = useEthers()
|
||||
const [signer, setSigner] = useState<undefined | JsonRpcSigner>(undefined)
|
||||
|
||||
useEffect(() => {
|
||||
setSigner(library?.getSigner())
|
||||
if (account) {
|
||||
setSigner(library?.getSigner())
|
||||
} else {
|
||||
// Deactivate signer if signed out
|
||||
setSigner(undefined)
|
||||
}
|
||||
}, [account])
|
||||
|
||||
return (
|
||||
|
@ -50,7 +54,15 @@ export function PollPage({ tokenAddress }: { tokenAddress: string }) {
|
|||
account={account}
|
||||
deactivate={deactivate}
|
||||
/>
|
||||
<Poll theme={orangeTheme} appName={'testApp_'} signer={signer} tokenAddress={tokenAddress} />
|
||||
<Poll
|
||||
theme={orangeTheme}
|
||||
appName={'demo-poll-dapp'}
|
||||
library={library}
|
||||
signer={signer}
|
||||
chainId={chainId}
|
||||
account={account}
|
||||
tokenAddress={tokenAddress}
|
||||
/>
|
||||
</Wrapper>
|
||||
)
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue