Skip to content

Commit

Permalink
Merge branch 'development' into feat/waitlist-mail
Browse files Browse the repository at this point in the history
  • Loading branch information
@pietro-maximoff
pietro-maximoff authored Jan 28, 2021
2 parents fe13022 + 89ab30c commit e5dfa80
Show file tree
Hide file tree
Showing 14 changed files with 116 additions and 220 deletions.
67 changes: 2 additions & 65 deletions src/app/components/SaleBanner/index.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,55 +1,18 @@
import React, { useState } from 'react';
import { Link } from 'react-router-dom';
import Countdown from 'react-countdown';
import { Button } from '@blueprintjs/core';
import { Icon } from '@blueprintjs/core/lib/esm/components/icon/icon';
import moment from 'moment';

import './SaleBanner.scss';
import samurai from './assets/banner-samurai.svg';
import { useSaleEndTime } from '../../containers/SalesPage/hooks/useSaleEndTime';

const startDate: Date = moment('2021-01-25 14:00+00000', 'YYYY-MM-DD HH:mmZZ')
.utc()
.toDate();

export function SaleBanner() {
const [show, setShow] = useState(true);
const { date: endDate, now, loading } = useSaleEndTime();

const closeBanner = () => {
setShow(false);
};

const countDown = ({ days, hours, minutes, seconds, completed }) => {
if (completed) {
return <></>;
} else {
return (
<div className="timer-container">
<div className="date-container">
<div>
<p className="text-white p-remove-padding">Days</p>
<h3 className="text-white">{days}</h3>
</div>
<div>
<p className="text-white p-remove-padding">Hours</p>
<h3 className="text-white">{hours}</h3>
</div>
<div>
<p className="text-white p-remove-padding">Mins</p>
<h3 className="text-white">{minutes}</h3>
</div>
<div>
<p className="text-white p-remove-padding">Secs</p>
<h3 className="text-white">{seconds}</h3>
</div>
</div>
</div>
);
}
};

if (!show) {
return null;
}
Expand All @@ -59,26 +22,10 @@ export function SaleBanner() {
<div className="banner py-3">
<div className="info-container">
<h2 className="text-uppercase title-container black-font">
{loading ? (
<>SOV* Genesis Pre-Order</>
) : (
<>
{endDate > now ? (
<>
{endDate >= now && <>Pre-Order has begun!</>}
{endDate < now && <>Pre-Order ended!</>}
</>
) : (
<>
{startDate > now && <>Count Down has begun</>}
{startDate < now && <>SOV* Genesis Pre-Order</>}
</>
)}
</>
)}
<>SOV* Genesis Pre-Order is Over!</>
</h2>
<div className="sub-info-container">
<p className="sub-info-text black-font">SOV Token Pre-Order</p>
<p className="sub-info-text black-font">Sold out!</p>
</div>
<div className="button-container">
<Link
Expand All @@ -88,16 +35,6 @@ export function SaleBanner() {
<span className="button-text text-nowrap">Learn More</span>
</Link>
</div>
{!loading && (
<>
{endDate > now && (
<Countdown renderer={countDown} date={endDate} />
)}
{startDate && startDate > now && (
<Countdown renderer={countDown} date={startDate} />
)}
</>
)}
</div>
<div className="picture-container">
<img className="banner-samurai" src={samurai} alt="banner-samurai" />
Expand Down
59 changes: 37 additions & 22 deletions src/app/components/UserAssets/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,11 @@ import { useCachedAssetPrice } from '../../hooks/trading/useCachedAssetPrice';
import { Asset } from '../../../types/asset';
import { usePriceFeeds_tradingPairRates } from '../../hooks/price-feeds/usePriceFeeds_tradingPairRates';
import { Skeleton } from '../PageSkeleton';
import { numberToUSD } from '../../../utils/display-text/format';
import {
numberToUSD,
weiToNumberFormat,
} from '../../../utils/display-text/format';

// import { actions } from 'app/containers/FastBtcForm/slice';

export function UserAssets() {
Expand Down Expand Up @@ -116,7 +120,7 @@ function AssetRow({ item }: AssetProps) {
</td>
<td className="text-right">
<LoadableValue
value={weiToFixed(tokens.value, 4)}
value={weiToNumberFormat(tokens.value, 4)}
loading={tokens.loading}
/>
</td>
Expand All @@ -136,26 +140,37 @@ function AssetRow({ item }: AssetProps) {
{/* onClick={() => dispatch(actions.showDialog(true))}*/}
{/* />*/}
{/*)}*/}
<Button
minimal
text={t(translations.userAssets.actions.trade)}
className="text-gold button-round"
onClick={() =>
history.push('/', {
params: { asset: item.asset, action: 'trade' },
})
}
/>
<Button
minimal
text={t(translations.userAssets.actions.swap)}
className="text-gold button-round"
onClick={() =>
history.push('/', {
params: { asset: item.asset, action: 'swap' },
})
}
/>
{item.asset !== Asset.CSOV ? (
<>
<Button
minimal
text={t(translations.userAssets.actions.trade)}
className="text-gold button-round"
onClick={() =>
history.push('/', {
params: { asset: item.asset, action: 'trade' },
})
}
/>
<Button
minimal
text={t(translations.userAssets.actions.swap)}
className="text-gold button-round"
onClick={() =>
history.push('/', {
params: { asset: item.asset, action: 'swap' },
})
}
/>
</>
) : (
<Button
minimal
text={t(translations.userAssets.actions.claimSov)}
disabled
className="text-gold button-round"
/>
)}
</ButtonGroup>
</td>
</tr>
Expand Down
16 changes: 16 additions & 0 deletions src/app/containers/MarginTradeForm/TradeConfirmationDialog.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import React from 'react';
import { Dialog } from '../Dialog';
import { TradeButton } from '../../components/TradeButton';

interface Props {
isOpen: boolean;
onClose: (success: boolean) => void;
}

export function TradeConfirmationDialog(props: Props) {
return (
<Dialog isOpen={props.isOpen} onClose={() => props.onClose(false)}>
<TradeButton text="Place Trade" onClick={() => props.onClose(true)} />
</Dialog>
);
}
63 changes: 5 additions & 58 deletions src/app/containers/SalesPage/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import React, { useEffect } from 'react';
import 'styles/sass/_genesis-sale.scss';
import { Helmet } from 'react-helmet-async';
import { useTranslation } from 'react-i18next';
import { useSelector, useDispatch } from 'react-redux';
import { useDispatch } from 'react-redux';
import { translations } from '../../../locales/i18n';
import { Header } from '../../components/Header';
import { useAccount, useIsConnected } from '../../hooks/useAccount';
Expand All @@ -19,26 +19,15 @@ import { useCacheCallWithValue } from '../../hooks/useCacheCallWithValue';

import { AboutSOV, SOVModel, SOVGovernance } from './Information';

import Screen1 from './screen1';
import Screen2 from './screen2';
import Screen3 from './screen3';
import Screen4 from './screen4';
import Screen5 from './screen5';
import Screen6 from './screen6';

import { useInjectReducer, useInjectSaga } from 'utils/redux-injectors';
import {
actions,
sliceKey as salesSlice,
reducer as salesReducer,
} from './slice';
import { selectSalesPage } from './selectors';
import { SaleInfoBar } from './SaleInfoBar';
import { salesPageSaga } from './saga';
import { AddSoToNifty } from './AddSoToNifty';
import { AddSoToMetamask } from './AddToMetamask';
import { Icon } from '@blueprintjs/core/lib/esm/components/icon/icon';
import { currentNetwork } from '../../../utils/classifiers';
import { StyledButton } from '../../components/SalesButton';
import GetAccess from './GetAccess';

Expand Down Expand Up @@ -81,8 +70,6 @@ export function SalesPage() {
'0',
);

const state = useSelector(selectSalesPage);

useEffect(() => {
dispatch(actions.updateMaxDeposit(maxPurchase));
}, [maxPurchase, dispatch]);
Expand Down Expand Up @@ -125,50 +112,10 @@ export function SalesPage() {
className="container font-family-montserrat"
style={{ maxWidth: '1730px', letterSpacing: 'normal' }}
>
{Number(state.maxDeposit) === 0 ? (
<>
<PageHeader content={<>SOV PUBLIC PRE-SALE WHITELIST</>} />
<GetAccess />
</>
) : (
<>
<PageHeader content={<>SOV GENESIS PRE-ORDER</>} />
<SaleInfoBar />

{currentNetwork === 'testnet' && (
<div
className="container mt-5 mb-4"
style={{ maxWidth: '1260px' }}
>
<div className="bg-info sovryn-border rounded p-3 d-flex flex-row justify-content-start align-items-center">
<div className="ml-3 mr-4">
<Icon icon="warning-sign" iconSize={26} />
</div>
<div>
This is testnet, not the actual sale. Do not send real
funds!
</div>
</div>
</div>
)}
{!isConnected ? (
<Screen1 />
) : (
<>
{Number(state.maxDeposit) !== 0 && (
<>
{state.step === 1 && <Screen1 />}
{state.step === 2 && <Screen2 />}
{state.step === 3 && <Screen3 />}
{state.step === 4 && <Screen4 />}
{state.step === 5 && <Screen5 />}
{state.step === 6 && <Screen6 />}
</>
)}
</>
)}
</>
)}
<>
<PageHeader content={<>SOV PUBLIC PRE-SALE WHITELIST</>} />
<GetAccess />
</>
<AboutSOV />
<SOVModel />
<SOVGovernance />
Expand Down
9 changes: 2 additions & 7 deletions src/app/containers/SalesPage/screen2/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@ import LogoDark from 'assets/images/sovryn-logo-dark.svg';
import sov_1 from 'assets/images/wallet/sov_1.jpg';
import sov_2 from 'assets/images/wallet/sov_2.jpg';
import sov_3 from 'assets/images/wallet/sov_3.jpg';
import { useSaleIsOpen } from '../hooks/useSaleIsOpen';

const StyledContent = styled.div`
background: var(--sales-background);
Expand Down Expand Up @@ -110,8 +109,6 @@ export default function Screen2() {
}
}, [maxDepositFormatted, setTierLabel, setTierImage]);

const isSaleOpen = useSaleIsOpen();

return (
<StyledContent>
{!showInfo ? (
Expand All @@ -122,9 +119,7 @@ export default function Screen2() {
<div className="row">
<div className="col-lg-7 col-md-12">
<div className="b-group left-box">
{isSaleOpen.ended && (
<p className="text-center w-100">Sale already ended.</p>
)}
<p className="text-center w-100">SOLD OUT!</p>

<div className="mb-5">
<p>
Expand All @@ -141,7 +136,7 @@ export default function Screen2() {
</div>
<SalesButton
text={'Continue to sale'}
disabled={!isSaleOpen.open}
disabled={true}
onClick={() => setShowInfo(!showInfo)}
/>
<SalesButton
Expand Down
20 changes: 7 additions & 13 deletions src/app/containers/SendBTC/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -284,19 +284,12 @@ const BTCAddClipboard = styled.span`
`;

export default function SendBTC({ setShowCalc }) {
const {
btcAddress,
btcAddressLoading,
btcDeposit,
transferDeposit,
} = useSelector(selectSalesPage);
const { btcAddress, btcDeposit, transferDeposit } = useSelector(
selectSalesPage,
);
const { minDeposit, maxDeposit } = useSaleLimits();
const dispatch = useDispatch();

const generateAddress = () => {
dispatch(sActions.getBtcAddress());
};

return btcDeposit === null && transferDeposit === null ? (
<div>
<div>
Expand Down Expand Up @@ -404,11 +397,12 @@ export default function SendBTC({ setShowCalc }) {
</>
) : (
<div className="mt-5">
<p className="mb-2 rbtc-text">SOLD OUT!</p>
<SalesButton
text="Generate deposit address"
onClick={generateAddress}
loading={btcAddressLoading}
disabled={btcAddressLoading}
onClick={() => {}}
loading={false}
disabled={true}
/>
</div>
)}
Expand Down
Loading

0 comments on commit e5dfa80

Please sign in to comment.