diff --git a/apps/web/src/views/Voting/CreateProposal/index.tsx b/apps/web/src/views/Voting/CreateProposal/index.tsx index b9399cea34449..ab65147fc4a53 100644 --- a/apps/web/src/views/Voting/CreateProposal/index.tsx +++ b/apps/web/src/views/Voting/CreateProposal/index.tsx @@ -12,6 +12,7 @@ import { Input, ReactMarkdown, ScanLink, + Spinner, Text, useModal, useToast, @@ -20,17 +21,20 @@ import truncateHash from '@pancakeswap/utils/truncateHash' import snapshot from '@snapshot-labs/snapshot.js' import ConnectWalletButton from 'components/ConnectWalletButton' import Container from 'components/Layout/Container' +import { useAtomValue } from 'jotai' import isEmpty from 'lodash/isEmpty' import times from 'lodash/times' import dynamic from 'next/dynamic' import Link from 'next/link' import { useRouter } from 'next/router' -import { ChangeEvent, FormEvent, useEffect, useMemo, useState } from 'react' +import { ChangeEvent, FormEvent, Suspense, useEffect, useMemo, useState } from 'react' import { useInitialBlock } from 'state/block/hooks' import { ProposalTypeName } from 'state/types' +import styled from 'styled-components' import { getBlockExploreLink } from 'utils' import { DatePicker, DatePickerPortal, TimePicker } from 'views/Voting/components/DatePicker' import { useAccount, useWalletClient } from 'wagmi' +import { spaceAtom } from '../atom/spaceAtom' import Layout from '../components/Layout' import VoteDetailsModal from '../components/VoteDetailsModal' import { ADMINS, PANCAKE_SPACE, VOTE_THRESHOLD } from '../config' @@ -47,19 +51,24 @@ const EasyMde = dynamic(() => import('components/EasyMde'), { }) const CreateProposal = () => { + const { t } = useTranslation() + const space = useAtomValue(spaceAtom) + + const { delay, period } = space?.voting || {} + const created = Math.floor(Date.now() / 1000) + const [state, setState] = useState(() => ({ name: '', body: '', choices: times(MINIMUM_CHOICES).map(makeChoice), - startDate: null, - startTime: null, - endDate: null, - endTime: null, + startDate: delay ? new Date(Date.now() + delay * 1000) : null, + startTime: delay ? new Date(Date.now() + delay * 1000) : null, + endDate: delay && period ? new Date(Date.now() + delay * 1000 + period * 1000) : null, + endTime: delay && period ? new Date(Date.now() + delay * 1000 + period * 1000) : null, snapshot: 0, })) const [isLoading, setIsLoading] = useState(false) const [fieldsState, setFieldsState] = useState<{ [key: string]: boolean }>({}) - const { t } = useTranslation() const { address: account } = useAccount() const initialBlock = useInitialBlock() const { push } = useRouter() @@ -94,13 +103,16 @@ const CreateProposal = () => { }, } + const start = delay ? created + delay : combineDateAndTime(startDate, startTime) || 0 + const end = period ? start + period : combineDateAndTime(endDate, endTime) || 0 const data: any = await client.proposal(web3 as any, account, { space: PANCAKE_SPACE, type: ProposalTypeName.SINGLE_CHOICE, // TODO title: name, body, - start: combineDateAndTime(startDate, startTime) || 0, - end: combineDateAndTime(endDate, endTime) || 0, + timestamp: created, + start, + end, choices: choices .filter((choice) => choice.value) .map((choice) => { @@ -170,6 +182,10 @@ const CreateProposal = () => { } }, [initialBlock, setState]) + if (!space) { + return {t('Network unstable. Please refresh to continue.')} + } + return ( @@ -230,6 +246,7 @@ const CreateProposal = () => { {t('Start Date')} { {t('Start Time')} { {t('End Date')} { {t('End Time')} { ) } -export default CreateProposal +const Wrapped = () => { + return ( + }> + + + ) +} + +const FullScreenBox = styled(Box)` + width: 100%; + height: 50vh; + display: flex; + align-items: center; + justify-content: center; +` + +export const SpinnerPage = () => { + return ( + + + + ) +} +export default Wrapped diff --git a/apps/web/src/views/Voting/atom/spaceAtom.ts b/apps/web/src/views/Voting/atom/spaceAtom.ts new file mode 100644 index 0000000000000..54fb98907b9a9 --- /dev/null +++ b/apps/web/src/views/Voting/atom/spaceAtom.ts @@ -0,0 +1,59 @@ +import { GraphQLClient, gql } from 'graphql-request' +import { atom } from 'jotai' +import { PANCAKE_SPACE } from '../config' + +interface Space { + id: string + name: string + about: string + network: string + symbol: string + members: number + voting: { + delay: number + period: number + } + strategies: any[] +} + +export const spaceAtom = atom(async () => { + const endpoint = 'https://hub.snapshot.org/graphql' + const client = new GraphQLClient(endpoint, { + headers: { + 'Content-Type': 'application/json', + }, + }) + + // 2. Define the Query + const GET_SPACE_DATA = gql` + query { + space(id: "${PANCAKE_SPACE}") { + id + name + about + network + symbol + members + voting { + delay + period + } + strategies { + name + params + } + validation { + name + params + } + } + } + ` + try { + const data = await client.request(GET_SPACE_DATA) + return data.space as Space + } catch (error) { + console.error(error) + return null + } +}) diff --git a/packages/localization/src/config/translations.json b/packages/localization/src/config/translations.json index 852434ca62cf2..9b2911e7cf7be 100644 --- a/packages/localization/src/config/translations.json +++ b/packages/localization/src/config/translations.json @@ -3672,5 +3672,6 @@ "No Existing Orders": "No Existing Orders", "Existing Orders": "Existing Orders", "Swap %token% to win a share of": "Swap %token% to win a share of", - "with daily prizes and leaderboard rewards!": "with daily prizes and leaderboard rewards!" + "with daily prizes and leaderboard rewards!": "with daily prizes and leaderboard rewards!", + "Network unstable. Please refresh to continue.": "Network unstable. Please refresh to continue." }