prevent duplicates

nym-wallet/src/pages/undelegate/UndelegateForm.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React from 'react';
 import { useForm, Controller } from 'react-hook-form';
 import {
   ListItem,
@@ -14,8 +14,8 @@ import {
 import { yupResolver } from '@hookform/resolvers/yup';
 import { format } from 'date-fns';
 import { validationSchema } from './validationSchema';
-import { EnumNodeType, Epoch, PendingUndelegate, TDelegation } from '../../types';
-import { getCurrentEpoch, undelegate, vestingUnelegateFromMixnode } from '../../requests';
+import { EnumNodeType, PendingUndelegate, TDelegation } from '../../types';
+import { undelegate, vestingUnelegateFromMixnode } from '../../requests';
 import { Fee } from '../../components';
 
 type TFormData = {
@@ -31,11 +31,13 @@ const defaultValues = {
 export const UndelegateForm = ({
   delegations,
   pendingUndelegations,
+  currentEndEpoch,
   onError,
   onSuccess,
 }: {
   delegations?: TDelegation[];
   pendingUndelegations?: PendingUndelegate[];
+  currentEndEpoch?: BigInt;
   onError: (message?: string) => void;
   onSuccess: (message?: string) => void;
 }) => {
@@ -49,15 +51,6 @@ export const UndelegateForm = ({
     resolver: yupResolver(validationSchema),
   });
 
-  const [currentEndEpoch, setCurrentEndEpoch] = useState<Epoch['end']>();
-
-  useEffect(() => {
-    (async () => {
-      const epoch = await getCurrentEpoch();
-      setCurrentEndEpoch(epoch.end);
-    })();
-  }, []);
-
   const onSubmit = async (data: TFormData) => {
     let res;
     try {

nym-wallet/src/pages/undelegate/index.tsx

@@ -3,9 +3,10 @@ import { Alert, AlertTitle, Box, Button, CircularProgress } from '@mui/material'
 import { EnumRequestStatus, NymCard, RequestStatus } from '../../components';
 import { UndelegateForm } from './UndelegateForm';
 import { getCurrentEpoch, getPendingDelegations, getReverseMixDelegations } from '../../requests';
-import { PendingUndelegate, TPagedDelegations } from '../../types';
+import { Epoch, PendingUndelegate, TPagedDelegations } from '../../types';
 import { ClientContext } from '../../context/main';
 import { PageLayout } from '../../layouts';
+import { removeObjectDuplicates } from '../../utils';
 
 export const Undelegate = () => {
   const [message, setMessage] = useState<string>();
@@ -13,6 +14,7 @@ export const Undelegate = () => {
   const [isLoading, setIsLoading] = useState(true);
   const [pagedDelegations, setPagesDelegations] = useState<TPagedDelegations>();
   const [pendingUndelegations, setPendingUndelegations] = useState<PendingUndelegate[]>();
+  const [currentEndEpoch, setCurrentEndEpoch] = useState<Epoch['end']>();
 
   const { clientDetails } = useContext(ClientContext);
 
@@ -23,14 +25,17 @@ export const Undelegate = () => {
     try {
       const mixnodeDelegations = await getReverseMixDelegations();
       const pendingEvents = await getPendingDelegations();
-      await getCurrentEpoch();
-
       const pendingUndelegationEvents = pendingEvents
         .filter((evt): evt is { Undelegate: PendingUndelegate } => 'Undelegate' in evt)
         .map((e) => ({ ...e.Undelegate }));
+      const epoch = await getCurrentEpoch();
 
+      setCurrentEndEpoch(epoch.end);
       setPendingUndelegations(pendingUndelegationEvents);
-      setPagesDelegations(mixnodeDelegations);
+      setPagesDelegations({
+        ...mixnodeDelegations,
+        delegations: removeObjectDuplicates(mixnodeDelegations.delegations, 'node_identity'),
+      });
     } catch (e) {
       setStatus(EnumRequestStatus.error);
       setMessage(e as string);
@@ -62,6 +67,7 @@ export const Undelegate = () => {
             <UndelegateForm
               delegations={pagedDelegations?.delegations}
               pendingUndelegations={pendingUndelegations}
+              currentEndEpoch={currentEndEpoch}
               onError={(m) => {
                 setMessage(m);
                 setStatus(EnumRequestStatus.error);

nym-wallet/src/utils/index.ts

@@ -146,3 +146,7 @@ export const splice = (start: number, deleteCount: number, address?: string): st
 export const maximizeWindow = async () => {
   await appWindow.maximize();
 };
+
+export function removeObjectDuplicates<T extends object, K extends keyof T>(arr: T[], id: K) {
+  return arr.filter((v, i, a) => a.findIndex((v2) => v2[id] === v[id]) === i);
+}