diff --git a/src/pages/digitalId/ProfileId.jsx b/src/pages/digitalId/ProfileId.jsx index 04cc9ce..b41d353 100644 --- a/src/pages/digitalId/ProfileId.jsx +++ b/src/pages/digitalId/ProfileId.jsx @@ -1,5 +1,8 @@ -import React, { useState } from 'react'; +import React, { useState, useEffect } from 'react'; +import { userDataStore } from '../../store/userDataStore'; +import { registrationStore } from '../../store/store'; import Sidebar from '../../partials/Sidebar'; +import { observer } from 'mobx-react-lite'; import Header from '../../partials/Header'; import ProfileTable from '../../partials/digitalId/ProfileTable'; import Image from '../../images/transactions-image-04.svg'; @@ -8,7 +11,7 @@ import Avatar01 from '../../images/avatar-01.jpg'; import Avatar02 from '../../images/avatar-02.jpg'; import Avatar03 from '../../images/avatar-03.jpg'; -function Profile () { +const Profile = observer (() => { const [sidebarOpen, setSidebarOpen] = useState(false); const [buttonPanelOpen, setButtonPanelOpen] = useState(true); const [removePanelOpen, setRemovePanelOpen] = useState(false); @@ -16,6 +19,10 @@ function Profile () { const [toggle, setToggle] = useState(true); const [addPanelOpen, setAddPanelOpen] = useState(false); const [selectedItems, setSelectedItems] = useState([]); + + /*useEffect(() => { + userDataStore.getUserData(); + }, []);*/ const defaultValues = { property: '', @@ -269,6 +276,15 @@ function Profile () { {/* Table */} + {/* Test user data */} +
+ {userDataStore.userData.map((elem, index) => ( +
+ {elem.label} + {elem.value.split(':')[1]} +
+ )) } +
{/* Left sidebar */}
@@ -470,6 +486,6 @@ function Profile () {
) -} +}) -export default Profile; \ No newline at end of file +export default Profile \ No newline at end of file diff --git a/src/store/store.js b/src/store/store.js index 80ebc8b..0528b0a 100644 --- a/src/store/store.js +++ b/src/store/store.js @@ -10,6 +10,8 @@ class Store { _nodeInfo = {} + _userData = {} + constructor() { makeAutoObservable(this); @@ -18,15 +20,18 @@ class Store { reaction(() => this.tokenKey, () => fetchWrapper.getAuth('http://3.125.47.101/api/data/account', { networkIdentifier: this.nodeInfo.networkIdentifier, lastBlockID: this.nodeInfo.lastBlockID - })) + }).then((res) => this.userInfoFetchChange(res))) }; fetchCreateNewAccount() { fetchWrapper.postAuth('http://3.125.47.101/api/data/account', { networkIdentifier: this.nodeInfo.networkIdentifier, lastBlockID: this.nodeInfo.lastBlockID - }, [...this.encryptAccountData]) - .catch(()=>{}) + }, [...this.encryptAccountData]).catch(()=>{}) + }; + + userInfoFetchChange(res) { + this._userData = res; } savePassPhrase(phrase) { @@ -51,6 +56,10 @@ class Store { console.log(err) } + get userData() { + return this._userData; + } + get passPhrase() { return 'rocket north inform swift improve fringe sweet crew client canyon bean autumn' } diff --git a/src/store/userDataStore.js b/src/store/userDataStore.js new file mode 100644 index 0000000..91cd9b5 --- /dev/null +++ b/src/store/userDataStore.js @@ -0,0 +1,24 @@ +import { cryptography } from "@liskhq/lisk-client"; +import { makeAutoObservable, reaction } from "mobx"; +import { registrationStore } from './store'; + +class UserDataStore{ + _data = [] + + constructor() { + makeAutoObservable(this); + + reaction(() => ({data: registrationStore.userData}), ({data}) => { + this._data = data.data; + }) + } + + get userData(){ + return this._data.map((elem) => ({ + ...elem, + value: cryptography.decryptMessageWithPassphrase(elem.value, elem.value_nonce, registrationStore.passPhrase, registrationStore.pubKey) + })) + } +} + +export const userDataStore = new UserDataStore(); \ No newline at end of file