project-serum
/
serum-dex-ui
mirror of https://github.com/project-serum/serum-dex-ui.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Mention new features in new markets on deprecated markets transition page

This commit is contained in:
Nishad 2020-09-22 15:02:53 +08:00
parent 3821147103
commit 14d9a1118e
2 changed files with 19 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/components/DeprecatedMarketsInstructions.js
View File

@ -1,6 +1,5 @@
import { Button, Divider, Spin } from 'antd';
import { Button, Divider, Spin, Typography } from 'antd';
import React from 'react';
import styled from 'styled-components';
import {
useGetOpenOrdersForDeprecatedMarkets,
useBalancesForDeprecatedMarkets,
@ -11,9 +10,7 @@ import CheckOutlined from '@ant-design/icons/lib/icons/CheckOutlined';
import BalancesTable from './UserInfoTable/BalancesTable';
import OpenOrderTable from './UserInfoTable/OpenOrderTable';
const Title = styled.div`
color: rgba(255, 255, 255, 1);
`;
const { Title } = Typography;
export default function DeprecatedMarketsInstructions({ switchToLiveMarkets }) {
const balances = useBalancesForDeprecatedMarkets();
@ -30,7 +27,18 @@ export default function DeprecatedMarketsInstructions({ switchToLiveMarkets }) {
const needToSettleFunds = filteredBalances && filteredBalances.length > 0;
return (
<FloatingElement>
<Title>Migrate off deprecated markets</Title>
<Title level={4} style={{ color: 'rgba(255, 255, 255, 1)' }}>
Migrate off deprecated markets
</Title>
<Typography>
Serum has rolled out upgraded markets! They're faster and support fee
discounts based on SRM holdings.
</Typography>
<br />
<Typography>
To migrate over to the new markets, please cancel your orders and settle
your funds on old markets.
</Typography>
{!balances ? (
<Spin size="large" />
) : (
@ -66,12 +74,13 @@ export default function DeprecatedMarketsInstructions({ switchToLiveMarkets }) {
}}
/>
)}
<Divider>Switch to upgraded markets</Divider>
<div style={{ display: 'flex', justifyContent: 'center' }}>
<Button
onClick={switchToLiveMarkets}
disabled={needToSettleFunds || needToCancelOrders}
>
Switch to live markets
Switch to new markets
</Button>
</div>
</>

8
src/pages/TradePage.jsx
View File

@ -110,15 +110,13 @@ export default function TradePage() {
<React.Fragment>
<Col>
<Typography>
You have unsettled funds on deprecated markets! Please go
through them to claim your funds.
You have unsettled funds on old markets! Please go through
them to claim your funds.
</Typography>
</Col>
<Col>
<Button onClick={() => setHandleDeprecated(!handleDeprecated)}>
{handleDeprecated
? 'View live markets'
: 'Handle deprecated markets'}
{handleDeprecated ? 'View new markets' : 'Handle old markets'}
</Button>
</Col>
</React.Fragment>