Skip to content

Commit 2f2cc18

Browse files
NebytNebyt
authored
Merge pull request #18 from Emurgo/denis/displaying-certs-in-tx
Denis/displaying certs in tx
2 parents 86d8056 + be769bf commit 2f2cc18

File tree

4 files changed

+150
-1
lines changed

4 files changed

+150
-1
lines changed

‎src/components/expandabablePanel.js‎

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
import React from 'react'
2+
import {useCollapse} from 'react-collapsed'
3+
4+
const ExpandablePanel = (props) => {
5+
const {getCollapseProps, getToggleProps, isExpanded} = useCollapse()
6+
const {title, innerInfo} = props
7+
return (
8+
<div className="border rounded-md bg-gray-700 border-gray-700 py-2 w-full" key={`expandablePanel`}>
9+
<div {...getToggleProps()}>
10+
<div>
11+
<span className="text-m">
12+
{title}&nbsp;
13+
{isExpanded ? (
14+
<svg
15+
xmlns="http://www.w3.org/2000/svg"
16+
width="16"
17+
height="16"
18+
viewBox="0 0 16 16"
19+
fill="none"
20+
stroke="currentColor"
21+
strokeWidth="2"
22+
strokeLinecap="round"
23+
strokeLinejoin="round"
24+
className="inline align-text-bottom feather feather-arrow-down"
25+
>
26+
<line x1="8" y1="3" x2="8" y2="12"></line>
27+
<polyline points="13 8 8 12 3 8"></polyline>
28+
</svg>
29+
) : (
30+
<svg
31+
xmlns="http://www.w3.org/2000/svg"
32+
width="16"
33+
height="16"
34+
viewBox="0 0 16 16"
35+
fill="none"
36+
stroke="currentColor"
37+
strokeWidth="2"
38+
strokeLinecap="round"
39+
strokeLinejoin="round"
40+
className="inline align-text-bottom feather feather-arrow-up"
41+
>
42+
<line x1="8" y1="3" x2="8" y2="13"></line>
43+
<polyline points="3 8 8 3 13 8"></polyline>
44+
</svg>
45+
)}
46+
</span>
47+
</div>
48+
</div>
49+
<div {...getCollapseProps()}>
50+
<div className="pt-1">
51+
<textarea
52+
className="w-full h-64 rounded bg-gray-900 text-white px-2 readonly"
53+
readOnly
54+
value={innerInfo}
55+
></textarea>
56+
</div>
57+
</div>
58+
</div>
59+
)
60+
}
61+
62+
export default ExpandablePanel

‎src/components/tabs/subtabs/certificatesInTxPart.js‎

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
import React from 'react'
2+
import {useCollapse} from 'react-collapsed'
3+
import ExpandablePanel from '../../expandabablePanel'
4+
5+
const CertificatesInTxPart = ({getters}) => {
6+
const {getCollapseProps, getToggleProps, isExpanded} = useCollapse()
7+
const {certsInTx, votesInTx} = getters
8+
const amountOfCertsAndVotesInTx = () => certsInTx.length + votesInTx.length
9+
const getAllInOne = () => {
10+
const resultArray = []
11+
for (const certInTx of certsInTx) {
12+
const certPartWithName = certInTx.split('\n')[1]
13+
const cleanCertName = certPartWithName.split('"')[1]
14+
const certJsonObject = JSON.parse(certInTx)
15+
resultArray.push([cleanCertName, certJsonObject])
16+
}
17+
for (const voteInTx of votesInTx) {
18+
const votePartWithName = voteInTx.split('\n')[1]
19+
const cleanVoteName = votePartWithName.split('"')[1]
20+
const voteJsonObject = JSON.parse(voteInTx)
21+
resultArray.push([cleanVoteName, voteJsonObject])
22+
}
23+
return resultArray
24+
}
25+
26+
return (
27+
<div className="border rounded-md bg-gray-700 border-gray-700 px-5 py-2 mt-5">
28+
<div {...getToggleProps()}>
29+
<div>
30+
<span className="text-m">
31+
Certtificates in Tx {`(${amountOfCertsAndVotesInTx()})`}&nbsp;
32+
{isExpanded ? (
33+
<svg
34+
xmlns="http://www.w3.org/2000/svg"
35+
width="16"
36+
height="16"
37+
viewBox="0 0 16 16"
38+
fill="none"
39+
stroke="currentColor"
40+
strokeWidth="2"
41+
strokeLinecap="round"
42+
strokeLinejoin="round"
43+
className="inline align-text-bottom feather feather-arrow-down"
44+
>
45+
<line x1="8" y1="3" x2="8" y2="12"></line>
46+
<polyline points="13 8 8 12 3 8"></polyline>
47+
</svg>
48+
) : (
49+
<svg
50+
xmlns="http://www.w3.org/2000/svg"
51+
width="16"
52+
height="16"
53+
viewBox="0 0 16 16"
54+
fill="none"
55+
stroke="currentColor"
56+
strokeWidth="2"
57+
strokeLinecap="round"
58+
strokeLinejoin="round"
59+
className="inline align-text-bottom feather feather-arrow-up"
60+
>
61+
<line x1="8" y1="3" x2="8" y2="13"></line>
62+
<polyline points="3 8 8 3 13 8"></polyline>
63+
</svg>
64+
)}
65+
</span>
66+
</div>
67+
</div>
68+
<div {...getCollapseProps()}>
69+
<div>
70+
{getAllInOne().map((certInfo) => (
71+
<ExpandablePanel
72+
title={'-> ' + certInfo[0]}
73+
innerInfo={JSON.stringify(certInfo[1], null, 4)}
74+
/>
75+
))}
76+
</div>
77+
</div>
78+
</div>
79+
)
80+
}
81+
82+
export default CertificatesInTxPart

‎src/components/tabs/subtabs/cip95AdditionalPart.js‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import GovBasicFunctionsTab from './govBasicFunctionsTab'
55
import GovActionsTab from './govActionsTab'
66
import ConstitCommCertsTab from './constitCommCertsTab'
77
import Cip95BuildSignSubmitCard from '../../cards/cip95BuildSignSubmitCard'
8+
import CertificatesInTxPart from './certificatesInTxPart'
89

910
const Cip95AdditionalPart = ({api, wasm, onWaiting, onError, getters, setters}) => {
1011
const [certsInTx, setCertsInTx] = useState([])
@@ -94,6 +95,10 @@ const Cip95AdditionalPart = ({api, wasm, onWaiting, onError, getters, setters})
9495
getters={newGetters}
9596
setters={newSetters}
9697
/>
98+
{/* Here the expandable panel with tx certificates should be */}
99+
<div>
100+
<CertificatesInTxPart getters={getters}/>
101+
</div>
97102
<div className="block rounded-lg border mt-5 bg-gray-900 border-gray-700">
98103
<TabsComponent tabsData={data} />
99104
</div>

‎src/components/tabs/subtabs/infoPanel.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ const InfoPanel = ({getters}) => {
1919
const spanProperties = 'w-full break-words ' + textColor
2020

2121
return (
22-
<div className="block p-5 min-w-full rounded-lg border shadow-md bg-gray-900 border-gray-700">
22+
<div className="block p-5 min-w-full text-sm rounded-lg border shadow-md bg-gray-900 border-gray-700">
2323
<div className="grid justify-items-stretch grid-cols-1 lg:grid-cols-2 gap-2">
2424
<div>
2525
<span>Balance: </span>

0 commit comments

Comments
 (0)