Enable secret recovery request review

src/common/AccountInfo.test.tsx

@@ -3,7 +3,6 @@ import { UserIdentity as IdentityType, PostalAddress as PostalAddressType } from
 import { render } from "../tests";
 import { DEFAULT_IDENTITY, COLOR_THEME, DEFAULT_ADDRESS } from "./TestData";
 import AccountInfo from "./AccountInfo";
-import { TEST_WALLET_USER } from "../wallet-user/TestData";
 
 const DIFFERENT_IDENTITY: IdentityType = {
     firstName: "John2",
@@ -24,7 +23,6 @@ test("renders without comparison", () => {
     const tree = render(
         <AccountInfo
             label="some label"
-            address={ TEST_WALLET_USER.address }
             identity={ DEFAULT_IDENTITY }
             postalAddress={ DEFAULT_ADDRESS }
             colors={ COLOR_THEME.dashboard }
@@ -39,7 +37,6 @@ test("renders and compares with same data", () => {
     const tree = render(
         <AccountInfo
             label="some label"
-            address={ TEST_WALLET_USER.address }
             identity={ DEFAULT_IDENTITY }
             otherIdentity={ DEFAULT_IDENTITY }
             postalAddress={ DEFAULT_ADDRESS }
@@ -56,7 +53,6 @@ test("renders and compares with different data", () => {
     const tree = render(
         <AccountInfo
             label="some label"
-            address={ TEST_WALLET_USER.address }
             identity={ DEFAULT_IDENTITY }
             otherIdentity={ DIFFERENT_IDENTITY }
             postalAddress={ DEFAULT_ADDRESS }

src/common/AccountInfo.tsx

@@ -3,12 +3,10 @@ import { UserIdentity as IdentityType, PostalAddress as PostalAddressType } from
 import Identity from "./Identity";
 import PostalAddress from "./PostalAddress";
 import './AccountInfo.css';
-import ComparableField from "./ComparableField";
 import { BackgroundAndForegroundColors } from "./ColorTheme";
 
 export interface Props {
     label: string
-    address: string
     identity?: IdentityType
     postalAddress?: PostalAddressType
     otherIdentity?: IdentityType
@@ -21,15 +19,6 @@ export interface Props {
 export default function AccountInfo(props: Props) {
     return (
         <div className="AccountInfo">
-            <ComparableField
-                id="accountAddress"
-                label={ props.label }
-                data={ props }
-                field={ props => props.address }
-                colors={ props.colors }
-                squeeze={ props.squeeze }
-                noComparison={ true }
-            />
             <Identity
                 identity={ props.identity }
                 otherIdentity={ props.otherIdentity }

src/common/Model.tsx

@@ -1,23 +1,6 @@
-import { AxiosInstance } from 'axios';
-import { LocData, ProtectionRequest, ProtectionRequestStatus } from '@logion/client';
+import { LocData } from '@logion/client';
 import { ValidAccountId } from "@logion/node-api";
 
-export type ProtectionRequestKind = 'RECOVERY' | 'PROTECTION_ONLY' | 'ANY';
-
-export interface FetchProtectionRequestSpecification {
-    legalOfficerAddress?: string,
-    requesterAddress?: string,
-    kind?: ProtectionRequestKind,
-    statuses?: ProtectionRequestStatus[],
-}
-
-export async function fetchProtectionRequests(
-    axios: AxiosInstance,
-    specification: FetchProtectionRequestSpecification): Promise<ProtectionRequest[]> {
-    const response = await axios.put("/api/protection-request", specification);
-    return response.data.requests;
-}
-
 export function isGrantedAccess(address: ValidAccountId | undefined, loc: LocData): boolean {
     return loc.ownerAccountId.equals(address) || (loc.requesterAccountId?.equals(address) || false);
 }

src/common/Spacer.css

@@ -1,20 +1,12 @@
 .Spacer {
-    margin-left: -15px;
     position: absolute;
-    horiz-align: center;
     top: 50%;
     -ms-transform: translateY(-50%);
     transform: translateY(-50%);
 
-    width: 100%;
     justify-content: center;
     align-items: center;
 
-    display: -ms-flexbox;
-    display: -webkit-flex;
     display: flex;
-
-    -webkit-align-items: center;
-    -webkit-box-align: center;
 }
 

src/common/__snapshots__/AccountInfo.test.tsx.snap

@@ -4,49 +4,6 @@ exports[`renders and compares with different data 1`] = `
 <div
   className="AccountInfo"
 >
-  <div
-    className="ComparableField"
-  >
-    <div
-      className="FormGroup"
-      style={
-        Object {
-          "backgroundColor": "#eff3fe",
-        }
-      }
-    >
-      <style>
-
-    .FormGroup .form-control,
-    .FormGroup .form-control[readonly],
-    .FormGroup .input-group .btn-primary {
-        color: #000000;
-    }
-
-      </style>
-      <div
-        data-testid="accountAddressGroup"
-      >
-        <label
-          className="form-label"
-          htmlFor="accountAddress"
-        >
-          some label
-        </label>
-        <input
-          className="form-control"
-          data-testid="accountAddress"
-          id="accountAddress"
-          name="accountAddress"
-          onBlur={[Function]}
-          onChange={[Function]}
-          readOnly={true}
-          type="text"
-          value="vQxHAE33LeJYV69GCB4o4YcCgnDu8y99u5hy2751fRdxjX9kz"
-        />
-      </div>
-    </div>
-  </div>
   <div
     className="Identity"
   >
@@ -512,49 +469,6 @@ exports[`renders and compares with same data 1`] = `
 <div
   className="AccountInfo"
 >
-  <div
-    className="ComparableField"
-  >
-    <div
-      className="FormGroup"
-      style={
-        Object {
-          "backgroundColor": "#eff3fe",
-        }
-      }
-    >
-      <style>
-
-    .FormGroup .form-control,
-    .FormGroup .form-control[readonly],
-    .FormGroup .input-group .btn-primary {
-        color: #000000;
-    }
-
-      </style>
-      <div
-        data-testid="accountAddressGroup"
-      >
-        <label
-          className="form-label"
-          htmlFor="accountAddress"
-        >
-          some label
-        </label>
-        <input
-          className="form-control"
-          data-testid="accountAddress"
-          id="accountAddress"
-          name="accountAddress"
-          onBlur={[Function]}
-          onChange={[Function]}
-          readOnly={true}
-          type="text"
-          value="vQxHAE33LeJYV69GCB4o4YcCgnDu8y99u5hy2751fRdxjX9kz"
-        />
-      </div>
-    </div>
-  </div>
   <div
     className="Identity"
   >
@@ -1020,49 +934,6 @@ exports[`renders without comparison 1`] = `
 <div
   className="AccountInfo"
 >
-  <div
-    className="ComparableField"
-  >
-    <div
-      className="FormGroup"
-      style={
-        Object {
-          "backgroundColor": "#eff3fe",
-        }
-      }
-    >
-      <style>
-
-    .FormGroup .form-control,
-    .FormGroup .form-control[readonly],
-    .FormGroup .input-group .btn-primary {
-        color: #000000;
-    }
-
-      </style>
-      <div
-        data-testid="accountAddressGroup"
-      >
-        <label
-          className="form-label"
-          htmlFor="accountAddress"
-        >
-          some label
-        </label>
-        <input
-          className="form-control"
-          data-testid="accountAddress"
-          id="accountAddress"
-          name="accountAddress"
-          onBlur={[Function]}
-          onChange={[Function]}
-          readOnly={true}
-          type="text"
-          value="vQxHAE33LeJYV69GCB4o4YcCgnDu8y99u5hy2751fRdxjX9kz"
-        />
-      </div>
-    </div>
-  </div>
   <div
     className="Identity"
   >

src/legal-officer/LegalOfficerContext.tsx

@@ -5,18 +5,17 @@ import {
     LegalOfficer,
     LocsState,
     Votes,
-    ProtectionRequest,
 } from '@logion/client';
 import { LocType, LegalOfficerData, ValidAccountId } from "@logion/node-api";
 
-import { fetchProtectionRequests } from '../common/Model';
 import { useCommonContext } from '../common/CommonContext';
 import { LIGHT_MODE } from './Types';
 import { useLogionChain } from '../logion-chain';
 import { VaultApi } from '../vault/VaultApi';
 import { DateTime } from "luxon";
 import { fetchAllLocsParams } from 'src/loc/LegalOfficerLocContext';
 import { Locs, getLocsMap } from 'src/loc/Locs';
+import { RecoveryRequest, fetchRecoveryRequests } from './Model';
 
 export const SETTINGS_KEYS = [ 'oath' ];
 
@@ -36,13 +35,10 @@ export interface MissingSettings {
 }
 
 export interface LegalOfficerContext {
-    refreshRequests: ((clearBeforeRefresh: boolean) => void),
-    locsState: LocsState | null,
-    pendingProtectionRequests: ProtectionRequest[] | null,
-    activatedProtectionRequests: ProtectionRequest[] | null,
-    protectionRequestsHistory: ProtectionRequest[] | null,
-    pendingRecoveryRequests: ProtectionRequest[] | null,
-    recoveryRequestsHistory: ProtectionRequest[] | null,
+    refreshRequests: ((clearBeforeRefresh: boolean) => void);
+    locsState: LocsState | null;
+    pendingRecoveryRequests: RecoveryRequest[] | null;
+    recoveryRequestsHistory: RecoveryRequest[] | null;
     axios?: AxiosInstance;
     pendingVaultTransferRequests?: VaultTransferRequest[];
     vaultTransferRequestsHistory?: VaultTransferRequest[];
@@ -76,9 +72,6 @@ function initialContextValue(): FullLegalOfficerContext {
         dataAddress: null,
         refreshRequests: DEFAULT_NOOP,
         locsState: null,
-        pendingProtectionRequests: null,
-        activatedProtectionRequests: null,
-        protectionRequestsHistory: null,
         pendingRecoveryRequests: null,
         recoveryRequestsHistory: null,
         updateSetting: () => Promise.reject(),
@@ -134,11 +127,8 @@ interface Action {
     type: ActionType;
     dataAddress?: ValidAccountId;
     locsState?: LocsState;
-    pendingProtectionRequests?: ProtectionRequest[];
-    protectionRequestsHistory?: ProtectionRequest[];
-    activatedProtectionRequests?: ProtectionRequest[];
-    pendingRecoveryRequests?: ProtectionRequest[],
-    recoveryRequestsHistory?: ProtectionRequest[],
+    pendingRecoveryRequests?: RecoveryRequest[],
+    recoveryRequestsHistory?: RecoveryRequest[],
     refreshRequests?: (clearBeforeRefresh: boolean) => void;
     clearBeforeRefresh?: boolean;
     axios?: AxiosInstance;
@@ -203,9 +193,6 @@ const reducer: Reducer<FullLegalOfficerContext, Action> = (state: FullLegalOffic
             if(action.dataAddress === state.dataAddress) {
                 return {
                     ...state,
-                    pendingProtectionRequests: action.pendingProtectionRequests!,
-                    protectionRequestsHistory: action.protectionRequestsHistory!,
-                    activatedProtectionRequests: action.activatedProtectionRequests!,
                     pendingRecoveryRequests: action.pendingRecoveryRequests!,
                     recoveryRequestsHistory: action.recoveryRequestsHistory!,
                     pendingVaultTransferRequests: action.pendingVaultTransferRequests!,
@@ -506,20 +493,15 @@ export function LegalOfficerContextProvider(props: Props) {
             (async function() {
                 const axios = axiosFactory(currentAddress);
 
-                const allRequests = await fetchProtectionRequests(axios, {
-                    legalOfficerAddress: currentAddress.address,
-                });
-                const pendingProtectionRequests = allRequests.filter(request => ["PENDING"].includes(request.status) && !request.isRecovery);
-                const activatedProtectionRequests = allRequests.filter(request => ["ACTIVATED"].includes(request.status));
-                const pendingRecoveryRequests = allRequests.filter(request => ["PENDING"].includes(request.status) && request.isRecovery);
-                const protectionRequestsHistory = allRequests.filter(request =>
-                    ["ACCEPTED", "REJECTED", "ACTIVATED", "CANCELLED", "REJECTED_CANCELLED", "ACCEPTED_CANCELLED"].includes(request.status)
-                    && !request.isRecovery
-                );
-                const recoveryRequestsHistory = allRequests.filter(request =>
-                    ["ACCEPTED", "REJECTED", "ACTIVATED", "CANCELLED", "REJECTED_CANCELLED", "ACCEPTED_CANCELLED"].includes(request.status)
-                    && request.isRecovery
-                );
+                const allAccountRecoveryRequests = await fetchRecoveryRequests(axios);
+                const pendingRecoveryRequests: RecoveryRequest[] = allAccountRecoveryRequests
+                    .filter(request => ["PENDING"].includes(request.status))
+                    .sort((a, b) => a.createdOn.localeCompare(b.createdOn));
+                const recoveryRequestsHistory: RecoveryRequest[] = allAccountRecoveryRequests
+                    .filter(request =>
+                        ["ACCEPTED", "REJECTED", "ACTIVATED", "CANCELLED", "REJECTED_CANCELLED", "ACCEPTED_CANCELLED"].includes(request.status)
+                    )
+                    .sort((a, b) => b.createdOn.localeCompare(a.createdOn));
 
                 const allVaultTransferRequestsResult = (await new VaultApi(axios, currentAddress).getVaultTransferRequests({
                     legalOfficerAddress: currentAddress.address,
@@ -532,9 +514,6 @@ export function LegalOfficerContextProvider(props: Props) {
                 dispatch({
                     type: "SET_REQUESTS_DATA",
                     dataAddress: currentAddress,
-                    pendingProtectionRequests,
-                    activatedProtectionRequests,
-                    protectionRequestsHistory,
                     pendingRecoveryRequests,
                     recoveryRequestsHistory,
                     pendingVaultTransferRequests,

src/legal-officer/LegalOfficerPaths.tsx

@@ -7,16 +7,19 @@ import {
     LOC_REQUESTS_RELATIVE_PATH,
     LOC_DETAILS_RELATIVE_PATH,
 } from '../RootPaths';
+import { RecoveryRequestType } from './Model';
 
 export const HOME_PATH = LEGAL_OFFICER_PATH;
 
 export const RECOVERY_REQUESTS_RELATIVE_PATH = '/recovery';
 export const RECOVERY_REQUESTS_PATH = LEGAL_OFFICER_PATH + RECOVERY_REQUESTS_RELATIVE_PATH;
 
-export const RECOVERY_DETAILS_RELATIVE_PATH = '/recovery-details/:requestId';
+export const RECOVERY_DETAILS_RELATIVE_PATH = RECOVERY_REQUESTS_RELATIVE_PATH + '/:requestId/:type';
 export const RECOVERY_DETAILS_PATH = LEGAL_OFFICER_PATH + RECOVERY_DETAILS_RELATIVE_PATH;
-export function recoveryDetailsPath(requestId: string): string {
-    return RECOVERY_DETAILS_PATH.replace(":requestId", requestId);
+export function recoveryDetailsPath(requestId: string, type: RecoveryRequestType): string {
+    return RECOVERY_DETAILS_PATH
+        .replace(":requestId", requestId)
+        .replace(":type", type);
 }
 
 export const SETTINGS_RELATIVE_PATH = '/settings';