added an update form check

This commit is contained in:
Daria Golova
2022-07-21 16:07:40 +03:00
parent 020e45ddce
commit 68e94201e0
3 changed files with 62 additions and 35 deletions

View File

@@ -108,7 +108,7 @@ const Onboarding2 = observer(() => {
<select onBlur={checkFillingForm} id="gender" onChange={(event)=>saveValueChange(event)} className="form-select w-full"> <select onBlur={checkFillingForm} id="gender" onChange={(event)=>saveValueChange(event)} className="form-select w-full">
<option className="hidden"></option> <option className="hidden"></option>
<option>male</option> <option>male</option>
<option>feemale</option> <option>female</option>
</select> </select>
</div> </div>
<div> <div>

View File

@@ -26,6 +26,7 @@ const Profile = observer (() => {
const [propertyValues, setPropertyValues] = useState([]); const [propertyValues, setPropertyValues] = useState([]);
const [updatedValues, setUpdatedValues] = useState([defaultValues]); const [updatedValues, setUpdatedValues] = useState([defaultValues]);
const [addedValues, setAddedValues] = useState(defaultValues); const [addedValues, setAddedValues] = useState(defaultValues);
const [fillingUpdateForm, setFillingUpdateForm] = useState(false);
const openHint = () => { const openHint = () => {
if (!addedValues.label) { if (!addedValues.label) {
@@ -38,6 +39,7 @@ const Profile = observer (() => {
...prevState, ...prevState,
[field]: value, [field]: value,
})) }))
console.log(addedValues)
}; };
const changeUpdatedValues = (value, field, key) => { const changeUpdatedValues = (value, field, key) => {
@@ -54,6 +56,7 @@ const Profile = observer (() => {
const selectHint = (element) => { const selectHint = (element) => {
changeAddedValues(element, 'label'); changeAddedValues(element, 'label');
setPropertyValues([]); setPropertyValues([]);
changeAddedValues();
} }
const closeHint = (eventTarget) => { const closeHint = (eventTarget) => {
@@ -62,6 +65,17 @@ const Profile = observer (() => {
} }
}; };
const checkFillingUpdateForm = (eventTarget) => {
console.log(eventTarget);
if (eventTarget && eventTarget.id === 'sendingUpdatedValues') {
const checkingCondition = updatedValues.every(item => !Object.keys(item).find(elem => !item[elem]));
if (checkingCondition) {
setFillingUpdateForm(true);
}
}
console.log(updatedValues);
}
const handleSelectedItems = (selectedItems) => { const handleSelectedItems = (selectedItems) => {
setSelectedItems([...selectedItems]); setSelectedItems([...selectedItems]);
setUpdatedValues(registrationStore.decryptedUserData.filter(({ key }) => selectedItems.includes(key)) setUpdatedValues(registrationStore.decryptedUserData.filter(({ key }) => selectedItems.includes(key))
@@ -103,9 +117,12 @@ const Profile = observer (() => {
}; };
const sendUpdatedData = () => { const sendUpdatedData = () => {
setUpdatePanelOpen(false); if (fillingUpdateForm) {
changeDataParameters(); setUpdatePanelOpen(false);
setChangePanelOpen(true); changeDataParameters();
setChangePanelOpen(true);
setFillingUpdateForm(false);
}
}; };
const deleteDataParameters = () => { const deleteDataParameters = () => {
@@ -138,7 +155,7 @@ const Profile = observer (() => {
}; };
const addDataParameters = () => { const addDataParameters = () => {
addedValues.key = addedValues.label.toLowerCase().split(' ').join('_'); addedValues.key = addedValues.label.toLowerCase().split(' ').join('');
registrationStore.pushAccountData(registrationStore.decryptedUserData.concat(addedValues)); registrationStore.pushAccountData(registrationStore.decryptedUserData.concat(addedValues));
}; };
@@ -149,6 +166,12 @@ const Profile = observer (() => {
}; };
const cancelUpdatePanel = () => { const cancelUpdatePanel = () => {
setUpdatedValues(registrationStore.decryptedUserData.filter(({ key }) => selectedItems.includes(key))
.map(elem => (
(!elem.seed) ? {
...elem,
seed: String(Math.floor(Math.random() * 90000000000000000000), 10),
}: elem)));
setUpdatePanelOpen(false); setUpdatePanelOpen(false);
setChangePanelOpen(true); setChangePanelOpen(true);
}; };
@@ -301,6 +324,7 @@ const Profile = observer (() => {
<button <button
className="btn-sm bg-indigo-500 hover:bg-indigo-600 text-white" className="btn-sm bg-indigo-500 hover:bg-indigo-600 text-white"
onClick={sendAddedData} onClick={sendAddedData}
id='sendingAddedValues'
> >
Send Send
</button> </button>
@@ -331,6 +355,7 @@ const Profile = observer (() => {
type="text" type="text"
required required
onChange={(e) => changeUpdatedValues(e.target.value, 'value', item.key)} onChange={(e) => changeUpdatedValues(e.target.value, 'value', item.key)}
onBlur={(e) => checkFillingUpdateForm(e.relatedTarget)}
value={item.value} value={item.value}
/> />
</div> </div>
@@ -343,6 +368,7 @@ const Profile = observer (() => {
type="number" type="number"
required required
onChange={(e) => changeUpdatedValues(e.target.value, 'seed', item.key)} onChange={(e) => changeUpdatedValues(e.target.value, 'seed', item.key)}
onBlur={(e) => checkFillingUpdateForm(e.relatedTarget)}
value={item.seed} value={item.seed}
/> />
</div> </div>
@@ -373,6 +399,7 @@ const Profile = observer (() => {
<button <button
className="btn-sm bg-indigo-500 hover:bg-indigo-600 text-white" className="btn-sm bg-indigo-500 hover:bg-indigo-600 text-white"
onClick={sendUpdatedData} onClick={sendUpdatedData}
id='sendingUpdatedValues'
> >
Send Send
</button> </button>

View File

@@ -32,49 +32,49 @@ class Store {
reaction(() => this.keysArray, () => this.fetchSharedData()) reaction(() => this.keysArray, () => this.fetchSharedData())
onBecomeObserved(this, "decryptedUserData", () => this.fetchNewAccountData()) onBecomeObserved(this, "decryptedUserData", () => this.fetchNewAccountData())
onBecomeObserved(this, "sharedData", ()=>this.fetchKeysArray()) onBecomeObserved(this, "sharedData", () => this.fetchKeysArray())
onBecomeUnobserved(this, "sharedData", ()=>this.unobservedSharedData()) onBecomeUnobserved(this, "sharedData", () => this.unobservedSharedData())
onBecomeObserved(this, "transactionsInfo", ()=>this.fetchTransactionsInfo()) onBecomeObserved(this, "transactionsInfo", () => this.fetchTransactionsInfo())
onBecomeUnobserved(this, "transactionsInfo", ()=>this.unobservedTransactionsInfo()) onBecomeUnobserved(this, "transactionsInfo", () => this.unobservedTransactionsInfo())
}; };
fetchNewAccountData() { fetchNewAccountData() {
getNodeInfo() getNodeInfo()
.then((info)=>{ .then((info)=>{
this.fetchNodeInfoSuccess(info) this.fetchNodeInfoSuccess(info)
fetchWrapper.getAuth('data/private', { fetchWrapper.getAuth('data/private', {
networkIdentifier: this.nodeInfo.networkIdentifier, networkIdentifier: this.nodeInfo.networkIdentifier,
lastBlockID: this.nodeInfo.lastBlockID lastBlockID: this.nodeInfo.lastBlockID
}).then((res) => this.userDataFetchChange(res)) }).then((res) => this.userDataFetchChange(res))
}) })
.catch((err) => this.fetchNodeInfoFailed(err)) .catch((err) => this.fetchNodeInfoFailed(err))
} }
pushAccountData(data=this.accountData) { pushAccountData(data = this.accountData) {
fetchWrapper.postAuth('data/private', { fetchWrapper.postAuth('data/private', {
networkIdentifier: this.nodeInfo.networkIdentifier, networkIdentifier: this.nodeInfo.networkIdentifier,
lastBlockID: this.nodeInfo.lastBlockID lastBlockID: this.nodeInfo.lastBlockID
}, [...this.encryptAccountData(data)]) }, [...this.encryptAccountData(data)])
.then(()=>this.fetchNewAccountData()) .then(() => this.fetchNewAccountData())
} }
fetchKeysArray() { fetchKeysArray() {
getNodeInfo() getNodeInfo()
.then((info)=>{ .then((info)=>{
this.fetchNodeInfoSuccess(info) this.fetchNodeInfoSuccess(info)
fetchWrapper.getAuth('data/shared/', { fetchWrapper.getAuth('data/shared/', {
networkIdentifier: this.nodeInfo.networkIdentifier, networkIdentifier: this.nodeInfo.networkIdentifier,
lastBlockID: this.nodeInfo.lastBlockID lastBlockID: this.nodeInfo.lastBlockID
}).then((res) => this.keysArrayFetchChange(res)) }).then((res) => this.keysArrayFetchChange(res))
}) })
.catch((err) => this.fetchNodeInfoFailed(err)) .catch((err) => this.fetchNodeInfoFailed(err))
} }
fetchTransactionsInfo() { fetchTransactionsInfo() {
fetchWrapper.get(`account/transactions/${this.accountMadeTransaction}?moduleID=1001&assetID=11`, { fetchWrapper.get(`account/transactions/${this.accountMadeTransaction}?moduleID=1001&assetID=11`, {
networkIdentifier: this.nodeInfo.networkIdentifier, networkIdentifier: this.nodeInfo.networkIdentifier,
lastBlockID: this.nodeInfo.lastBlockID lastBlockID: this.nodeInfo.lastBlockID
}).then((res)=>this.saveInfoTransactions(res)) }).then((res) => this.saveInfoTransactions(res))
} }
fetchSharedData() { fetchSharedData() {
@@ -82,11 +82,11 @@ class Store {
}; };
unobservedTransactionsInfo() { unobservedTransactionsInfo() {
this._transactionsInfo=[] this._transactionsInfo = []
} }
unobservedSharedData() { unobservedSharedData() {
this._sharedData=[] this._sharedData = []
} }
changeSharedData(incomingData) { changeSharedData(incomingData) {
@@ -105,8 +105,8 @@ class Store {
fetchNodeInfo() { fetchNodeInfo() {
getNodeInfo() getNodeInfo()
.then((info)=>this.fetchNodeInfoSuccess(info)) .then((info)=>this.fetchNodeInfoSuccess(info))
.catch((err) => this.fetchNodeInfoFailed(err)) .catch((err) => this.fetchNodeInfoFailed(err))
} }
saveInfoTransactions(transaction) { saveInfoTransactions(transaction) {
@@ -139,16 +139,16 @@ class Store {
}; };
get transactionsInfo() { get transactionsInfo() {
return this._transactionsInfo.map(item=>{ return this._transactionsInfo.map(item => {
return { return {
id: item.id, id: item.id,
users_images: usersImages.map(image=>{ users_images: usersImages.map(image => {
return { return {
image: image, image: image,
size: 24 size: 24
} }
}), }),
transaction: item.asset.features.map(asset=>{ transaction: item.asset.features.map(asset => {
return { return {
transaction_id: item.id, transaction_id: item.id,
address: this.accountMadeTransaction, address: this.accountMadeTransaction,