diff --git a/src/components/elements/common/AccountName/index.jsx b/src/components/elements/common/AccountName/index.jsx index 11cf7c5a..8f0e6c70 100644 --- a/src/components/elements/common/AccountName/index.jsx +++ b/src/components/elements/common/AccountName/index.jsx @@ -8,10 +8,16 @@ import Userpic from 'app/components/elements/Userpic' class AccountName extends React.Component { constructor(props) { super(props) + this.state = { + defaultOptions: [], + isLoading: true, + } + this.ref = React.createRef() } lookupAccounts = async (value) => { try { + //await new Promise(resolve => setTimeout(resolve, 2000)) const { includeFrozen, filterAccounts } = this.props const accNames = await api.lookupAccountsAsync(value.toLowerCase(), 6, { include_frozen: includeFrozen, @@ -33,16 +39,53 @@ class AccountName extends React.Component { } } + onMenuOpen = async (e) => { + const { current } = this.ref + if (!current) { console.warn('No AsyncSelect ref'); return; } + const target = current.inputRef + if (!target) { console.warn('No inputRef'); return; } + const { value } = target + if (!value) { + this.setState({ + isLoading: true, + defaultOptions: [] + }, async () => { + const defaultOptions = await this.lookupAccounts('') + this.setState({ + isLoading: false, + defaultOptions + }) + }) + } + } + + testIt = (e) => { + e.preventDefault() + console.log(this.state.dop) + if (this.state.dop === true) + this.setState({ + dop: [] + }); else this.setState({ + dop: true + }) + } + render() { const { onChange, className, ...rest } = this.props + const { defaultOptions, isLoading } = this.state + // isOptionSelected = false disables blue bg if opened not first time return tt('account_name_jsx.loading')} noOptionsMessage={() => tt('account_name_jsx.no_options')} loadOptions={this.lookupAccounts} - defaultOptions={true} + isLoading={isLoading} + defaultOptions={defaultOptions} cacheOptions={false} + onMenuOpen={this.onMenuOpen} + ref={this.ref} + isOptionSelected={() => false} className={'AccountName ' + (className || ' ')} getOptionLabel={(option) => { diff --git a/src/components/modules/CreateGroup.jsx b/src/components/modules/CreateGroup.jsx index b238b77c..6c755e20 100644 --- a/src/components/modules/CreateGroup.jsx +++ b/src/components/modules/CreateGroup.jsx @@ -77,6 +77,7 @@ class CreateGroup extends React.Component { const gbgBalance = Asset(sbd_balance) if (gbgBalance.gte(cost)) { this.setState({ + cost, loaded: true }) return @@ -179,7 +180,7 @@ class CreateGroup extends React.Component { } render() { - const { step, loaded, createError, validators, submitError } = this.state + const { step, loaded, createError, validators, submitError, cost } = this.state let form if (!loaded) { @@ -218,7 +219,7 @@ class CreateGroup extends React.Component { return (
- {!isSubmitting ? (step === 'name' ? : + {!isSubmitting ? (step === 'name' ? : step === 'logo' ? : step === 'members' ? : step === 'final' ? : diff --git a/src/components/modules/groups/GroupName.jsx b/src/components/modules/groups/GroupName.jsx index 686865cd..35029ccd 100644 --- a/src/components/modules/groups/GroupName.jsx +++ b/src/components/modules/groups/GroupName.jsx @@ -79,7 +79,7 @@ export default class GroupName extends React.Component { } render() { - const { values } = this.props + const { values, cost } = this.props return
@@ -147,6 +147,18 @@ export default class GroupName extends React.Component {
+ + {cost ?
+
+ + + + {tt('create_group_jsx.gbg_too_low')} + {cost.floatString}. + + +
+
: null}
} }