Skip to content

Commit

Permalink
Add csm claim and csm assets (#163)
Browse files Browse the repository at this point in the history
* Add csm claim and csm assets (#160)

* Add maxwell csm claims

* Add csm claim and csm assets

* Fix list shown (#161)

* Fix (#162)
  • Loading branch information
yashirooooo authored May 27, 2021
1 parent 46e7808 commit 2391125
Show file tree
Hide file tree
Showing 28 changed files with 2,298 additions and 35 deletions.
2 changes: 1 addition & 1 deletion packages/apps-config/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
"dependencies": {
"@acala-network/type-definitions": "^0.7.1",
"@babel/runtime": "^7.13.10",
"@crustio/type-definitions": "0.0.8",
"@crustio/type-definitions": "0.0.10",
"@darwinia/types": "^1.1.0-alpha.1",
"@edgeware/node-types": "^3.3.2",
"@interlay/polkabtc-types": "^0.5.3",
Expand Down
9 changes: 8 additions & 1 deletion packages/apps/public/locales/zh/translation.json
Original file line number Diff line number Diff line change
Expand Up @@ -1481,5 +1481,12 @@
"Setup Guarantor {{step}}/{{NUM_STEPS}}": "设置担保人 {{step}}/{{NUM_STEPS}}",
"min guaranteed": "最小担保",
"ethereumAddress": "以太坊地址",
"Over stake limit": "超过质押上限"
"Over stake limit": "超过质押上限",
"free": "余额",
"miscFrozen": "锁定金额",
"Claim CSM": "认领CSM",
"Send CRU": "发送CRU",
"Send CSM": "发送CSM",
"Send Candy": "发送糖果",
"Candy": "糖果"
}
71 changes: 54 additions & 17 deletions packages/page-accounts/src/Accounts/Account.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,9 @@ import React, { useCallback, useContext, useEffect, useMemo, useState } from 're
import styled, { ThemeContext } from 'styled-components';

import { ApiPromise } from '@polkadot/api';
import { AddressInfo, AddressMini, AddressSmall, Badge, Button, ChainLock, CryptoType, Forget, Icon, IdentityIcon, LinkExternal, Menu, Popup, StatusContext, Tags } from '@polkadot/react-components';
import { AddressInfo, AddressSmall, Badge, Button, ChainLock, CryptoType, Forget, Icon, IdentityIcon, LinkExternal, Menu, Popup, StatusContext } from '@polkadot/react-components';
import { useAccountInfo, useApi, useBestNumber, useCall, useLedger, useToggle } from '@polkadot/react-hooks';
import { FormatCandy } from '@polkadot/react-query';
import { FormatCandy, FormatCsmBalance } from '@polkadot/react-query';
import { keyring } from '@polkadot/ui-keyring';
import { BN_ZERO, formatBalance, formatNumber, isFunction } from '@polkadot/util';

Expand All @@ -34,6 +34,7 @@ import RecoverAccount from '../modals/RecoverAccount';
import RecoverSetup from '../modals/RecoverSetup';
import Transfer from '../modals/Transfer';
import TransferCandy from '../modals/TransferCandy';
import TransferCsm from '../modals/TransferCsm';
import UndelegateModal from '../modals/Undelegate';
import { useTranslation } from '../translate';
import { createMenuGroup } from '../util';
Expand Down Expand Up @@ -120,6 +121,20 @@ function Account ({ account: { address, meta }, className = '', delegation, filt
const [isUndelegateOpen, toggleUndelegate] = useToggle();
const candyAmount = useCall<Balance>(api.api.query.candy?.balances, [address]);
const [isTransferCandyOpen, toggleTransferCandy] = useToggle();
const [isTransferCsmOpen, toggleTransferCsm] = useToggle();
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
const csmInfo = useCall<any>(api.api.query.csm.account, [address]);
const [csmBalace, setCsmBalance] = useState<BN>(BN_ZERO);

useEffect(() => {
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
const tmp = csmInfo && JSON.parse(JSON.stringify(csmInfo));

if (tmp) {
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
setCsmBalance(new BN(Number(tmp.free).toString()));
}
}, [csmInfo]);

useEffect((): void => {
if (balancesAll) {
Expand Down Expand Up @@ -245,6 +260,24 @@ function Account ({ account: { address, meta }, className = '', delegation, filt
>
{t('Unlock vested amount')}
</Menu.Item>
),
isFunction(api.api.tx.csm?.transfer) && (
<Menu.Item
icon='paper-plane'
label={t<string>('Send CSM')}
onClick={toggleTransferCsm}
>
{t('Send CSM')}
</Menu.Item>
),
isFunction(api.api.tx.candy?.transfer) && (
<Menu.Item
icon='paper-plane'
label={t<string>('Send Candy')}
onClick={toggleTransferCandy}
>
{t('Send Candy')}
</Menu.Item>
)
]),
createMenuGroup('deriveGroup', [
Expand Down Expand Up @@ -358,7 +391,7 @@ function Account ({ account: { address, meta }, className = '', delegation, filt
/>
])
].filter((i) => i),
[_clearDemocracyLocks, _showOnHardware, _vestingVest, api, delegation, democracyUnlockTx, genesisHash, identity, isDevelopment, isEditable, isExternal, isHardware, isInjected, isMultisig, multiInfos, onSetGenesisHash, proxy, recoveryInfo, t, toggleBackup, toggleDelegate, toggleDerive, toggleForget, toggleIdentityMain, toggleIdentitySub, toggleMultisig, togglePassword, toggleProxyOverview, toggleRecoverAccount, toggleRecoverSetup, toggleUndelegate, vestingVestTx]);
[_clearDemocracyLocks, _showOnHardware, _vestingVest, api, delegation, democracyUnlockTx, genesisHash, identity, isDevelopment, isEditable, isExternal, isHardware, isInjected, isMultisig, multiInfos, onSetGenesisHash, proxy, recoveryInfo, t, toggleBackup, toggleDelegate, toggleDerive, toggleForget, toggleIdentityMain, toggleIdentitySub, toggleMultisig, togglePassword, toggleProxyOverview, toggleRecoverAccount, toggleRecoverSetup, toggleUndelegate, toggleTransferCandy, toggleTransferCsm, vestingVestTx]);

if (!isVisible) {
return null;
Expand Down Expand Up @@ -537,6 +570,13 @@ function Account ({ account: { address, meta }, className = '', delegation, filt
senderId={address}
/>
)}
{isTransferCsmOpen && (
<TransferCsm
key='modal-transfer'
onClose={toggleTransferCsm}
senderId={address}
/>
)}
{isProxyOverviewOpen && (
<ProxyOverview
key='modal-proxy-overview'
Expand Down Expand Up @@ -577,20 +617,20 @@ function Account ({ account: { address, meta }, className = '', delegation, filt
/>
)}
</td>
<td className='address media--1400'>
{/* <td className='address media--1400'>
{(meta.parentAddress as string) && (
<AddressMini value={meta.parentAddress} />
)}
</td>
<td className='number'>
</td> */}
<td className='address media--1400'>
<CryptoType accountId={address} />
</td>
<td className='all'>
{/* <td className='all'>
<div className='tags'>
<Tags value={tags} />
</div>
</td>
<td className='number media--1500'>
</td> */}
<td className='all'>
{balancesAll?.accountNonce.gt(BN_ZERO) && formatNumber(balancesAll.accountNonce)}
</td>
<td className='number'>
Expand All @@ -601,6 +641,9 @@ function Account ({ account: { address, meta }, className = '', delegation, filt
withExtended={false}
/>
</td>
<td className='number'>
<FormatCsmBalance value={csmBalace} />
</td>
<td className='number'>
<FormatCandy value={candyAmount} />
</td>
Expand All @@ -611,17 +654,11 @@ function Account ({ account: { address, meta }, className = '', delegation, filt
{isFunction(api.api.tx.balances?.transfer) && (
<Button
icon='paper-plane'
label={t<string>('send')}
label={t<string>('Send CRU')}
onClick={toggleTransfer}
/>
)}
{isFunction(api.api.tx.candy?.transfer) && (
<Button
icon='paper-plane'
label={t<string>('send candy')}
onClick={toggleTransferCandy}
/>
)}

<Popup
className={`theme--${theme}`}
isOpen={isSettingsOpen}
Expand Down
18 changes: 10 additions & 8 deletions packages/page-accounts/src/Accounts/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -73,12 +73,13 @@ function Overview ({ className = '', onStatusChange }: Props): React.ReactElemen

const headerRef = useRef([
[t('accounts'), 'start', 3],
[t('parent'), 'address media--1400'],
[t('type')],
[t('tags'), 'start'],
[t('transactions'), 'media--1500'],
[t('balances'), 'expand'],
[t('candies')],
// [t('parent'), 'address media--1400'],
[t('type'), 'address media--1400'],
// [t('tags'), 'start'],
[t('transactions'), 'start'],
[t('CRU'), 'expand'],
[t('CSM'), 'expand'],
[t('Candy')],
[t('CRU18')],
[],
[undefined, 'media--1400']
Expand Down Expand Up @@ -130,15 +131,16 @@ function Overview ({ className = '', onStatusChange }: Props): React.ReactElemen
const footer = useMemo(() => (
<tr>
<td colSpan={3} />
<td className='media--1400' />
{/* <td className='media--1400' /> */}
<td colSpan={2} />
<td className='media--1500' />
{/* <td className='media--1500' /> */}
<td className='number'>
{balanceTotal && <FormatBalance value={balanceTotal} />}
</td>
<td />
<td />
<td />
<td />
<td className='media--1400' />
</tr>
), [balanceTotal]);
Expand Down
2 changes: 1 addition & 1 deletion packages/page-accounts/src/modals/Transfer.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ function Transfer ({ className = '', onClose, recipientId: propRecipientId, send
return (
<Modal
className='app--accounts-Modal'
header={t<string>('Send funds')}
header={t<string>('Send CRU')}
size='large'
>
<Modal.Content>
Expand Down
2 changes: 1 addition & 1 deletion packages/page-accounts/src/modals/TransferCandy.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ function TransferCandy ({ className = '', onClose, recipientId: propRecipientId,
return (
<Modal
className='app--accounts-Modal'
header={t<string>('Send candies')}
header={t<string>('Send Candy')}
size='large'
>
<Modal.Content>
Expand Down
109 changes: 109 additions & 0 deletions packages/page-accounts/src/modals/TransferCsm.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,109 @@
// Copyright 2017-2021 @polkadot/app-accounts authors & contributors
// SPDX-License-Identifier: Apache-2.0

import BN from 'bn.js';
import React, { useState } from 'react';
import styled from 'styled-components';

import { InputAddress, InputCsmBalance, Modal, TxButton } from '@polkadot/react-components';
import { useApi } from '@polkadot/react-hooks';
import { BN_ZERO } from '@polkadot/util';

import { useTranslation } from '../translate';

interface Props {
className?: string;
onClose: () => void;
recipientId?: string;
senderId?: string;
}

function TransferCsm ({ className = '', onClose, recipientId: propRecipientId, senderId }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
const { api } = useApi();
const [amount, setAmount] = useState<BN | undefined>(BN_ZERO);
const [hasAvailable] = useState(true);
const [maxBalance] = useState(BN_ZERO);
const [recipientId, setRecipientId] = useState<string | null>(propRecipientId || null);

return (
<Modal
className='app--accounts-Modal'
header={t<string>('Send CSM')}
size='large'
>
<Modal.Content>
<div className={className}>
<Modal.Content>
<Modal.Columns hint={t<string>('The transferred balance will be subtracted (along with fees) from the sender account.')}>
<InputAddress
defaultValue={senderId}
help={t<string>('The account you will send funds from.')}
isDisabled={!!senderId}
label={t<string>('send from account')}
type='account'
/>
</Modal.Columns>
</Modal.Content>
<Modal.Content>
<Modal.Columns hint={t<string>('The beneficiary will have access to the transferred fees when the transaction is included in a block.')}>
<InputAddress
defaultValue={propRecipientId}
help={t<string>('Select a contact or paste the address you want to send funds to.')}
isDisabled={!!propRecipientId}
label={t<string>('send to address')}
onChange={setRecipientId}
type='allPlus'
/>
</Modal.Columns>
</Modal.Content>
<Modal.Content>
<Modal.Columns>
<InputCsmBalance
autoFocus
help={t<string>('Type the amount you want to transfer. Note that you can select the unit on the right e.g sending 1 milli is equivalent to sending 0.001.')}
isError={!hasAvailable}
isZeroable
label={t<string>('amount')}
maxValue={maxBalance}
onChange={setAmount}
withMax
/>
</Modal.Columns>
</Modal.Content>
</div>
</Modal.Content>
<Modal.Actions onCancel={onClose}>
<TxButton
accountId={senderId}
icon='paper-plane'
isDisabled={!hasAvailable || !recipientId || !amount}
label={t<string>('Make Transfer')}
onStart={onClose}
params={[recipientId, amount]}
tx={api.tx.csm.transfer}
/>
</Modal.Actions>
</Modal>
);
}

export default React.memo(styled(TransferCsm)`
.balance {
margin-bottom: 0.5rem;
text-align: right;
padding-right: 1rem;
.label {
opacity: 0.7;
}
}
label.with-help {
flex-basis: 10rem;
}
.aliveToggle {
text-align: right;
}
`);
3 changes: 3 additions & 0 deletions packages/page-claims/src/claims/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -277,6 +277,9 @@ function Claims (): React.ReactElement<Props> {
<Columar>
<Columar.Column>
<Card withBottomMargin>
{/* <h3>{t<string>(`0. Please confirm that you are using your wallet to transfer funds instead of using the exchange transfer`)}</h3>
<img src={'https://wiki.crust.network/docs/assets/claims/new_claim_addr.png'} /> */}

<h3>{t<string>(`1. Select your {{chain}} account and enter`, {
replace: {
chain: systemChain
Expand Down
7 changes: 7 additions & 0 deletions packages/page-claims/src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ import { Route, Switch } from 'react-router-dom';
export { default as useCounter } from './useCounter';
import Claims from './claims';
import ClaimsMainnet from './claimsMainnet';
import CSMClaims from './maxwellCsmClaims';

function ClaimsApp ({ basePath, onStatusChange }: Props): React.ReactElement<Props> {
const { t } = useTranslation();
Expand All @@ -26,6 +27,9 @@ function ClaimsApp ({ basePath, onStatusChange }: Props): React.ReactElement<Pro
}, {
name: 'claimsMainnet',
text: t<string>('Claim CRU18')
}, {
name: 'maxwellCsmClaims',
text: t<string>('Claim CSM')
}]);

return (
Expand All @@ -40,6 +44,9 @@ function ClaimsApp ({ basePath, onStatusChange }: Props): React.ReactElement<Pro
<Route path={`${basePath}/claimsMainnet`}>
<ClaimsMainnet />
</Route>
<Route path={`${basePath}/maxwellCsmClaims`}>
<CSMClaims />
</Route>
<Route basePath={basePath}
onStatusChange={onStatusChange}>
<Claims />
Expand Down
Loading

0 comments on commit 2391125

Please sign in to comment.