Qortal/qortal-ui
4
1
Fork 4
mirror of https://github.com/Qortal/qortal-ui.git synced 2025-02-12 02:05:51 +00:00
Code Issues Projects Releases Wiki Activity

Fix bug with fetching wallet addresses in profile

Browse Source
This commit is contained in:
Justin Ferrari 2023-11-08 05:25:12 -05:00
parent f00847740b
commit 4c2d9cf938
1 changed files with 169 additions and 153 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

320
core/src/components/friends-view/profile-modal-update.js
View File

@ -32,11 +32,11 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
hasFetchedArrr: { type: Boolean }, hasFetchedArrr: { type: Boolean },
isOpenCustomDataModal: { type: Boolean }, isOpenCustomDataModal: { type: Boolean },
customData: { type: Object }, customData: { type: Object },
newCustomDataField: {type: Object}, newCustomDataField: { type: Object },
newFieldName: {type: String}, newFieldName: { type: String },
qortalRequestCustomData: {type: Object}, qortalRequestCustomData: { type: Object },
newCustomDataKey: {type: String}, newCustomDataKey: { type: String },
isSaving: {type: Boolean} isSaving: { type: Boolean },
}; };
} }
@ -75,11 +75,10 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
this.hasFetchedArrr = false; this.hasFetchedArrr = false;
this.isOpenCustomDataModal = false; this.isOpenCustomDataModal = false;
this.customData = {}; this.customData = {};
this.newCustomDataKey = "" this.newCustomDataKey = '';
this.newCustomDataField = {}; this.newCustomDataField = {};
this.newFieldName = ''; this.newFieldName = '';
this.isSaving = false this.isSaving = false;
} }
static get styles() { static get styles() {
@ -240,20 +239,20 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
changedProperties.has('editContent') && changedProperties.has('editContent') &&
this.editContent this.editContent
) { ) {
const {bio, tagline, wallets, customData} = this.editContent const { bio, tagline, wallets, customData } = this.editContent;
this.bio = bio ?? ''; this.bio = bio ?? '';
this.tagline = tagline ?? ''; this.tagline = tagline ?? '';
let formWallets = {...this.wallets} let formWallets = { ...this.wallets };
if(wallets && Object.keys(wallets).length){ if (wallets && Object.keys(wallets).length) {
Object.keys(formWallets).forEach((key)=> { Object.keys(formWallets).forEach((key) => {
if(wallets[key]){ if (wallets[key]) {
formWallets[key] = wallets[key] formWallets[key] = wallets[key];
} }
}) });
} }
this.wallets = formWallets this.wallets = formWallets;
this.customData = {...customData} this.customData = { ...customData };
this.requestUpdate(); this.requestUpdate();
} }
if ( if (
@ -261,13 +260,13 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
changedProperties.has('qortalRequestCustomData') && changedProperties.has('qortalRequestCustomData') &&
this.qortalRequestCustomData this.qortalRequestCustomData
) { ) {
this.isOpenCustomDataModal = true this.isOpenCustomDataModal = true;
this.newCustomDataField = {...this.qortalRequestCustomData.payload.customData} this.newCustomDataField = {
this.newCustomDataKey = this.qortalRequestCustomData.property ...this.qortalRequestCustomData.payload.customData,
};
this.newCustomDataKey = this.qortalRequestCustomData.property;
this.requestUpdate(); this.requestUpdate();
} }
} }
async firstUpdated() { async firstUpdated() {
@ -308,11 +307,11 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
async getSelectedWalletAddress(wallet) { async getSelectedWalletAddress(wallet) {
switch (wallet) { switch (wallet) {
case 'arrr': case 'arrr':
if(!this.arrrWalletAddress){ if (!this.arrrWalletAddress) {
try { try {
await this.fetchWalletAddress('arrr'); await this.fetchWalletAddress('arrr');
} catch (error) { } catch (error) {
console.log({error}) console.log({ error });
} }
} }
// Use address returned by core API // Use address returned by core API
@ -348,8 +347,8 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
this.tagline = ''; this.tagline = '';
} }
fillAddress(coin) { async fillAddress(coin) {
const address = this.getSelectedWalletAddress(coin); const address = await this.getSelectedWalletAddress(coin);
if (address) { if (address) {
this.wallets = { this.wallets = {
...this.wallets, ...this.wallets,
@ -365,51 +364,51 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
tagline: this.tagline, tagline: this.tagline,
bio: this.bio, bio: this.bio,
wallets: this.wallets, wallets: this.wallets,
customData: this.customData customData: this.customData,
}; };
this.isSaving = true this.isSaving = true;
await this.onSubmit(data); await this.onSubmit(data);
this.setIsOpen(false); this.setIsOpen(false);
this.clearFields(); this.clearFields();
this.onClose('success'); this.onClose('success');
} catch (error) {} finally { } catch (error) {
this.isSaving = false } finally {
this.isSaving = false;
} }
} }
removeField(key){ removeField(key) {
const copyObj = {...this.newCustomDataField} const copyObj = { ...this.newCustomDataField };
delete copyObj[key] delete copyObj[key];
this.newCustomDataField = copyObj this.newCustomDataField = copyObj;
} }
addField(){ addField() {
const copyObj = {...this.newCustomDataField} const copyObj = { ...this.newCustomDataField };
copyObj[this.newFieldName] = '' copyObj[this.newFieldName] = '';
this.newCustomDataField = copyObj this.newCustomDataField = copyObj;
this.newFieldName = "" this.newFieldName = '';
} }
addCustomData(){ addCustomData() {
const copyObj = {...this.customData} const copyObj = { ...this.customData };
copyObj[this.newCustomDataKey] = this.newCustomDataField copyObj[this.newCustomDataKey] = this.newCustomDataField;
this.customData = copyObj this.customData = copyObj;
this.newCustomDataKey = "" this.newCustomDataKey = '';
this.newCustomDataField = {}; this.newCustomDataField = {};
this.newFieldName = '' this.newFieldName = '';
this.isOpenCustomDataModal = false; this.isOpenCustomDataModal = false;
} }
updateCustomData(key, data){ updateCustomData(key, data) {
this.isOpenCustomDataModal = true this.isOpenCustomDataModal = true;
this.newCustomDataField = data this.newCustomDataField = data;
this.newCustomDataKey = key this.newCustomDataKey = key;
} }
removeCustomData(key){ removeCustomData(key) {
const copyObj = {...this.customData} const copyObj = { ...this.customData };
delete copyObj[key] delete copyObj[key];
this.customData = copyObj this.customData = copyObj;
} }
render() { render() {
@ -479,7 +478,9 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
> >
<input <input
id=${key} id=${key}
placeholder=${key + ' ' + get('settings.address')} placeholder=${key +
' ' +
get('settings.address')}
class="input" class="input"
.value=${this.wallets[key]} .value=${this.wallets[key]}
@change=${(e) => { @change=${(e) => {
@ -498,13 +499,15 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
>upload_2</mwc-icon >upload_2</mwc-icon
> >
<vaadin-tooltip <vaadin-tooltip
for=${`${key}-upload`} for=${`${key}-upload`}
position="bottom" position="bottom"
hover-delay=${200} hover-delay=${200}
hide-delay=${1} hide-delay=${1}
text=${translate('profile.profile21')} text=${translate(
> 'profile.profile21'
</vaadin-tooltip> )}
>
</vaadin-tooltip>
</div> </div>
</div> </div>
`; `;
@ -516,20 +519,21 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
<div <div
style="display:flex;justify-content:center;flex-direction:column;gap:25px" style="display:flex;justify-content:center;flex-direction:column;gap:25px"
> >
<div <div
style="display:flex;gap:15px;align-items:center" style="display:flex;gap:15px;align-items:center"
> >
<p <p
style="color: var(--black);font-size:16px"
style="color: var(--black);font-size:16px" >
> ${key}
${key}
</p> </p>
<mwc-icon <mwc-icon
@click=${() => @click=${() =>
this.updateCustomData(key,this.customData[key])} this.updateCustomData(
key,
this.customData[key]
)}
style="color:var(--black);cursor:pointer" style="color:var(--black);cursor:pointer"
>edit</mwc-icon >edit</mwc-icon
> >
@ -561,29 +565,34 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
</button> </button>
<div style="display:flex;gap:10px;align-items:center"> <div style="display:flex;gap:10px;align-items:center">
<button
<button ?disabled="${this.isLoading}"
?disabled="${this.isLoading}" class="modal-button"
class="modal-button" @click=${() => {
@click=${() => { this.isOpenCustomDataModal = true;
this.isOpenCustomDataModal = true; }}
}} >
> ${translate('profile.profile8')}
${translate('profile.profile8')} </button>
</button> <button
<button ?disabled="${this.isLoading}"
?disabled="${this.isLoading}" class="modal-button"
class="modal-button" @click=${() => {
@click=${() => { if (this.isSaving) return;
if(this.isSaving) return this.saveProfile();
this.saveProfile(); }}
}} >
> ${this.isSaving
${this.isSaving ? html` ? html`
<paper-spinner-lite active></paper-spinner-lite> <paper-spinner-lite
` : ''} active
${this.isSaving ? '' : translate('profile.profile3') } ></paper-spinner-lite>
</button> `
: ''}
${this.isSaving
? ''
: translate('profile.profile3')}
</button>
</div> </div>
</div> </div>
</div> </div>
@ -614,14 +623,12 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
> >
<input <input
id="key-name" id="key-name"
placeholder=${translate( placeholder=${translate('profile.profile9')}
'profile.profile9'
)}
?disabled=${!!this.qortalRequestCustomData} ?disabled=${!!this.qortalRequestCustomData}
class="input" class="input"
.value=${this.newCustomDataKey} .value=${this.newCustomDataKey}
@change=${(e) => { @change=${(e) => {
this.newCustomDataKey = e.target.value this.newCustomDataKey = e.target.value;
}} }}
/> />
</div> </div>
@ -629,66 +636,75 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
<div style="height:15px"></div> <div style="height:15px"></div>
<p>${translate('profile.profile10')}</p> <p>${translate('profile.profile10')}</p>
<div style="display: flex;flex-direction: column;"> <div style="display: flex;flex-direction: column;">
${Object.keys(this.newCustomDataField).map((key) => { ${Object.keys(this.newCustomDataField).map(
return html` (key) => {
<div return html`
style="display:flex;justify-content:center;flex-direction:column"
>
<label
for=${key}
id="taglineLabel"
style="color: var(--black);font-size:16px"
>
${key}
</label>
<div <div
style="display:flex;gap:15px;align-items:center" style="display:flex;justify-content:center;flex-direction:column"
> >
<label
<input for=${key}
id=${key} id="taglineLabel"
placeholder=${translate('profile.profile13')} style="color: var(--black);font-size:16px"
class="input"
.value=${this.newCustomDataField[key]}
@change=${(e) => {
this.newCustomDataField = {
...this.newCustomDataField,
[key]: e.target.value,
};
}}
/>
<mwc-icon
@click=${() =>
this.removeField(key)}
style="color:var(--black);cursor:pointer"
>remove</mwc-icon
> >
${key}
</label>
<div
style="display:flex;gap:15px;align-items:center"
>
<input
id=${key}
placeholder=${translate(
'profile.profile13'
)}
class="input"
.value=${this
.newCustomDataField[
key
]}
@change=${(e) => {
this.newCustomDataField =
{
...this
.newCustomDataField,
[key]: e.target
.value,
};
}}
/>
<mwc-icon
@click=${() =>
this.removeField(key)}
style="color:var(--black);cursor:pointer"
>remove</mwc-icon
>
</div>
</div> </div>
</div> `;
`; }
})} )}
</div> </div>
<div style="height:15px"></div> <div style="height:15px"></div>
<div style="width:100%;display:flex;justify-content:center;gap:10px;margin-top:30px"> <div
<input style="width:100%;display:flex;justify-content:center;gap:10px;margin-top:30px"
placeholder=${translate('profile.profile12')}
class="input"
.value=${this.newFieldName}
@change=${(e) => {
this.newFieldName = e.target.value
}}
/>
<button
class="modal-button"
@click=${() => {
this.addField();
}}
> >
${translate('profile.profile11')} <input
</button> placeholder=${translate('profile.profile12')}
class="input"
.value=${this.newFieldName}
@change=${(e) => {
this.newFieldName = e.target.value;
}}
/>
<button
class="modal-button"
@click=${() => {
this.addField();
}}
>
${translate('profile.profile11')}
</button>
</div> </div>
</div> </div>
<div <div
@ -698,8 +714,8 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
class="modal-button-red" class="modal-button-red"
?disabled="${this.isLoading}" ?disabled="${this.isLoading}"
@click="${() => { @click="${() => {
this.isOpenCustomDataModal = false this.isOpenCustomDataModal = false;
this.newCustomDataKey = "" this.newCustomDataKey = '';
this.newCustomDataField = {}; this.newCustomDataField = {};
}}" }}"
> >
@ -713,7 +729,7 @@ class ProfileModalUpdate extends connect(store)(LitElement) {
this.addCustomData(); this.addCustomData();
}} }}
> >
${translate('profile.profile8')} ${translate('profile.profile8')}
</button> </button>
</div> </div>
</div> </div>