diff --git a/src/pages/Onboarding2.jsx b/src/pages/Onboarding2.jsx index 62d70f8..09d93bf 100644 --- a/src/pages/Onboarding2.jsx +++ b/src/pages/Onboarding2.jsx @@ -10,8 +10,8 @@ import Logo from "../images/logo.png"; const Onboarding2 = observer(()=>{ const [dataRegistration, setDataRegistration] = useState( { - first_name: '', - second_name: '', + firstname: '', + secondname: '', gender: '', birthdate: '', } @@ -95,11 +95,11 @@ const Onboarding2 = observer(()=>{
- saveValueChange(event)} className="form-input w-full" type="text" /> + saveValueChange(event)} className="form-input w-full" type="text" />
- saveValueChange(event)} className="form-input w-full" type="text" /> + saveValueChange(event)} className="form-input w-full" type="text" />
diff --git a/src/pages/Onboarding4.jsx b/src/pages/Onboarding4.jsx index bb97ffa..0354680 100644 --- a/src/pages/Onboarding4.jsx +++ b/src/pages/Onboarding4.jsx @@ -23,7 +23,7 @@ const Onboarding4 = observer(()=>{ } } - const firstNameAccount = registrationStore.accountData.length && registrationStore.accountData.find(item=>item.key==="first_name").value + const firstNameAccount = registrationStore.accountData.length && registrationStore.accountData.find(item=>item.key==="firstname").value return (
diff --git a/src/pages/digitalId/ProfileId.jsx b/src/pages/digitalId/ProfileId.jsx index fae4309..23d9559 100644 --- a/src/pages/digitalId/ProfileId.jsx +++ b/src/pages/digitalId/ProfileId.jsx @@ -1,5 +1,4 @@ import React, { useState } from 'react'; -import { userDataStore } from '../../store/userDataStore'; import { registrationStore } from "../../store/store"; import Sidebar from '../../partials/Sidebar'; import { observer } from 'mobx-react-lite'; @@ -10,7 +9,7 @@ import Image from '../../images/transactions-image-04.svg'; const defaultValues = { label: '', value: '', - seed: String(Math.floor(Math.random() * 90000000000000000000), 10) + seed: String(Math.floor(Math.random() * 90000000000000000000), 10) }; const initialPropertyValues = ['First name', 'Second name', 'Birthdate', 'Gender', 'National doctype', 'National doc ID', 'National doc issue date', 'National doc expiry date']; @@ -42,7 +41,7 @@ const Profile = observer (() => { }; const changeUpdatedValues = (value, field, key) => { - setUpdatedValues((prevState) => + setUpdatedValues((prevState) => prevState.map((elem) => ( (elem.key === key) ? { ...elem, @@ -65,11 +64,11 @@ const Profile = observer (() => { const handleSelectedItems = (selectedItems) => { setSelectedItems([...selectedItems]); - setUpdatedValues(userDataStore.decryptedData.filter(({ key }) => selectedItems.includes(key)) + setUpdatedValues(registrationStore.decryptedUserData.filter(({ key }) => selectedItems.includes(key)) .map(elem => ( (!elem.seed) ? { ...elem, - seed: String(Math.floor(Math.random() * 90000000000000000000), 10) + seed: String(Math.floor(Math.random() * 90000000000000000000), 10) }: elem))); if (selectedItems.length > 0) { setButtonPanelOpen(false); @@ -93,7 +92,7 @@ const Profile = observer (() => { } const sendAddedData = () => { - const checkingAddedData = !userDataStore.decryptedData + const checkingAddedData = !registrationStore.decryptedUserData .some((element) => element.label === addedValues.label) && (addedValues.seed.length === 20); if (checkingAddedData) { setAddPanelOpen(false); @@ -110,18 +109,18 @@ const Profile = observer (() => { } const deleteDataParameters = () => { - const changeData = userDataStore.decryptedData.filter(item=>!selectedItems.includes(item.key)) + const changeData = registrationStore.decryptedUserData.filter(item=>!selectedItems.includes(item.key)) registrationStore.pushAccountData(changeData); } const changeInitialArray = () => { let newArr = []; - userDataStore.decryptedData.map(elem => { + registrationStore.decryptedUserData.map(elem => { updatedValues.forEach(item => { if (elem.label === item.label) { newArr.push({ ...elem, - 'value': item.value, + 'value': item.value, 'seed': item.seed, }) } @@ -140,7 +139,7 @@ const Profile = observer (() => { const addDataParameters = () => { addedValues.key = addedValues.label.toLowerCase().split(' ').join('_'); - registrationStore.pushAccountData(userDataStore.decryptedData.concat(addedValues)); + registrationStore.pushAccountData(registrationStore.decryptedUserData.concat(addedValues)); } const cancelAddPanel = () => { @@ -212,7 +211,7 @@ const Profile = observer (() => {
{/* Table */} - +
{/* Left sidebar */}
@@ -309,7 +308,7 @@ const Profile = observer (() => {
{/* Update panel */}
- {updatedValues.map((item, index) => ( + {updatedValues.map((item, index) => (
@@ -383,7 +382,7 @@ const Profile = observer (() => {

Summary

- {userDataStore.decryptedData.filter(({ key }) => selectedItems.includes(key)).map(item => ( + {registrationStore.decryptedUserData.filter(({ key }) => selectedItems.includes(key)).map(item => ( {item.label} ))}
diff --git a/src/pages/digitalId/Validate.jsx b/src/pages/digitalId/Validate.jsx index 36ead06..0f38c1b 100644 --- a/src/pages/digitalId/Validate.jsx +++ b/src/pages/digitalId/Validate.jsx @@ -1,13 +1,13 @@ import React, { useState } from 'react'; import {observer} from "mobx-react-lite"; -import {transactionsStore} from "../../store/transactionsStore"; import Sidebar from '../../partials/Sidebar'; import Header from '../../partials/Header'; import ValidateTable from "../../partials/validate/ValidateTable"; import ValidatePanel from "../../partials/validate/ValidatePanel"; import ValidateRoadMap from "../../partials/validationlog/ValidateRoadMap"; import {Link} from "react-router-dom"; +import {registrationStore} from "../../store/store"; const Validate = observer(()=>{ const [sidebarOpen, setSidebarOpen] = useState(false); @@ -58,7 +58,7 @@ const Validate = observer(()=>{

Digital ID validation log ✨

- {transactionsStore.transactionsData.map(item => { + {registrationStore.transactionsInfo.map(item => { return })}
diff --git a/src/pages/digitalId/ValidationLog.jsx b/src/pages/digitalId/ValidationLog.jsx index a1190b2..0a3814f 100644 --- a/src/pages/digitalId/ValidationLog.jsx +++ b/src/pages/digitalId/ValidationLog.jsx @@ -1,10 +1,10 @@ import React, {useState} from 'react'; import ValidateRoadMap from "../../partials/validationlog/ValidateRoadMap"; -import {transactionsStore} from "../../store/transactionsStore"; import {observer} from "mobx-react-lite"; import Sidebar from '../../partials/Sidebar'; import Header from '../../partials/Header'; +import {registrationStore} from "../../store/store"; const ValidationLog = observer(()=>{ const [sidebarOpen, setSidebarOpen] = useState(false); @@ -28,7 +28,7 @@ const ValidationLog = observer(()=>{
{/* PostsID */} - {transactionsStore.transactionsData.map(item=>{ + {registrationStore.transactionsInfo.map(item=>{ return })}
diff --git a/src/pages/digitalId/Verify.jsx b/src/pages/digitalId/Verify.jsx index 1f5bb4b..821cd18 100644 --- a/src/pages/digitalId/Verify.jsx +++ b/src/pages/digitalId/Verify.jsx @@ -1,7 +1,7 @@ import React, { useState } from 'react'; import Sidebar from '../../partials/Sidebar'; import Header from '../../partials/Header'; -import { sharedDataStore } from '../../store/sharedDataStore'; +import {registrationStore} from "../../store/store"; import { observer } from 'mobx-react-lite'; const Verify = observer(() => { @@ -42,7 +42,7 @@ const Verify = observer(() => {
{/* Block */}
- {sharedDataStore.sharedData.map((item, index) => ( + {registrationStore.sharedData.map((item, index) => (
{/* Header */}
@@ -81,7 +81,7 @@ const Verify = observer(() => {
))}
-
+
))}
@@ -91,4 +91,4 @@ const Verify = observer(() => { ) }) -export default Verify; \ No newline at end of file +export default Verify; diff --git a/src/shared/labelMap.js b/src/shared/labelMap.js new file mode 100644 index 0000000..a089c41 --- /dev/null +++ b/src/shared/labelMap.js @@ -0,0 +1,27 @@ +export const labelMap = { + firstname: 'First name', + secondname: 'Second name', + gender: "Gender", + birthdate: "Birthdate", + placeofbirth: "Place of birth", + nationality: "Nationality", + nationalid: "National ID", + nationaldoctype: "National doctype", + nationaldocid: "National doc ID", + nationaldocissuedate: "National doc issue date", + nationaldocexpirydate: "National doc expiry date", + telephone: "Telephone", + twitter: "Twitter", + facebook: "Facebook", + instagram: "Instagram", + youtube: "Youtube", + wechat: "Wechat", + tiktok: "Tiktok", + linkedin: "Linkedin", + vk: "Vk", + github: "Github", + telegram: "Telegram", + qq: "Qq", + snapchat: "Snapchat", + reddit: "Reddit" +}; diff --git a/src/store/sharedDataStore.js b/src/store/sharedDataStore.js deleted file mode 100644 index b60ece3..0000000 --- a/src/store/sharedDataStore.js +++ /dev/null @@ -1,66 +0,0 @@ -import { makeAutoObservable, reaction } from "mobx"; -import { fetchWrapper } from "../shared/fetchWrapper"; -import { registrationStore } from './store'; - -const labelMap = { - firstname: 'First name', - secondname: 'Second name', - gender: "Gender", - birthdate: "Birthdate", - placeofbirth: "Place of birth", - nationality: "Nationality", - nationalid: "National ID", - nationaldoctype: "National doctype", - nationaldocid: "National doc ID", - nationaldocissuedate: "National doc issue date", - nationaldocexpirydate: "National doc expiry date", - telephone: "Telephone", - twitter: "Twitter", - facebook: "Facebook", - instagram: "Instagram", - youtube: "Youtube", - wechat: "Wechat", - tiktok: "Tiktok", - linkedin: "Linkedin", - vk: "Vk", - github: "Github", - telegram: "Telegram", - qq: "Qq", - snapchat: "Snapchat", - reddit: "Reddit" -}; - -class SharedDataStore{ - _keysArray = []; - _sharedData = []; - - constructor() { - makeAutoObservable(this); - - reaction(() => ({data: registrationStore.keysArray}), ({data}) => { - this._keysArray = data; - this.fetchSharedData(); - }) - } - - fetchSharedData() { - this._keysArray.forEach((elem) => fetchWrapper.get(`http://3.125.47.101/api/data/shared/${elem}`).then((res) => this.changeSharedData(res))) - }; - - changeSharedData(incomingData) { - this._sharedData.push({ - data: incomingData.data, - }) - } - - get sharedData() { - return this._sharedData.map(elem => ({ - data: elem.data.map(item => ({ - label: labelMap[item.label], - value: item.value, - })) - })); - }; -} - -export const sharedDataStore = new SharedDataStore(); \ No newline at end of file diff --git a/src/store/store.js b/src/store/store.js index 16be41b..339151b 100644 --- a/src/store/store.js +++ b/src/store/store.js @@ -1,7 +1,14 @@ -import { reaction, makeAutoObservable } from "mobx"; +import { reaction, makeAutoObservable, onBecomeObserved, onBecomeUnobserved} from "mobx"; import {cryptography} from "@liskhq/lisk-client"; import {getNodeInfo} from '../api/node'; import {fetchWrapper} from '../shared/fetchWrapper'; +import {labelMap} from "../shared/labelMap"; +import User08 from "../images/user-28-08.jpg"; +import User06 from "../images/user-28-06.jpg"; +import User05 from "../images/user-28-05.jpg"; +import User09 from "../images/user-28-09.jpg"; + +const usersImages = [User08,User06,User05,User09]; class Store { _accountData = [] @@ -10,27 +17,26 @@ class Store { _nodeInfo = {} - _userData = {} + _userData = [] _keysArray = [] - - _transactionsInfo = {} + + _sharedData = [] + + _transactionsInfo = [] constructor() { makeAutoObservable(this); this.fetchNodeInfo() - reaction(() => this.tokenKey, () => this.getData()) - reaction(() => this.tokenKey, () => this.fetchNewAccountData()) - reaction(() => this.tokenKey, () => this.fetchTransactionsInfo()) + reaction(()=>this.keysArray, ()=>this.fetchSharedData()) + onBecomeObserved(this, "userData", () => this.fetchNewAccountData()) + onBecomeObserved(this, "transactionsInfo", ()=>this.fetchTransactionsInfo()) + onBecomeUnobserved(this, "transactionsInfo", ()=>this.unobservedTransactionsInfo()) + onBecomeObserved(this, "sharedData", ()=>this.fetchKeysArray()) }; - getData() { - this.fetchNewAccountData(); - this.fetchKeysArray(); - } - fetchNewAccountData() { fetchWrapper.getAuth('http://3.125.47.101/api/data/private', { networkIdentifier: this.nodeInfo.networkIdentifier, @@ -63,18 +69,24 @@ class Store { .then((res)=>this.saveInfoTransactions(res)) } + fetchSharedData() { + this._keysArray.forEach((elem) => fetchWrapper.get(`http://3.125.47.101/api/data/shared/${elem}`).then((res) => this.changeSharedData(res))) + }; + + unobservedTransactionsInfo() { + this._transactionsInfo=[] + } + + changeSharedData(incomingData) { + this._sharedData.push({ + data: incomingData.data, + }) + } + get accountMadeTransaction() { return "b444b7ff3118cf2a30cbd54cfcdb8fd5d805017a" } - userDataFetchChange(res) { - this._userData = res; - } - - keysArrayFetchChange(res) { - this._keysArray = res.data; - } - get keysArray() { return this._keysArray; } @@ -83,10 +95,6 @@ class Store { return this._userData; } - get transactionsInfo() { - return this._transactionsInfo - } - savePassPhrase(phrase) { this._passPhrase = phrase } @@ -96,7 +104,15 @@ class Store { }; saveInfoTransactions(transaction) { - this._transactionsInfo = transaction + this._transactionsInfo = transaction.data + } + + userDataFetchChange(res) { + this._userData = res.data; + } + + keysArrayFetchChange(res) { + this._keysArray = res.data; } fetchNodeInfo() { @@ -121,6 +137,46 @@ class Store { return this._accountData } + get sharedData() { + return this._sharedData.map(elem => ({ + data: elem.data.map(item => ({ + label: labelMap[item.label], + value: item.value, + })) + })); + }; + + get transactionsInfo() { + return this._transactionsInfo.map(item=>{ + return { + id: item.id, + users_images: usersImages.map(image=>{ + return { + image: image, + size: 24 + } + }), + transaction: item.asset.features.map(asset=>{ + return { + transaction_id: item.id, + address: this.accountMadeTransaction, + value: asset.value, + label: labelMap[asset.label], + } + }) + } + }) + } + + get decryptedUserData(){ + return this._userData.map((elem) => ({ + ...elem, + key: elem.label, + label: labelMap[elem.label], + value: cryptography.decryptMessageWithPassphrase(elem.value, elem.value_nonce, registrationStore.passPhrase, registrationStore.pubKey).split(':')[1] + })) + } + encryptAccountData(data) { return data.map((item) => { let value = cryptography.encryptMessageWithPassphrase(cryptography.getRandomBytes(32).toString('hex') + ":" + item.value, this.passPhrase, this.pubKey); diff --git a/src/store/transactionsStore.js b/src/store/transactionsStore.js deleted file mode 100644 index e2c6f9a..0000000 --- a/src/store/transactionsStore.js +++ /dev/null @@ -1,51 +0,0 @@ -import {makeAutoObservable, reaction} from "mobx"; -import {registrationStore} from "./store"; -import User05 from "../../src/images/user-28-05.jpg"; -import User08 from "../../src/images/user-28-08.jpg"; -import User09 from "../../src/images/user-28-09.jpg"; -import User06 from "../../src/images/user-28-06.jpg"; - -const labelMap = { - firstname: 'First name', - secondname: 'Second name', - gender: "Gender", - birthdate: "Birthdate" -}; - -const usersImages = [User08,User06,User05,User09]; - -class TransactionsStore { - _transactionsData = []; - - constructor() { - makeAutoObservable(this) - - reaction(() => ({data: registrationStore.transactionsInfo}), ({data}) => { - this._transactionsData = data.data; - }) - } - - get transactionsData() { - return this._transactionsData.map(item=>{ - return { - id: item.id, - users_images: usersImages.map(image=>{ - return { - image: image, - size: 24 - } - }), - transaction: item.asset.features.map(asset=>{ - return { - transaction_id: item.id, - address: registrationStore.accountMadeTransaction, - value: asset.value, - label: labelMap[asset.label], - } - }) - } - }) - } -} - -export const transactionsStore = new TransactionsStore() diff --git a/src/store/userDataStore.js b/src/store/userDataStore.js deleted file mode 100644 index 265f8e3..0000000 --- a/src/store/userDataStore.js +++ /dev/null @@ -1,53 +0,0 @@ -import { cryptography } from "@liskhq/lisk-client"; -import { makeAutoObservable, reaction } from "mobx"; -import { registrationStore } from './store'; - -const labelMap = { - first_name: 'First name', - second_name: 'Second name', - gender: "Gender", - birthdate: "Birthdate", - place_of_birth: "Place of birth", - nationality: "Nationality", - national_id: "National ID", - national_doctype: "National doctype", - national_doc_id: "National doc ID", - national_doc_issue_date: "National doc issue date", - national_doc_expiry_date: "National doc expiry date", - telephone: "Telephone", - twitter: "Twitter", - facebook: "Facebook", - instagram: "Instagram", - youtube: "Youtube", - wechat: "Wechat", - tiktok: "Tiktok", - linkedin: "Linkedin", - vk: "Vk", - github: "Github", - telegram: "Telegram", - qq: "Qq", - snapchat: "Snapchat", - reddit: "Reddit" -}; - -class UserDataStore{ - _data = []; - - constructor() { - makeAutoObservable(this); - - reaction(() => ({data: registrationStore.userData}), ({data}) => { - this._data = data.data; - }) - } - get decryptedData(){ - return this._data.map((elem) => ({ - ...elem, - key: elem.label, - label: labelMap[elem.label], - value: cryptography.decryptMessageWithPassphrase(elem.value, elem.value_nonce, registrationStore.passPhrase, registrationStore.pubKey).split(':')[1] - })) - } -} - -export const userDataStore = new UserDataStore();