Skip to content

Commit

Permalink
Fix asset accounts (#2765)
Browse files Browse the repository at this point in the history
* fix: issue_208

* fix

* fix: issue_208

* fix: pr

* fix: pr

* feat: enums  SendType

* fix: listNoBalanceActionOptions
  • Loading branch information
devchenyan authored Jul 18, 2023
1 parent 85ec4bf commit 6d60b78
Show file tree
Hide file tree
Showing 15 changed files with 173 additions and 67 deletions.
7 changes: 3 additions & 4 deletions packages/neuron-ui/src/components/MultisigAddress/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -119,12 +119,11 @@ const MultisigAddress = () => {
)
const listNoBalanceActionOptions = useMemo(
() =>
tableActions.map(item => ({
listActionOptions.map(item => ({
...item,
label: t(`multisig-address.table.actions.${item.key}`),
disabled: item.key === 'send',
disabled: item.disabled || item.key === 'send',
})),
[t]
[listActionOptions]
)

const { keywords, onChange, onBlur } = useSearch(clearSelected, onFilterConfig)
Expand Down
12 changes: 10 additions & 2 deletions packages/neuron-ui/src/components/OfflineSignDialog/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import {
} from 'states'
import { OfflineSignJSON, signAndExportTransaction, OfflineSignType } from 'services/remote'
import { PasswordIncorrectException } from 'exceptions'
import styles from '../PasswordRequest/passwordRequest.module.scss'
import styles from './offlineSignDialog.module.scss'

interface SignDialogProps {
isBroadcast: boolean
Expand Down Expand Up @@ -199,7 +199,15 @@ const OfflineSignDialog = ({ isBroadcast, wallet, offlineSignJSON, onDismiss }:
}

return (
<Dialog show title={title} onCancel={onDismiss} onConfirm={onSubmit} disabled={disabled} isLoading={isSigning}>
<Dialog
show
title={title}
onCancel={onDismiss}
onConfirm={onSubmit}
disabled={disabled}
isLoading={isSigning}
contentClassName={styles.content}
>
<TextField
label={t('password-request.password')}
value={password}
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
@import '../../styles/mixin.scss';

.content {
width: 648px;
padding: 16px 16px 0;
}

.passwordInput {
margin-top: 16px;
}
30 changes: 22 additions & 8 deletions packages/neuron-ui/src/components/PricePanel/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,20 +3,21 @@ import React, { useCallback, useEffect, useMemo, useState } from 'react'
import { localNumberFormatter, shannonToCKBFormatter } from 'utils'
import RingProgressBar from 'widgets/RingProgressBar'
import TextField from 'widgets/TextField'
import { Transfer } from 'widgets/Icons/icon'
import { ReactComponent as Change } from 'widgets/Icons/Change.svg'
import DropdownWithCustomRender from 'widgets/DropdownWithCustomRender'
import useGetCountDownAndFeeRateStats from 'utils/hooks/useGetCountDownAndFeeRateStats'
import { useTranslation } from 'react-i18next'
import { appState, useState as useGlobalState } from 'states'

import { FeeRateValueArrayItemType, useGetBatchGeneratedTx } from 'components/Send/hooks'
import { batchGenerateExperimental } from 'components/SUDTSend/hooks'

import styles from './pricePanel.module.scss'

interface PricePanelProps {
field: string
price: string
onPriceChange: (value: string) => void
isExperimental?: boolean
}
enum PriceTypeEnum {
Custom = 'custom',
Expand All @@ -25,7 +26,12 @@ enum PriceTypeEnum {
const DEFAULT_PRICE_ARRAY = ['1000', '2000', '3000']
const DEFAULT_COUNT_DOWN = 30

const PricePanel: React.FunctionComponent<PricePanelProps> = ({ price, field, onPriceChange }: PricePanelProps) => {
const PricePanel: React.FunctionComponent<PricePanelProps> = ({
price,
field,
onPriceChange,
isExperimental,
}: PricePanelProps) => {
const [t] = useTranslation()
const [type, setType] = useState<PriceTypeEnum>(PriceTypeEnum.Standard)
const [feeRateValueArray, setFeeRateValueArray] = useState<FeeRateValueArrayItemType[]>([])
Expand All @@ -35,7 +41,9 @@ const PricePanel: React.FunctionComponent<PricePanelProps> = ({ price, field, on
const {
app: { send = appState.send },
wallet: { id: walletID = '' },
experimental,
} = useGlobalState()

const { countDown, suggestFeeRate } = useGetCountDownAndFeeRateStats({ seconds: DEFAULT_COUNT_DOWN })

const isStandard = type === PriceTypeEnum.Standard
Expand Down Expand Up @@ -108,10 +116,16 @@ const PricePanel: React.FunctionComponent<PricePanelProps> = ({ price, field, on
)

useEffect(() => {
useGetBatchGeneratedTx({ walletID, items: send.outputs, priceArray }).then(res => {
setFeeRateValueArray(res)
})
}, [send.outputs, priceArray])
if (isExperimental && experimental) {
batchGenerateExperimental(experimental, priceArray).then(res => {
setFeeRateValueArray(res)
})
} else {
useGetBatchGeneratedTx({ walletID, items: send.outputs, priceArray }).then(res => {
setFeeRateValueArray(res)
})
}
}, [send.outputs, priceArray, isExperimental, experimental, batchGenerateExperimental, setFeeRateValueArray])

useEffect(() => {
if (suggestFeeRate === 0) {
Expand Down Expand Up @@ -141,7 +155,7 @@ const PricePanel: React.FunctionComponent<PricePanelProps> = ({ price, field, on
onKeyDown={() => {}}
type="button"
>
<Transfer />
<Change />
</button>
</div>
{isStandard ? (
Expand Down
34 changes: 25 additions & 9 deletions packages/neuron-ui/src/components/SUDTSend/hooks.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,15 +4,8 @@ import { SUDTAccount } from 'components/SUDTAccountList'
import { DEFAULT_SUDT_FIELDS } from 'utils/const'
import { generateChequeTransaction, generateSUDTTransaction, getHoldSUDTCellCapacity } from 'services/remote'
import { AppActions, useDispatch } from 'states'

export enum SendType {
secp256Cheque = 'cheque',
secp256NewCell = 'secp256NewCell',
acpExistCell = 'acpExistCell',
acpNewCell = 'acpNewCell',
unknowNewCell = 'unknowNewCell',
sendCKB = 'sendCKB',
}
import { ControllerResponse } from 'services/remote/remoteApiWrapper'
import { SendType } from 'utils/enums'

export enum AddressLockType {
secp256 = 'secp256',
Expand Down Expand Up @@ -152,6 +145,29 @@ export function getGenerator(sendType?: SendType) {
return generateSUDTTransaction
}

export async function batchGenerateExperimental(experimental: State.Experimental, priceArray: string[]) {
if (experimental?.params) {
const { params } = experimental
const generator = getGenerator(params.sendType)
const requestArray = priceArray.map(itemPrice => generator({ ...params, feeRate: itemPrice }))
const allPromiseResult = await Promise.allSettled(requestArray)
const resList = allPromiseResult.map(
(batchItem: PromiseSettledResult<ControllerResponse<{ fee: string }>>, index: number) => ({
feeRateValue: priceArray[index],
feeValue:
batchItem.status === 'fulfilled' && isSuccessResponse(batchItem.value) && batchItem.value.result
? batchItem.value.result.fee
: '0',
})
)
return resList
}
return priceArray.map((_, index: number) => ({
feeRateValue: priceArray[index],
feeValue: '0',
}))
}

export function useOnSubmit({
isSubmittable,
accountType,
Expand Down
96 changes: 55 additions & 41 deletions packages/neuron-ui/src/components/SUDTSend/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -31,17 +31,10 @@ import {
validateAmountRange,
CONSTANTS,
} from 'utils'
import { SendType } from 'utils/enums'
import { AmountNotEnoughException, isErrorWithI18n } from 'exceptions'
import { getDisplayName, getDisplaySymbol } from 'components/UANDisplay'
import {
AddressLockType,
SendType,
getGenerator,
useAddressLockType,
useOnSubmit,
useOptions,
useSendType,
} from './hooks'
import { AddressLockType, getGenerator, useAddressLockType, useOnSubmit, useOptions, useSendType } from './hooks'
import styles from './sUDTSend.module.scss'

const { INIT_SEND_PRICE, DEFAULT_SUDT_FIELDS, HIDE_BALANCE } = CONSTANTS
Expand Down Expand Up @@ -162,9 +155,9 @@ const SUDTSend = () => {
{ label: t('s-udt.send.title'), link: RoutePath.SUDTSend },
]

const fields: { key: Fields.Address | Fields.Amount; label: string }[] = [
{ key: Fields.Address, label: t('s-udt.send.address') },
{ key: Fields.Amount, label: t('s-udt.send.amount') },
const fields: { key: Fields.Address | Fields.Amount; label: string; placeholder: string }[] = [
{ key: Fields.Address, label: t('s-udt.send.address'), placeholder: t('s-udt.send.address-placeholder') },
{ key: Fields.Amount, label: t('s-udt.send.amount'), placeholder: t('s-udt.send.amount-placeholder') },
]

const errors: { [Fields.Address]: string; [Fields.Amount]: string } = useMemo(() => {
Expand Down Expand Up @@ -247,7 +240,10 @@ const SUDTSend = () => {
generator(params)
.then(res => {
if (isSuccessResponse(res)) {
globalDispatch({ type: AppActions.UpdateExperimentalParams, payload: { tx: res.result } })
globalDispatch({
type: AppActions.UpdateExperimentalParams,
payload: { tx: res.result, params: { ...params, sendType } },
})
return
}
throw new Error(typeof res.message === 'string' ? res.message : res.message.content)
Expand Down Expand Up @@ -298,6 +294,16 @@ const SUDTSend = () => {
[dispatch, setRemoteError]
)

const handleCheckbox = useCallback(
(e: React.ChangeEvent<HTMLInputElement>) => {
if (options && options.length) {
const { checked } = e.target
onChangeSendType(checked ? options[0].key : undefined)
}
},
[onChangeSendType, options]
)

const onToggleSendingAll = useCallback(() => {
dispatch({ type: Fields.SendAll, payload: !sendState.sendAll })
}, [dispatch, sendState.sendAll])
Expand Down Expand Up @@ -361,7 +367,7 @@ const SUDTSend = () => {
<div className={styles.sendContainer}>
{fields.map(field => {
return (
<>
<div key={field.key}>
<TextField
label={field.key === Fields.Amount ? `${field.label} (${displaySymbol})` : field.label}
value={
Expand All @@ -370,7 +376,7 @@ const SUDTSend = () => {
key={field.label}
field={field.key}
onChange={onInput}
rows={field.key === Fields.Address ? 2 : 1}
rows={field.key === Fields.Address && sendState.address ? 2 : 1}
suffix={
field.key === Fields.Amount ? (
<Button
Expand All @@ -386,41 +392,48 @@ const SUDTSend = () => {
disabled={sendState.sendAll}
error={errors[field.key]}
className={styles[field.key]}
placeholder={field.placeholder}
/>

{field.key === Fields.Address && options?.length ? (
<>
<RadioGroup
defaultValue={sendType}
onChange={onChangeSendType}
itemClassName={styles.optionItem}
options={options.map(item => ({
value: item.key,
label: t(`s-udt.send.${item.label}`, item?.params),
suffix: item.tooltip ? (
<div className={styles.tipItem}>
<Tooltip
tip={
<p className={styles.tooltip}>{t(`s-udt.send.${item.tooltip}`, item?.params)}</p>
}
showTriangle
>
<AttentionOutline className={styles.attention} />
</Tooltip>
</div>
) : null,
tip:
item.key === SendType.secp256Cheque && !isMainnet ? (
<div className={styles.selectError}>{t('messages.light-client-cheque-warning')}</div>
{options.length > 1 ? (
<RadioGroup
onChange={onChangeSendType}
itemClassName={styles.optionItem}
options={options.map(item => ({
value: item.key,
label: t(`s-udt.send.${item.label}`, item?.params),
suffix: item.tooltip ? (
<div className={styles.tipItem}>
<Tooltip
tip={
<p className={styles.tooltip}>{t(`s-udt.send.${item.tooltip}`, item?.params)}</p>
}
showTriangle
>
<AttentionOutline className={styles.attention} />
</Tooltip>
</div>
) : null,
}))}
/>
tip:
item.key === SendType.secp256Cheque && !isMainnet ? (
<div className={styles.selectError}>{t('messages.light-client-cheque-warning')}</div>
) : null,
}))}
/>
) : (
<label htmlFor="sendType">
<input type="checkbox" id="sendType" onChange={handleCheckbox} checked={!!sendType} />
<span>{t(`s-udt.send.${options[0].label}`, options[0]?.params)}</span>
</label>
)}
{!isOptionCorrect ? (
<div className={styles.selectError}>{t('s-udt.send.select-option')}</div>
) : null}
</>
) : null}
</>
</div>
)
})}
</div>
Expand All @@ -434,10 +447,11 @@ const SUDTSend = () => {
field={Fields.Description}
onChange={onInput}
error={remoteError}
placeholder={t('s-udt.send.description-placeholder')}
/>
</div>
<div className={styles.fee}>
<TransactionFeePanel fee={fee} price={sendState.price} onPriceChange={onPriceChange} />
<TransactionFeePanel fee={fee} price={sendState.price} onPriceChange={onPriceChange} isExperimental />
</div>
</div>
<div className={styles.rightFooter}>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -72,6 +72,7 @@ $bottomHeight: 186px;
margin-top: 16px;
padding: 20px 16px 16px;
@include card;
@include checkbox;
.address {
font-family: 'JetBrains Mono';
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,7 @@

.sendItem {
& > div {
width: 228px;
input {
width: 125px !important;
height: 56px !important;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,19 +7,21 @@ interface TransactionFeeProps {
fee: string
price: string
onPriceChange: (value: string) => void
isExperimental?: boolean
}

const TransactionFeePanel: React.FunctionComponent<TransactionFeeProps> = ({
price,
fee,
onPriceChange,
isExperimental,
}: TransactionFeeProps) => {
const [t] = useTranslation()

return (
<div>
<TextField label={t('send.fee')} field="fee" value={`${fee} CKB`} readOnly disabled width="100%" />
<PricePanel field="price" price={price} onPriceChange={onPriceChange} />
<PricePanel field="price" price={price} onPriceChange={onPriceChange} isExperimental={isExperimental} />
</div>
)
}
Expand Down
3 changes: 3 additions & 0 deletions packages/neuron-ui/src/locales/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -950,8 +950,11 @@
"send": {
"title": "Send",
"address": "Send to",
"address-placeholder": "Please input address",
"amount": "Amount",
"amount-placeholder": "Please input amount",
"description": "Description",
"description-placeholder": "Please input description, optional",
"submit": "Submit",
"click-to-edit": "Click to edit",
"cheque-address-hint": {
Expand Down
Loading

2 comments on commit 6d60b78

@github-actions
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Packaging for test is done in 5584804421

@github-actions
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Packaging for test is done in 5584805628

Please sign in to comment.