patch identity issue

packages/apps/src/WarmUp.tsx

@@ -7,7 +7,8 @@ import { useApi, useCall } from '@polkadot/react-hooks';
 
 function WarmUp (): React.ReactElement {
   const { api, isApiReady } = useApi();
-  const indexes = useCall<unknown>(isApiReady && api.derive.accounts?.indexes);
+  // TODO: FixMe
+  const indexes = useCall<unknown>(isApiReady && api.query.identity?.indexes);
   const registrars = useCall<unknown>(isApiReady && api.query.identity?.registrars);
   const issuance = useCall<unknown>(isApiReady && api.query.balances?.totalIssuance);
   const [hasValues, setHasValues] = useState(false);

packages/page-addresses/src/modals/Create.tsx

@@ -8,7 +8,7 @@ import type { ModalProps as Props } from '../types.js';
 import React, { useCallback, useState } from 'react';
 
 import { AddressRow, Button, Input, InputAddress, Modal } from '@polkadot/react-components';
-import { useApi, useCall } from '@polkadot/react-hooks';
+import { useAccountInfo2, useApi, useCall } from '@polkadot/react-hooks';
 import { keyring } from '@polkadot/ui-keyring';
 import { hexToU8a } from '@polkadot/util';
 import { ethereumEncode } from '@polkadot/util-crypto';
@@ -33,7 +33,8 @@ function Create ({ onClose, onStatusChange }: Props): React.ReactElement<Props>
   const { api, isEthereum } = useApi();
   const [{ isNameValid, name }, setName] = useState<NameState>({ isNameValid: false, name: '' });
   const [{ address, addressInput, isAddressExisting, isAddressValid }, setAddress] = useState<AddrState>({ address: '', addressInput: '', isAddressExisting: false, isAddressValid: false, isPublicKey: false });
-  const info = useCall<DeriveAccountInfo>(!!address && isAddressValid && api.derive.accounts.info, [address]);
+  const info = useAccountInfo2(api, address);
+
   const isValid = (isAddressValid && isNameValid) && !!info?.accountId;
 
   const _onChangeAddress = useCallback(

packages/page-staking/src/useIdentities.ts

@@ -22,7 +22,7 @@ const OPT_CALL = {
 
 function useIdentitiesImpl (validatorIds: string[] = []): Result | undefined {
   const { api } = useApi();
-  const allIdentity = useCall<Result>(api.derive.accounts.hasIdentityMulti, [validatorIds], OPT_CALL);
+  const allIdentity = undefined//useCall<Result>(api.derive.accounts.hasIdentityMulti, [validatorIds], OPT_CALL);
 
   return allIdentity;
 }

packages/page-staking/src/useSortedTargets.ts

@@ -346,8 +346,8 @@ function useSortedTargetsImpl (favorites: string[], withLedger: boolean): Sorted
       _electedInfo.info.forEach((info, index) => {
         info.exposure = {
           others: currentNominators[String(info.accountId)],
-          own: overview[index].unwrap().own,
-          total: overview[index].unwrap().total
+          own: overview[index].isSome ? overview[index].unwrap().own : undefined,
+          total: overview[index].isSome ? overview[index].unwrap().total : undefined
         } as PalletStakingExposure;
       });
       setElectedInfo(_electedInfo);

packages/react-components/src/AccountName.tsx

@@ -8,7 +8,7 @@ import type { AccountId, AccountIndex, Address } from '@polkadot/types/interface
 import React, { useCallback, useContext, useEffect, useState } from 'react';
 
 import { statics } from '@polkadot/react-api/statics';
-import { useDeriveAccountInfo, useSystemApi } from '@polkadot/react-hooks';
+import { useAccountInfo2, useDeriveAccountInfo, useSystemApi } from '@polkadot/react-hooks';
 import { AccountSidebarCtx } from '@polkadot/react-hooks/ctx/AccountSidebar';
 import { formatNumber, isCodec, isFunction, stringToU8a, u8aEmpty, u8aEq, u8aToBn } from '@polkadot/util';
 
@@ -158,8 +158,8 @@ function extractIdentity (address: string, identity: DeriveAccountRegistration):
   const isGood = judgements.some(([, judgement]) => judgement.isKnownGood || judgement.isReasonable);
   const isBad = judgements.some(([, judgement]) => judgement.isErroneous || judgement.isLowQuality);
   const displayName = isGood
-    ? identity.display
-    : (identity.display || '').replace(/[^\x20-\x7E]/g, '');
+    ? identity?.display
+    : (identity?.display || '').replace(/[^\x20-\x7E]/g, '');
   const displayParent = identity.displayParent && (
     isGood
       ? identity.displayParent
@@ -181,7 +181,7 @@ function extractIdentity (address: string, identity: DeriveAccountRegistration):
 
 function AccountName ({ children, className = '', defaultName, label, onClick, override, toggle, value, withSidebar }: Props): React.ReactElement<Props> {
   const api = useSystemApi();
-  const info = useDeriveAccountInfo(value);
+  const info = useAccountInfo2(api, value);
   const [name, setName] = useState<React.ReactNode>(() => extractName((value || '').toString(), undefined, defaultName));
   const toggleSidebar = useContext(AccountSidebarCtx);
 

packages/react-hooks/src/index.ts

@@ -8,6 +8,7 @@ export { createNamedHook } from './createNamedHook.js';
 export * from './ctx/index.js';
 export { useAccountId } from './useAccountId.js';
 export { useAccountInfo } from './useAccountInfo.js';
+export { default as useAccountInfo2 } from './useAccountInfo2.js';
 export { useAccounts } from './useAccounts.js';
 export { useAddresses } from './useAddresses.js';
 export { useApi } from './useApi.js';

packages/react-hooks/src/useAccountInfo2.ts

@@ -0,0 +1,93 @@
+// Copyright 2017-2024 @polkadot/react-hooks authors & contributors
+// SPDX-License-Identifier: Apache-2.0
+
+import type { ApiPromise } from '@polkadot/api';
+import type { DeriveAccountInfo } from '@polkadot/api-derive/types';
+import type { PalletIdentityRegistration } from '@polkadot/types/lookup';
+
+import { useCallback, useEffect, useState } from 'react';
+
+import { hexToString } from '@polkadot/util';
+
+interface SubIdentity {
+  parentAddress: string,
+  display: string
+}
+
+export default function useAccountInfo2 (api: ApiPromise | undefined, formatted: string | undefined, accountInfo?: DeriveAccountInfo): DeriveAccountInfo | undefined {
+  const [info, setInfo] = useState<DeriveAccountInfo | undefined>();
+
+  const getIdentityOf = useCallback(async (accountId: string) => {
+    if (!api?.query?.identity?.identityOf || !accountId) {
+      return;
+    }
+
+    const i = await api.query.identity.identityOf(accountId);
+    const id = i.isSome ? i.unwrap()[0] as PalletIdentityRegistration : undefined;
+
+    return id?.info
+      ? {
+        display: hexToString(id.info.display.asRaw.toHex()),
+        email: hexToString(id.info.email.asRaw.toHex()),
+        judgements: id.judgements,
+        legal: hexToString(id.info.legal.asRaw.toHex()),
+        riot: hexToString(id.info.riot.asRaw.toHex()),
+        twitter: hexToString(id.info.twitter.asRaw.toHex()),
+        web: hexToString(id.info.web.asRaw.toHex())
+      }
+      : undefined;
+  }, [api]);
+
+  const getSubIdentityOf = useCallback(async (): Promise<SubIdentity | undefined> => {
+    if (!api || !formatted) {
+      return;
+    }
+
+    const s = await api.query.identity.superOf(formatted);
+    const subId = s.isSome ? s.unwrap() : undefined;
+
+    return subId
+      ? {
+        display: hexToString(subId[1].asRaw.toHex()),
+        parentAddress: subId[0].toString()
+      }
+      : undefined;
+  }, [api, formatted]);
+
+  useEffect(() => {
+    if (accountInfo && accountInfo.accountId?.toString() === formatted) {
+      return setInfo(accountInfo);
+    }
+
+    api && formatted && getIdentityOf(formatted).then((identity) => {
+      if (identity) {
+        setInfo({
+          accountId: api.createType('AccountId', formatted),
+          identity
+        });
+      } else {
+        // check if it has subId
+        getSubIdentityOf().then((subId) => {
+          if (subId) {
+            getIdentityOf(subId.parentAddress).then((parentIdentity) => {
+              if (parentIdentity) {
+                const subIdentity = {
+                  accountId: api.createType('AccountId', formatted),
+                  identity: {
+                    ...parentIdentity,
+                    display: subId.display,
+                    displayParent: parentIdentity.display
+                  }
+                };
+
+                return setInfo(subIdentity);
+              }
+            }).catch(console.error);
+          }
+        }).catch(console.error);
+      }
+    }).catch(console.error);
+  }, [accountInfo, api, formatted, getIdentityOf, getSubIdentityOf]);
+
+  return info;
+}