Merge pull request #571 from logion-network/feature/manage-secrets

Manage secrets

package.json

@@ -10,7 +10,7 @@
   "license": "Apache-2.0",
   "dependencies": {
     "@creativecommons/cc-assets": "^0.1.0",
-    "@logion/client": "^0.45.0-2",
+    "@logion/client": "^0.45.0-7",
     "@logion/client-browser": "^0.3.5",
     "@logion/crossmint": "^0.1.32",
     "@logion/extension": "^0.8.1-1",

src/__mocks__/@logion/client.ts

@@ -16,6 +16,7 @@ import {
     LocsState,
     HashOrContent,
     ClosedLoc,
+    ClosedIdentityLoc,
     ReadOnlyLocState,
     PendingRequest,
 } from '../LogionClientMock';
@@ -39,6 +40,7 @@ export {
     LocsState,
     HashOrContent,
     ClosedLoc,
+    ClosedIdentityLoc,
     ReadOnlyLocState,
     isTokenCompatibleWith,
     LegalOfficerClass,

src/__mocks__/LogionClientMock.ts

@@ -146,6 +146,15 @@ export class ClosedLoc extends LocRequestState {
     };
 }
 
+export class ClosedIdentityLoc extends LocRequestState {
+
+    legalOfficer: {
+        requestVote: any,
+    } = {
+        requestVote: jest.fn(),
+    };
+}
+
 export class EditableRequest extends LocRequestState {
     addMetadata: jest.Mock<Promise<EditableRequest>> | undefined;
     deleteMetadata: jest.Mock<Promise<EditableRequest>> | undefined;

src/components/toggle/Checkbox.tsx

@@ -1,8 +1,9 @@
 import './Checkbox.css';
 import './Toggle.css';
+import './Eye.css';
 import { customClassName } from "../../common/types/Helpers";
 
-export type Skin = "Checkbox" | "Toggle white" | "Toggle black";
+export type Skin = "Checkbox" | "Toggle white" | "Toggle black" | "Eye";
 
 export interface Props {
     checked: boolean;

src/components/toggle/Eye.css

@@ -0,0 +1,34 @@
+.Eye {
+    content: " ";
+    position: relative;
+    height: 37px;
+    width: 50px;
+}
+
+.Eye.clickable {
+    cursor: pointer;
+}
+
+.Eye.checked:after {
+    background-image: url("../../img/eye.svg");
+}
+.Eye:not(.checked):after {
+    background-image: url("../../img/eye-closed.svg");
+}
+
+.Eye:after {
+    content: " ";
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 100%;
+    width: 100%;
+    background-repeat: no-repeat;
+    background-position: center;
+}
+
+.Eye.disabled,
+.Eye.clickable.disabled {
+    cursor: default;
+    opacity: 0.5;
+}

src/loc/CertificateAndDetailsButtons.tsx

@@ -27,6 +27,7 @@ import ViewQrCodeButton from './ViewQrCodeButton';
 import ViewCertificateButton from './ViewCertificateButton';
 import InvitedContributorsButton from "./invited-contributor/InvitedContributorsButton";
 import { CollectionLimits, DEFAULT_LIMITS } from "./CollectionLimitsForm";
+import SecretsButton from "./secrets/SecretsButton";
 
 export interface Props {
     loc: LocData;
@@ -87,7 +88,7 @@ export default function CertificateAndDetailsButtons(props: Props) {
                             { loc.locType === 'Identity' && props.viewer === 'LegalOfficer' && !isLogionIdentityLoc({ ...loc, requesterAddress: loc.requesterAccountId?.address }) && loc.requesterAccountId?.type === "Polkadot" && loc.status ==='CLOSED' && !props.isReadOnly && <Nominate/> }
 
                             { loc.locType === 'Identity' && !isLogionIdentityLoc({ ...loc, requesterAddress: loc.requesterAccountId?.address }) && props.viewer === 'LegalOfficer' && loc.status === "CLOSED" && hasVoteFeature && !loc.voteId && !props.isReadOnly && <RequestVoteButton/> }
-
+                            { loc.locType === 'Identity' && props.viewer === 'User' && loc.status === "CLOSED" && <SecretsButton /> }
                             { loc.locType === 'Collection' && props.viewer === 'LegalOfficer' && <ArchiveButton/> }
                             { loc.locType !== 'Collection' && props.viewer === 'LegalOfficer' && !props.isReadOnly && <ArchiveButton/> }
 

src/loc/RequestVoteButton.test.tsx

@@ -1,7 +1,7 @@
 import { render, screen, waitFor } from "@testing-library/react";
 import { clickByName } from "src/tests";
 import RequestVoteButton from "./RequestVoteButton";
-import { ClosedLoc } from "src/__mocks__/@logion/client";
+import { ClosedIdentityLoc } from "src/__mocks__/@logion/client";
 import { setLocState } from "./__mocks__/LocContextMock";
 import { FAILED_SUBMISSION, NO_SUBMISSION, SUCCESSFUL_SUBMISSION, setExtrinsicSubmissionState } from "src/logion-chain/__mocks__/LogionChainMock";
 import { expectSubmitting } from "src/test/Util";
@@ -12,7 +12,7 @@ jest.mock("../logion-chain");
 describe("RequestVoteButton", () => {
 
     it("submits vote", async () => {
-        const locState = new ClosedLoc();
+        const locState = new ClosedIdentityLoc();
         setLocState(locState);
         locState.legalOfficer.requestVote = async (params: any) => {
             return VOTE_ID;
@@ -25,7 +25,7 @@ describe("RequestVoteButton", () => {
     });
 
     it("successfully creates a vote", async () => {
-        const locState = new ClosedLoc();
+        const locState = new ClosedIdentityLoc();
         setLocState(locState);
         locState.legalOfficer.requestVote = async (params: any) => {
             return VOTE_ID;
@@ -39,7 +39,7 @@ describe("RequestVoteButton", () => {
     });
 
     it("shows error on failure", async () => {
-        const locState = new ClosedLoc();
+        const locState = new ClosedIdentityLoc();
         setLocState(locState);
         locState.legalOfficer.requestVote = async () => {};
         setExtrinsicSubmissionState(FAILED_SUBMISSION);

src/loc/RequestVoteButton.tsx

@@ -1,4 +1,4 @@
-import { ClosedLoc } from "@logion/client";
+import { ClosedIdentityLoc } from "@logion/client";
 import { useCallback, useState } from "react";
 import ClientExtrinsicSubmitter, { Call, CallCallback } from "src/ClientExtrinsicSubmitter";
 import Button from "src/common/Button";
@@ -18,7 +18,7 @@ export default function RequestVoteButton() {
     const [ submissionFailed, setSubmissionFailed ] = useState<boolean>(false);
 
     const requestVoteCallback = useCallback(async (callback: CallCallback) => {
-        if(signer && (locState instanceof ClosedLoc)) {
+        if(signer && (locState instanceof ClosedIdentityLoc)) {
             const requestedVoteId = await locState.legalOfficer.requestVote({
                 callback,
                 signer,

src/loc/TestData.ts

@@ -48,6 +48,7 @@ export function buildLocRequest(locId: UUID, loc: LegalOfficerCase): LocData {
             legalFee: loc.legalFee,
             collectionItemFee: loc.collectionItemFee,
             tokensRecordFee: loc.tokensRecordFee,
-        }
+        },
+        secrets: [],
     };
 }

src/loc/__snapshots__/ContextualizedLocDetails.test.tsx.snap

@@ -60,6 +60,7 @@ exports[`ContextualizedLocDetails renders 1`] = `
         },
       },
       "requesterLocId": undefined,
+      "secrets": Array [],
       "status": "OPEN",
       "verifiedIssuer": false,
     }
@@ -124,6 +125,7 @@ exports[`ContextualizedLocDetails renders 1`] = `
           },
         },
         "requesterLocId": undefined,
+        "secrets": Array [],
         "status": "OPEN",
         "verifiedIssuer": false,
       }
@@ -199,6 +201,7 @@ exports[`ContextualizedLocDetails renders 1`] = `
           },
         },
         "requesterLocId": undefined,
+        "secrets": Array [],
         "status": "OPEN",
         "verifiedIssuer": false,
       }
@@ -271,6 +274,7 @@ exports[`ContextualizedLocDetails renders 1`] = `
           },
         },
         "requesterLocId": undefined,
+        "secrets": Array [],
         "status": "OPEN",
         "verifiedIssuer": false,
       }
@@ -336,6 +340,7 @@ exports[`ContextualizedLocDetails renders 1`] = `
           },
         },
         "requesterLocId": undefined,
+        "secrets": Array [],
         "status": "OPEN",
         "verifiedIssuer": false,
       }
@@ -401,6 +406,7 @@ exports[`ContextualizedLocDetails renders 1`] = `
           },
         },
         "requesterLocId": undefined,
+        "secrets": Array [],
         "status": "OPEN",
         "verifiedIssuer": false,
       }
@@ -473,6 +479,7 @@ exports[`ContextualizedLocDetails renders 1`] = `
             },
           },
           "requesterLocId": undefined,
+          "secrets": Array [],
           "status": "OPEN",
           "verifiedIssuer": false,
         }

src/loc/__snapshots__/UserContextualizedLocDetails.test.tsx.snap

@@ -61,6 +61,7 @@ exports[`UserContextualizedLocDetails renders for requester 1`] = `
         },
       },
       "requesterLocId": undefined,
+      "secrets": Array [],
       "status": "OPEN",
       "verifiedIssuer": false,
     }
@@ -160,6 +161,7 @@ exports[`UserContextualizedLocDetails renders for requester 1`] = `
           },
         },
         "requesterLocId": undefined,
+        "secrets": Array [],
         "status": "OPEN",
         "verifiedIssuer": false,
       }
@@ -229,6 +231,7 @@ exports[`UserContextualizedLocDetails renders for requester 1`] = `
             },
           },
           "requesterLocId": undefined,
+          "secrets": Array [],
           "status": "OPEN",
           "verifiedIssuer": false,
         }
@@ -295,6 +298,7 @@ exports[`UserContextualizedLocDetails renders for requester 1`] = `
             },
           },
           "requesterLocId": undefined,
+          "secrets": Array [],
           "status": "OPEN",
           "verifiedIssuer": false,
         }
@@ -361,6 +365,7 @@ exports[`UserContextualizedLocDetails renders for requester 1`] = `
             },
           },
           "requesterLocId": undefined,
+          "secrets": Array [],
           "status": "OPEN",
           "verifiedIssuer": false,
         }
@@ -426,6 +431,7 @@ exports[`UserContextualizedLocDetails renders for requester 1`] = `
             },
           },
           "requesterLocId": undefined,
+          "secrets": Array [],
           "status": "OPEN",
           "verifiedIssuer": false,
         }
@@ -501,6 +507,7 @@ exports[`UserContextualizedLocDetails renders for verified issuer 1`] = `
         },
       },
       "requesterLocId": undefined,
+      "secrets": Array [],
       "status": "OPEN",
       "verifiedIssuer": false,
     }
@@ -601,6 +608,7 @@ exports[`UserContextualizedLocDetails renders for verified issuer 1`] = `
           },
         },
         "requesterLocId": undefined,
+        "secrets": Array [],
         "status": "OPEN",
         "verifiedIssuer": false,
       }
@@ -670,6 +678,7 @@ exports[`UserContextualizedLocDetails renders for verified issuer 1`] = `
             },
           },
           "requesterLocId": undefined,
+          "secrets": Array [],
           "status": "OPEN",
           "verifiedIssuer": false,
         }
@@ -736,6 +745,7 @@ exports[`UserContextualizedLocDetails renders for verified issuer 1`] = `
             },
           },
           "requesterLocId": undefined,
+          "secrets": Array [],
           "status": "OPEN",
           "verifiedIssuer": false,
         }
@@ -802,6 +812,7 @@ exports[`UserContextualizedLocDetails renders for verified issuer 1`] = `
             },
           },
           "requesterLocId": undefined,
+          "secrets": Array [],
           "status": "OPEN",
           "verifiedIssuer": false,
         }
@@ -867,6 +878,7 @@ exports[`UserContextualizedLocDetails renders for verified issuer 1`] = `
             },
           },
           "requesterLocId": undefined,
+          "secrets": Array [],
           "status": "OPEN",
           "verifiedIssuer": false,
         }

src/loc/issuer/Nominate.tsx

@@ -5,7 +5,7 @@ import Icon from "../../common/Icon";
 import Dialog from "../../common/Dialog";
 import { useLocContext } from "../LocContext";
 import { CallCallback, useLogionChain } from "../../logion-chain";
-import { ClosedLoc } from "@logion/client";
+import { ClosedIdentityLoc } from "@logion/client";
 import './Nominate.css';
 import ExtrinsicSubmissionStateView from "src/ExtrinsicSubmissionStateView";
 
@@ -26,7 +26,7 @@ export default function Nominate() {
     const changeIssuer = useCallback(async () => {
         setStatus('Confirming');
         const call = async (callback: CallCallback) => mutateLocState(async current => {
-            if(signer && current instanceof ClosedLoc) {
+            if(signer && current instanceof ClosedIdentityLoc) {
                 if(isIssuer) {
                     return current.legalOfficer.dismissIssuer({
                         signer,
@@ -36,7 +36,7 @@ export default function Nominate() {
                     return current.legalOfficer.nominateIssuer({
                         signer,
                         callback,
-                    });   
+                    });
                 }
             } else {
                 return current;