Skip to content

Commit

Permalink
UIA withdrawal - memo postfix
Browse files Browse the repository at this point in the history
  • Loading branch information
@1aerostorm
1aerostorm committed Jun 9, 2024
1 parent 3a4fe9b commit e3d1292
Show file tree
Hide file tree
Showing 7 changed files with 185 additions and 40 deletions.
104 changes: 81 additions & 23 deletions app/components/modules/Transfer.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,7 @@ class TransferForm extends Component {
};

initForm(props) {
const { transferType, } = props.initialValues
const { transferType, withdrawal } = props.initialValues
const {toVesting, uia} = props
const isWithdraw = transferType && transferType === 'Savings Withdraw'
const isTIP = transferType && transferType.startsWith('TIP to')
Expand All @@ -129,6 +129,9 @@ class TransferForm extends Component {
const fields = toVesting ? ['to', 'amount'] : ['to', 'amount', 'asset']
if(!toVesting && transferType !== 'Transfer to Savings' && transferType !== 'Savings Withdraw' && transferType !== 'Claim')
fields.push('memo')
if (withdrawal) {
fields.push('memo_postfix')
}

reactForm({
name: 'transfer',
Expand All @@ -151,6 +154,7 @@ class TransferForm extends Component {
memo:
checkMemo(values.memo) ? tt('transfer_jsx.private_key_in_memo') :
this._memoWithdrawal(values.memo) || null,
memo_postfix: null
}}
})
}
Expand Down Expand Up @@ -270,22 +274,33 @@ class TransferForm extends Component {
if (!way) {
console.error('Withdrawal way not found', name, withdrawal);
}
let { memo, prefix, } = way;
let { memo, prefix, postfix, postfix_title, } = way;

clearOldMemos();
let memoPrefix = '';
let memoPostfix = '', memoPostfixTitle = ''
let memoInitial = memo;
if (prefix && typeof prefix === 'string') {
memoPrefix = prefix;
}
memo = loadMemo(this.props.sym, name, memoPrefix) || memoInitial;

const loaded = loadMemo(this.props.sym, name, memoPrefix, postfix_title)
memo = loaded.memo || ''
memoPostfix = (postfix && loaded.postfix) || postfix
memoPostfixTitle = postfix_title

this.state.memo.props.onChange(memo);
const { memo_postfix } = this.state
if (memo_postfix && loaded.postfix) {
memo_postfix.props.onChange(loaded.postfix)
}

this.setState({
withdrawalWay: name,
memoPrefix,
memoInitial,
});
memoPostfix: memoPostfix,
memoPostfixTitle: memoPostfixTitle,
})
};

toggleMemoEncryption = (autoCall = false) => {
Expand Down Expand Up @@ -322,7 +337,40 @@ class TransferForm extends Component {
return [leftColumn, rightColumn]
}

_renderMemo(memo, memoInitial, memoPrefix, disableMemo, isMemoPrivate, loading) {
_renderMemoPostfix = (memo_postfix, disableMemo, loading) => {
const columns = this._getColumnSizes()
const { memoPostfix, memoPostfixTitle } = this.state
let postfix
if (memoPostfix) {
postfix = <input type="text"
placeholder={memoPostfix}
{...memo_postfix.props}
ref="memo_postfix"
autoComplete="on" autoCorrect="off" autoCapitalize="off"
spellCheck="false" disabled={disableMemo || loading}
className={'input-group-field'}
/>
if (memoPostfixTitle) {
postfix = <div className="row">
<div className={'column ' + columns[0]} style={{ paddingTop: 8 }}>
{memoPostfixTitle}
</div>
<div className={'column ' + columns[1]}>
<div className='input-group'>{postfix}</div>
</div>
</div>
} else {
postfix = <div className="row">
<div className='column small-12'>
<div className='input-group'>{postfix}</div>
</div>
</div>
}
}
return postfix
}

_renderMemo(memo, memoInitial, memoPrefix, memo_postfix, disableMemo, isMemoPrivate, loading) {
const isObsoletePrivate = /^#/.test(memo.value);
let input = (<input type="text"
placeholder={memoInitial || tt('transfer_jsx.memo_placeholder')}
Expand Down Expand Up @@ -355,21 +403,25 @@ class TransferForm extends Component {
{input}{lock}
</div>);
}

const columns = this._getColumnSizes()
return (<div className="row">
<div className={'column ' + columns[0]} style={{paddingTop: 33}}>{tt('transfer_jsx.memo')}</div>
<div className={'column ' + columns[1]}>
<small>
{isObsoletePrivate ?
tt('transfer_jsx.public_obsolete') :
(isMemoPrivate ?
tt('transfer_jsx.memo_locked') :
tt('transfer_jsx.public'))}
</small>
{input}
<div className="error">{memo.touched && memo.error && memo.error}</div>
return (<React.Fragment>
<div className="row">
<div className={'column ' + columns[0]} style={{paddingTop: 33}}>{tt('transfer_jsx.memo')}</div>
<div className={'column ' + columns[1]}>
<small>
{isObsoletePrivate ?
tt('transfer_jsx.public_obsolete') :
(isMemoPrivate ?
tt('transfer_jsx.memo_locked') :
tt('transfer_jsx.public'))}
</small>
{input}
<div className="error">{memo.touched && memo.error && memo.error}</div>
</div>
</div>
</div>)
{this._renderMemoPostfix(memo_postfix, disableMemo, loading)}
</React.Fragment>)
};

render() {
Expand All @@ -390,7 +442,7 @@ class TransferForm extends Component {
const powerTip = tt('tips_js.influence_tokens_which_give_you_more_control_over', {VESTING_TOKEN, VESTING_TOKENS})
const powerTip2 = tt('tips_js.VESTING_TOKEN_is_non_transferrable_and_requires_convert_back_to_LIQUID_TOKEN', {LIQUID_TOKEN: LIQUID_TICKER, VESTING_TOKEN2})
const powerTip3 = tt('tips_js.converted_VESTING_TOKEN_can_be_sent_to_yourself_but_can_not_transfer_again', {LIQUID_TOKEN, VESTING_TOKEN})
const { to, amount, asset, memo,
const { to, amount, asset, memo, memo_postfix,
memoPrefix, memoInitial, isMemoPrivate, } = this.state
const { loading, trxError, advanced, } = this.state
const {currentAccount, currentUser, sym, toVesting, transferToSelf, dispatchSubmit} = this.props
Expand All @@ -410,6 +462,7 @@ class TransferForm extends Component {
memo: memoInitial,
prefix: memoPrefix || '',
name: this.state.withdrawalWay,
postfix_title: this.state.memoPostfixTitle
};
}

Expand Down Expand Up @@ -515,7 +568,7 @@ class TransferForm extends Component {
</div>}

{(memo && !disableMemo) && !isIssueUIA &&
this._renderMemo(memo, memoInitial, memoPrefix, disableMemo, isMemoPrivate, loading)}
this._renderMemo(memo, memoInitial, memoPrefix, memo_postfix, disableMemo, isMemoPrivate, loading)}

{loading && <span><LoadingIndicator type="circle" /><br /></span>}
{!loading && <span>
Expand Down Expand Up @@ -596,7 +649,7 @@ export default connect(
dispatch(user.actions.setTransferDefaults(transferDefaults))
},
dispatchSubmit: async ({
to, amount, isUIA, asset, precision, memo, transferType,
to, amount, isUIA, asset, precision, memo, memo_postfix, transferType,
withdrawalWay, isMemoPrivate,
toVesting, currentUser, errorCallback
}) => {
Expand Down Expand Up @@ -657,11 +710,16 @@ export default connect(

if (withdrawalWay) {
operation.memo = withdrawalWay.prefix + operation.memo;
if (memo_postfix) {
operation.memo += ':' + memo_postfix
}
saveMemo(
asset,
withdrawalWay.name,
memo || '',
withdrawalWay.prefix);
withdrawalWay.prefix,
memo_postfix,
withdrawalWay.postfix_title);
}

if (isMemoPrivate)
Expand Down
67 changes: 57 additions & 10 deletions app/components/modules/uia/AssetEditWithdrawal.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,17 @@ class AssetEditWithdrawal extends React.Component {
return handle(e);
};

onPostfixChange = (e, handle, index, values, setFieldValue) => {
if (e.target.value) {
const way = values.withdrawal.ways[index]
if (way && !way.postfix_title) {
setFieldValue('withdrawal.ways[' + index + '].postfix_title',
tt('asset_edit_withdrawal_jsx.way_postfix_title_placeholder'))
}
}
return handle(e)
};

submit() {
this.submitTried = true;
};
Expand Down Expand Up @@ -100,7 +111,7 @@ class AssetEditWithdrawal extends React.Component {
};

render() {
const { name, values, handleChange, } = this.props;
const { name, values, handleChange, setFieldValue, } = this.props;

let wayFields = <FieldArray
name={`${name}.ways`}
Expand All @@ -114,8 +125,8 @@ class AssetEditWithdrawal extends React.Component {
name={`${name}.ways.${index}`}
validate={this.validateWay}
/>
<div className='row'>
<div className='column small-3'>
<div className='row way-row'>
<div className='column small-2'>
<div className='input-group'>
<Field
name={`${name}.ways.${index}.name`}
Expand All @@ -127,7 +138,7 @@ class AssetEditWithdrawal extends React.Component {
/>
</div>
</div>
<div className='column small-4'>
<div className='column small-2'>
<div className='input-group'>
<Field
name={`${name}.ways.${index}.prefix`}
Expand All @@ -139,7 +150,7 @@ class AssetEditWithdrawal extends React.Component {
/>
</div>
</div>
<div className='column small-5'>
<div className='column small-4'>
<div className='input-group'>
<Field
name={`${name}.ways.${index}.memo`}
Expand All @@ -149,6 +160,33 @@ class AssetEditWithdrawal extends React.Component {
maxLength='256'
placeholder={tt('asset_edit_withdrawal_jsx.way_memo_placeholder')}
/>
</div>
</div>
<div className='column small-1 postfix-left'>
<div className='input-group'>
<Field
name={`${name}.ways.${index}.postfix_title`}
component='input'
type='text'
className='input-group-field bold'
maxLength='64'
placeholder={tt('asset_edit_withdrawal_jsx.way_postfix_title_placeholder')}
title={tt('asset_edit_withdrawal_jsx.way_postfix_title_hint')}
/>
</div>
</div>
<div className='column small-3 postfix-right'>
<div className='input-group'>
<Field
name={`${name}.ways.${index}.postfix`}
component='input'
type='text'
className='input-group-field bold'
maxLength='64'
placeholder={tt('asset_edit_withdrawal_jsx.way_postfix_placeholder')}
title={tt('asset_edit_withdrawal_jsx.way_postfix_hint')}
onChange={e => this.onPostfixChange(e, handleChange, index, values, setFieldValue)}
/>
<Icon
className='remove-way'
name='cross'
Expand All @@ -162,7 +200,7 @@ class AssetEditWithdrawal extends React.Component {
)) : null}
<div className='add-way'>
<a
onClick={() => arrayHelpers.push({name: '', memo: '', prefix: ''})}
onClick={() => arrayHelpers.push({name: '', memo: '', prefix: '', postfix_title: '', postfix: ''})}
>
+&nbsp;{tt('asset_edit_withdrawal_jsx.way_add')}
</a>
Expand All @@ -188,16 +226,25 @@ class AssetEditWithdrawal extends React.Component {
</div>
<ErrorMessage name={`${name}.to`} component='div' className='error' />
</div>
<div className='row'>
<div className='column small-3'>
<div className='row way-row header'>
<div className='column small-2'>
{tt('asset_edit_withdrawal_jsx.way_name')}
</div>
<div className='column small-4'>
<div className='column small-2'>
{tt('asset_edit_withdrawal_jsx.way_prefix')}
<div className='secondary'>
{tt('asset_edit_withdrawal_jsx.if_need')}
</div>
</div>
<div className='column small-5'>
<div className='column small-4'>
{tt('asset_edit_withdrawal_jsx.way_memo')}
</div>
<div className='column small-4'>
{tt('asset_edit_withdrawal_jsx.way_postfix')}
<div className='secondary'>
{tt('asset_edit_withdrawal_jsx.if_need')}
</div>
</div>
</div>
{wayFields}
<div>
Expand Down
23 changes: 23 additions & 0 deletions app/components/modules/uia/AssetEditWithdrawal.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,29 @@
.input-group {
margin-bottom: 1.25rem;
}
.way-row {
padding-left: 0.45rem;
.column {
padding-left: 0.5rem;
padding-right: 0.5rem;
&.postfix-left {
padding-right: 0rem;
input {
font-size: 90%;
}
}
&.postfix-right {
padding-left: 0rem;
}
}
&.header {
font-size: 85%;
.secondary {
font-size: 85%;
padding-bottom: 0.25rem;
}
}
}
.add-way {
display: block;
margin-bottom: 1.25rem;
Expand Down
3 changes: 2 additions & 1 deletion app/components/modules/uia/UpdateAsset.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,7 @@ class UpdateAsset extends Component {
details: '',
};
if (!withdrawal.ways || !withdrawal.ways[0])
withdrawal.ways = [{ name: '', memo: '', prefix: '', }];
withdrawal.ways = [{ name: '', memo: '', prefix: '', postfix_title: '', postfix: '' }];
this.setState({
initialValues: {
fee_percent,
Expand Down Expand Up @@ -279,6 +279,7 @@ class UpdateAsset extends Component {
ref={this.aewRef}
values={values}
handleChange={handleChange}
setFieldValue={setFieldValue}
/>

<div className='row'>
Expand Down
6 changes: 6 additions & 0 deletions app/locales/en.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -724,6 +724,12 @@
"way_memo_placeholder": "USDT-wallet-address",
"way_prefix": "Memo prefix: ",
"way_prefix_placeholder": "tron:",
"way_postfix": "Memo postfix: ",
"way_postfix_title_placeholder": "Whom",
"way_postfix_placeholder": "your public key",
"way_postfix_hint": "Placeholder, what user should be enter here, e.g. \"your public key\"",
"way_postfix_title_hint": "Title of field, e.g. \"Whom\"",
"if_need": "(if need)",
"way_add": "Add another method",
"way_name_error": "Specify the name of the network/system, example: USDT (TRC-20), DOGE...",
"way_prefix_error": "Do not prepend memo itself with the prefix.",
Expand Down
Loading

0 comments on commit e3d1292

Please sign in to comment.