From b9f795c0e411aad146acb9e0f2c8e590b50ac4f9 Mon Sep 17 00:00:00 2001 From: Daria Golova Date: Tue, 12 Jul 2022 16:56:44 +0300 Subject: [PATCH 1/2] done store for shared data --- src/pages/digitalId/Verify.jsx | 15 ++++++- src/store/sharedDataStore.js | 76 ++++++++++++++++++++++++++++++++++ src/store/store.js | 26 +++++++++++- 3 files changed, 113 insertions(+), 4 deletions(-) create mode 100644 src/store/sharedDataStore.js diff --git a/src/pages/digitalId/Verify.jsx b/src/pages/digitalId/Verify.jsx index 570cc64..ca305f5 100644 --- a/src/pages/digitalId/Verify.jsx +++ b/src/pages/digitalId/Verify.jsx @@ -1,11 +1,17 @@ -import React, { useState } from 'react'; +import React, { useState, useEffect } from 'react'; import Sidebar from '../../partials/Sidebar'; import Header from '../../partials/Header'; +import { sharedDataStore } from '../../store/sharedDataStore'; +import { observer } from 'mobx-react-lite'; -const Verify = (() => { +const Verify = observer(() => { const [sidebarOpen, setSidebarOpen] = useState(false); const [descriptionOpen, setDescriptionOpen] = useState(false); + /*useEffect(() => { + sharedDataStore.fetchSharedData(); + }, []);*/ + const verifiedData = [ { "date": "31.05.2022 10:48", @@ -160,6 +166,11 @@ const Verify = (() => { ))} + {sharedDataStore.decryptedData.map((elem, index) => ( +
+ {elem} +
+ ))} diff --git a/src/store/sharedDataStore.js b/src/store/sharedDataStore.js new file mode 100644 index 0000000..28a32c9 --- /dev/null +++ b/src/store/sharedDataStore.js @@ -0,0 +1,76 @@ +import { cryptography } from "@liskhq/lisk-client"; +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.map((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, + }); + console.log(this._sharedData); + } + + get sharedData() { + return this._sharedData; + } + + get decryptedData() { + return this._sharedData.map((elem) => + elem.data.map((item) => ({ + key: item.label, + label: labelMap[item.label], + value: cryptography.decryptMessageWithPassphrase(item.value, item.value_nonce, registrationStore.passPhrase, registrationStore.pubKey).split(':')[1] + }) + )) + } +} + +export const sharedDataStore = new SharedDataStore(); +console.log(sharedDataStore.sharedData); \ No newline at end of file diff --git a/src/store/store.js b/src/store/store.js index 92d8de7..816e876 100644 --- a/src/store/store.js +++ b/src/store/store.js @@ -12,14 +12,21 @@ class Store { _userData = {} + _keysArray = [] + constructor() { makeAutoObservable(this); this.fetchNodeInfo() - reaction(() => this.tokenKey, () => this.fetchNewAccountData()) + reaction(() => this.tokenKey, () => this.fetchData()) }; + fetchData() { + this.fetchNewAccountData(); + this.fetchLinksArray(); + } + fetchNewAccountData() { fetchWrapper.getAuth('http://3.125.47.101/api/data/private', { networkIdentifier: this.nodeInfo.networkIdentifier, @@ -35,12 +42,27 @@ class Store { .then(()=>this.fetchNewAccountData()) } + fetchLinksArray() { + fetchWrapper.getAuth('https://ccab53ea-d042-47b3-b9b4-79b913f47b3d.mock.pstmn.io/data/shared', { + networkIdentifier: this.nodeInfo.networkIdentifier, + lastBlockID: this.nodeInfo.lastBlockID + }).then((res) => this.keysArrayFetchChange(res)) + } + userDataFetchChange(res) { this._userData = res; } + keysArrayFetchChange(res) { + this._keysArray = res.data; + } + + get keysArray() { + return this._keysArray; + } + get userData() { - return this._userData + return this._userData; } savePassPhrase(phrase) { From 2eeb39abc916a3386858be4586dba4d282e8aa45 Mon Sep 17 00:00:00 2001 From: Daria Golova Date: Wed, 13 Jul 2022 14:45:17 +0300 Subject: [PATCH 2/2] rendered the data in the component --- src/pages/digitalId/Verify.jsx | 103 +++------------------------------ src/store/sharedDataStore.js | 28 +++------ src/store/store.js | 8 +-- 3 files changed, 21 insertions(+), 118 deletions(-) diff --git a/src/pages/digitalId/Verify.jsx b/src/pages/digitalId/Verify.jsx index ca305f5..1f5bb4b 100644 --- a/src/pages/digitalId/Verify.jsx +++ b/src/pages/digitalId/Verify.jsx @@ -1,4 +1,4 @@ -import React, { useState, useEffect } from 'react'; +import React, { useState } from 'react'; import Sidebar from '../../partials/Sidebar'; import Header from '../../partials/Header'; import { sharedDataStore } from '../../store/sharedDataStore'; @@ -8,82 +8,6 @@ const Verify = observer(() => { const [sidebarOpen, setSidebarOpen] = useState(false); const [descriptionOpen, setDescriptionOpen] = useState(false); - /*useEffect(() => { - sharedDataStore.fetchSharedData(); - }, []);*/ - - const verifiedData = [ - { - "date": "31.05.2022 10:48", - "fields": [ - { - "name": "Residence", - "value": "United Kindom", - "hash1": "7234ABC3423423523457234ABC34234", - "hash2": "7234ABC3423423523457234ABC34234" - }, - { - "name": "Document ID", - "value": "A1321313", - "hash1": "7234ABC3423423523457234ABC34234", - "hash2": "7234ABC3423423523457234ABC34234" - }, - { - "name": 'Document ID', - "value": 'A3451313', - "hash1": '9584ABC3423423523457234ABC34234', - "hash2": '9584ABC3423423523457234ABC34234' - } - ] - }, - { - "date": "31.05.2022 10:48", - "fields": [ - { - "name": 'Residence', - "value": 'Holland', - "hash1": '1024ABC3423423523457234ABC34234', - "hash2": '1024ABC3423423523457234ABC34234' - }, - { - "name": 'Document ID', - "value": 'B3451313', - "hash1": '7893ABC3423423523457234ABC34234', - "hash2": '7893ABC3423423523457234ABC34234' - }, - { - "name": 'Document ID', - "value": 'A3451313', - "hash1": '7286ABC3423423523457234ABC34234', - "hash2": '7286ABC3423423523457234ABC34234' - }, - ] - }, - { - "date": "31.05.2022 10:48", - "fields": [ - { - "name": 'Residence', - "value": 'China', - "hash1": '0000ABC3423423523457234ABC34234', - "hash2": '0000ABC3423423523457234ABC34234' - }, - { - "name": 'Document ID', - "value": 'C3451313', - "hash1": '1230ABC3423423523457234ABC34234', - "hash2": '1230ABC3423423523457234ABC34234' - }, - { - "name": 'Document ID', - "value": 'D3451313', - "hash1": '4483ABC3423423523457234ABC34234', - "hash2": '4483ABC3423423523457234ABC34234' - }, - ] - } - ]; - return (
{/* Sidebar */} @@ -118,13 +42,10 @@ const Verify = observer(() => {
{/* Block */}
- {verifiedData.map((item, index) => ( + {sharedDataStore.sharedData.map((item, index) => (
{/* Header */} -
- - Yesterday at {item.date.slice(-5)} AM - +
{/* Buttons */}
@@ -137,9 +58,8 @@ const Verify = observer(() => {
{/* Content */}
- {item.fields.map((elem, index) => ( + {item.data.map((elem, index) => (
- {elem.value} - {elem.hash1} - {elem.hash2} + {elem.label} + {elem.value}
- {elem.name}
))} @@ -166,11 +84,6 @@ const Verify = observer(() => {
))}
- {sharedDataStore.decryptedData.map((elem, index) => ( -
- {elem} -
- ))}
diff --git a/src/store/sharedDataStore.js b/src/store/sharedDataStore.js index 28a32c9..b60ece3 100644 --- a/src/store/sharedDataStore.js +++ b/src/store/sharedDataStore.js @@ -1,4 +1,3 @@ -import { cryptography } from "@liskhq/lisk-client"; import { makeAutoObservable, reaction } from "mobx"; import { fetchWrapper } from "../shared/fetchWrapper"; import { registrationStore } from './store'; @@ -45,32 +44,23 @@ class SharedDataStore{ } fetchSharedData() { - this._keysArray.map((elem) => { - fetchWrapper.get(`http://3.125.47.101/api/data/shared/${elem}`).then((res) => this.changeSharedData(res)); - }) + 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, - }); - console.log(this._sharedData); + }) } get sharedData() { - return this._sharedData; - } - - get decryptedData() { - return this._sharedData.map((elem) => - elem.data.map((item) => ({ - key: item.label, + return this._sharedData.map(elem => ({ + data: elem.data.map(item => ({ label: labelMap[item.label], - value: cryptography.decryptMessageWithPassphrase(item.value, item.value_nonce, registrationStore.passPhrase, registrationStore.pubKey).split(':')[1] - }) - )) - } + value: item.value, + })) + })); + }; } -export const sharedDataStore = new SharedDataStore(); -console.log(sharedDataStore.sharedData); \ No newline at end of file +export const sharedDataStore = new SharedDataStore(); \ No newline at end of file diff --git a/src/store/store.js b/src/store/store.js index 816e876..aeb9f23 100644 --- a/src/store/store.js +++ b/src/store/store.js @@ -19,12 +19,12 @@ class Store { this.fetchNodeInfo() - reaction(() => this.tokenKey, () => this.fetchData()) + reaction(() => this.tokenKey, () => this.getData()) }; - fetchData() { + getData() { this.fetchNewAccountData(); - this.fetchLinksArray(); + this.fetchKeysArray(); } fetchNewAccountData() { @@ -42,7 +42,7 @@ class Store { .then(()=>this.fetchNewAccountData()) } - fetchLinksArray() { + fetchKeysArray() { fetchWrapper.getAuth('https://ccab53ea-d042-47b3-b9b4-79b913f47b3d.mock.pstmn.io/data/shared', { networkIdentifier: this.nodeInfo.networkIdentifier, lastBlockID: this.nodeInfo.lastBlockID