fix: notification label switch home account (#6222)

* fix: notification label switch home account * fix: lint * fix: i18n
OneKeyHQ · Nov 19, 2024 · e872cbc · e872cbc
1 parent 326ad38
commit e872cbc
Show file tree

Hide file tree

Showing 30 changed files with 224 additions and 10 deletions.
diff --git a/packages/kit-bg/src/dbs/local/LocalDbBase.ts b/packages/kit-bg/src/dbs/local/LocalDbBase.ts
@@ -832,10 +832,17 @@ export abstract class LocalDbBase extends LocalDbBaseContainer {
     return indexedAccount;
   }
 
-  async getIndexedAccountByAccount({ account }: { account: IDBAccount }) {
+  async getIndexedAccountByAccount({
+    account,
+  }: {
+    account: IDBAccount | undefined;
+  }): Promise<IDBIndexedAccount | undefined> {
     const perf = perfUtils.createPerf(
       EPerformanceTimerLogNames.localDB__getIndexedAccountByAccount,
     );
+    if (!account) {
+      return undefined;
+    }
 
     perf.markStart('checkAccountType');
     const accountId = account.id;

diff --git a/packages/kit-bg/src/services/ServiceAccount/ServiceAccount.ts b/packages/kit-bg/src/services/ServiceAccount/ServiceAccount.ts
@@ -293,6 +293,15 @@ class ServiceAccount extends ServiceBase {
     return localDb.getIndexedAccountSafe({ id });
   }
 
+  @backgroundMethod()
+  async getIndexedAccountByAccount({
+    account,
+  }: {
+    account: IDBAccount | undefined;
+  }) {
+    return localDb.getIndexedAccountByAccount({ account });
+  }
+
   async buildPrepareHdOrHwIndexes({
     indexedAccountId,
     indexes,

diff --git a/packages/kit-bg/src/services/ServiceNotification/ServiceNotification.ts b/packages/kit-bg/src/services/ServiceNotification/ServiceNotification.ts
@@ -242,6 +242,8 @@ export default class ServiceNotification extends ServiceBase {
       message: params?.remotePushMessageInfo,
       isFromNotificationClick: true,
       notificationId: notificationId || '',
+      notificationAccountId:
+        params?.remotePushMessageInfo?.extras?.params?.accountId,
     });
 
     void this.removeNotification({

diff --git a/packages/kit/src/components/AddressInfo/index.tsx b/packages/kit/src/components/AddressInfo/index.tsx
@@ -1,16 +1,105 @@
-import { Badge, XStack } from '@onekeyhq/components';
+import { Badge, Dialog, Stack, XStack } from '@onekeyhq/components';
+import { ERootRoutes, ETabRoutes } from '@onekeyhq/shared/src/routes';
+import { EAccountSelectorSceneName } from '@onekeyhq/shared/types';
 
+import { ETranslations } from '@onekeyhq/shared/src/locale/enum/translations';
+import { useIntl } from 'react-intl';
 import backgroundApiProxy from '../../background/instance/backgroundApiProxy';
+import useAppNavigation from '../../hooks/useAppNavigation';
 import { usePromiseResult } from '../../hooks/usePromiseResult';
+import { useAccountSelectorActions } from '../../states/jotai/contexts/accountSelector';
+import { AccountSelectorProviderMirror } from '../AccountSelector';
 
 type IProps = {
   accountId?: string;
   networkId: string;
   address: string;
+  allowClickAccountNameSwitch?: boolean;
 };
 
+type ISwitchHomeAccountButtonProps = {
+  accountId: string | undefined;
+  children: React.ReactNode;
+  walletAccountName: string;
+};
+function SwitchHomeAccountButton({
+  accountId,
+  walletAccountName,
+  children,
+}: ISwitchHomeAccountButtonProps) {
+  const actions = useAccountSelectorActions();
+  const navigation = useAppNavigation();
+  const intl = useIntl();
+  return (
+    <Stack
+      onPress={async () => {
+        Dialog.show({
+          icon: 'SwitchHorOutline',
+          title: intl.formatMessage(
+            {
+              id: ETranslations.history_switch_account_dialog_title,
+            },
+            {
+              account: walletAccountName,
+            },
+          ), // `Switch primary account to ${walletAccountName}`,
+          onConfirm: async () => {
+            const account =
+              await backgroundApiProxy.serviceAccount.getDBAccountSafe({
+                accountId: accountId || '',
+              });
+
+            const indexedAccount =
+              await backgroundApiProxy.serviceAccount.getIndexedAccountByAccount(
+                {
+                  account,
+                },
+              );
+
+            if (!indexedAccount && !account) {
+              return;
+            }
+
+            // TODO pop to top
+            navigation.popStack();
+            navigation.popStack();
+            navigation.popStack();
+            navigation.navigate(ERootRoutes.Main, {
+              screen: ETabRoutes.Home,
+              params: {},
+            });
+
+            setTimeout(async () => {
+              await actions.current.confirmAccountSelect({
+                num: 0,
+                othersWalletAccount: indexedAccount ? undefined : account,
+                indexedAccount,
+              });
+            }, 300);
+          },
+        });
+      }}
+    >
+      {children}
+    </Stack>
+  );
+}
+
+function SwitchHomeAccountContainer(props: ISwitchHomeAccountButtonProps) {
+  return (
+    <AccountSelectorProviderMirror
+      config={{
+        sceneName: EAccountSelectorSceneName.home,
+      }}
+      enabledNum={[0]}
+    >
+      <SwitchHomeAccountButton {...props} />
+    </AccountSelectorProviderMirror>
+  );
+}
+
 function AddressInfo(props: IProps) {
-  const { accountId, networkId, address } = props;
+  const { accountId, networkId, address, allowClickAccountNameSwitch } = props;
   const addressQueryResult = usePromiseResult(
     () =>
       backgroundApiProxy.serviceAccountProfile.queryAddress({
@@ -31,15 +120,25 @@ function AddressInfo(props: IProps) {
   if (
     !addressQueryResult.walletAccountName &&
     !addressQueryResult.addressBookName
-  )
+  ) {
     return null;
+  }
+
+  const AccountNameContainer = allowClickAccountNameSwitch
+    ? SwitchHomeAccountContainer
+    : Stack;
 
   return (
     <XStack gap="$2" flex={1} flexWrap="wrap">
       {addressQueryResult.walletAccountName ? (
-        <Badge badgeType="success" badgeSize="sm">
-          {addressQueryResult.walletAccountName}
-        </Badge>
+        <AccountNameContainer
+          walletAccountName={addressQueryResult.walletAccountName}
+          accountId={accountId}
+        >
+          <Badge badgeType="success" badgeSize="sm">
+            {addressQueryResult.walletAccountName}
+          </Badge>
+        </AccountNameContainer>
       ) : null}
       {addressQueryResult.addressBookName ? (
         <Badge badgeType="success" badgeSize="sm">

diff --git a/packages/kit/src/views/AssetDetails/pages/HistoryDetails/HistoryDetails.tsx b/packages/kit/src/views/AssetDetails/pages/HistoryDetails/HistoryDetails.tsx
@@ -251,6 +251,53 @@ export function AssetItem({
   );
 }
 
+function NotificationAccountInfo({
+  notificationAccountId,
+  networkId,
+  allowClickAccountNameSwitch,
+}: {
+  notificationAccountId: string;
+  networkId: string;
+  allowClickAccountNameSwitch: boolean | undefined;
+}) {
+  const { account: notificationAccount } = useAccountData({
+    networkId,
+    accountId: notificationAccountId,
+  });
+  const notificationAccountAddress = useMemo(
+    () =>
+      notificationAccount?.addressDetail?.normalizedAddress ||
+      notificationAccount?.address,
+    [notificationAccount],
+  );
+  const intl = useIntl();
+
+  return (
+    <>
+      <Divider mx="$5" />
+      <InfoItemGroup>
+        <InfoItem
+          label={intl.formatMessage({
+            id: ETranslations.history_notification_receiver_label,
+          })}
+          renderContent={notificationAccountAddress}
+          compact
+          description={
+            notificationAccountAddress ? (
+              <AddressInfo
+                address={notificationAccountAddress}
+                accountId={notificationAccount?.id}
+                networkId={networkId}
+                allowClickAccountNameSwitch={allowClickAccountNameSwitch}
+              />
+            ) : null
+          }
+        />
+      </InfoItemGroup>
+    </>
+  );
+}
+
 function HistoryDetails() {
   const intl = useIntl();
   const route =
@@ -266,6 +313,8 @@ function HistoryDetails() {
     networkId,
     transactionHash,
     notificationId,
+    notificationAccountId,
+    allowClickAccountNameSwitch,
     historyTx: historyTxParam,
     isAllNetworks,
     checkIsFocused = true,
@@ -742,6 +791,7 @@ function HistoryDetails() {
                   address={to}
                   networkId={networkId}
                   accountId={accountId}
+                  allowClickAccountNameSwitch={allowClickAccountNameSwitch}
                 />
               }
             />
@@ -757,6 +807,7 @@ function HistoryDetails() {
                 address={from}
                 networkId={networkId}
                 accountId={accountId}
+                allowClickAccountNameSwitch={allowClickAccountNameSwitch}
               />
             }
           />
@@ -771,6 +822,7 @@ function HistoryDetails() {
                 address={swapReceivedAddress ?? ''}
                 networkId={swapReceivedNetworkId ?? ''}
                 accountId={accountId}
+                allowClickAccountNameSwitch={allowClickAccountNameSwitch}
               />
             }
           />
@@ -792,6 +844,7 @@ function HistoryDetails() {
                 address={txAddresses.from}
                 networkId={networkId}
                 accountId={accountId}
+                allowClickAccountNameSwitch={allowClickAccountNameSwitch}
               />
             }
           />
@@ -804,6 +857,7 @@ function HistoryDetails() {
                 address={txAddresses.to}
                 networkId={networkId}
                 accountId={accountId}
+                allowClickAccountNameSwitch={allowClickAccountNameSwitch}
               />
             }
           />
@@ -831,6 +885,7 @@ function HistoryDetails() {
     intl,
     networkId,
     accountId,
+    allowClickAccountNameSwitch,
   ]);
 
   const renderTxApproveFor = useCallback(() => {
@@ -932,7 +987,7 @@ function HistoryDetails() {
     return (
       <>
         {/* Part 1: What change */}
-        <Stack>
+        <Stack testID="history-details-what-assets-change">
           {transfersToRender?.map((block) =>
             renderAssetsChange({
               transfers: block.transfers,
@@ -943,7 +998,7 @@ function HistoryDetails() {
         </Stack>
 
         {/* Part 2: Details */}
-        <Stack>
+        <Stack testID="history-details-main-content">
           {/* Primary */}
           <InfoItemGroup>
             <InfoItem
@@ -957,6 +1012,16 @@ function HistoryDetails() {
               compact
             />
           </InfoItemGroup>
+
+          {/* Notification account */}
+          {notificationAccountId ? (
+            <NotificationAccountInfo
+              notificationAccountId={notificationAccountId}
+              networkId={networkId}
+              allowClickAccountNameSwitch={allowClickAccountNameSwitch}
+            />
+          ) : null}
+
           {/* Secondary */}
           <Divider mx="$5" />
           <InfoItemGroup>
@@ -1054,6 +1119,9 @@ function HistoryDetails() {
     txInfo?.blockHeight,
     txInfo?.nonce,
     txInfo?.confirmations,
+    notificationAccountId,
+    networkId,
+    allowClickAccountNameSwitch,
     renderTxMetaInfo,
     txid,
     vaultSettings?.hideBlockExplorer,

diff --git a/packages/kit/src/views/Developer/pages/Gallery/Components/stories/Icon.tsx b/packages/kit/src/views/Developer/pages/Gallery/Components/stories/Icon.tsx
@@ -50,7 +50,7 @@ const IconGallery = () => (
             numColumns={4}
             data={iconData}
             renderItem={({ item }) => (
-              <Stack height="$28" key={item}>
+              <Stack pr="$2" height="$28" key={item}>
                 <SizableText>{item}</SizableText>
                 <Stack position="absolute" bottom="$10">
                   <Icon name={item} />

diff --git a/packages/kit/src/views/Notifications/pages/NotificationList.tsx b/packages/kit/src/views/Notifications/pages/NotificationList.tsx
@@ -304,6 +304,8 @@ function NotificationList() {
                   void notificationsUtils.navigateToNotificationDetail({
                     navigation,
                     message: item.body,
+                    notificationAccountId:
+                      item?.body?.extras?.params?.accountId,
                     notificationId:
                       item?.msgId ||
                       item?.body?.extras?.params?.msgId ||

diff --git a/packages/shared/src/locale/enum/translations.ts b/packages/shared/src/locale/enum/translations.ts
@@ -1202,6 +1202,7 @@
   hardware_wallet_connection_is_only_available_on_the_official_app = 'hardware.wallet_connection_is_only_available_on_the_official_app',
   hardware_wallet_connection_is_only_available_on_the_third_party_apps = 'hardware.wallet_connection_is_only_available_on_the_third_party_apps',
   hidden_assets = 'hidden_assets',
+  history_notification_receiver_label = 'history.notification_receiver_label',
   history_switch_account_dialog_title = 'history.switch_account_dialog_title',
   hw_banner_description = 'hw_banner_description',
   interact_with_contract = 'interact_with_contract',

diff --git a/packages/shared/src/locale/json/bn.json b/packages/shared/src/locale/json/bn.json
@@ -1197,6 +1197,7 @@
   "hardware.wallet_connection_is_only_available_on_the_official_app": "হার্ডওয়্যার ওয়ালেট সংযোগ কেবল অফিসিয়াল অ্যাপে পাওয়া যায়",
   "hardware.wallet_connection_is_only_available_on_the_third_party_apps": "হার্ডওয়্যার ওয়ালেট সংযোগ কেবল তৃতীয় পক্ষের অ্যাপসে উপলব্ধ",
   "hidden_assets": "গোপন সম্পত্তি",
+  "history.notification_receiver_label": "বিজ্ঞপ্তি প্রাপ্ত হয়েছে",
   "history.switch_account_dialog_title": "প্রাথমিক অ্যাকাউন্ট {account} এ পরিবর্তন করবেন?",
   "hw_banner_description": "আপনার ক্রিপ্টো সংরক্ষণ করুন সবচেয়ে শক্তিশালী হার্ডওয়্যার ওয়ালেটের সাহায্যে",
   "interact_with_contract": "(এর সাথে) যোগাযোগ করুন (প্রতি)",

diff --git a/packages/shared/src/locale/json/de.json b/packages/shared/src/locale/json/de.json
@@ -1197,6 +1197,7 @@
   "hardware.wallet_connection_is_only_available_on_the_official_app": "Die Verbindung zur Hardware-Wallet ist nur über die offizielle App möglich",
   "hardware.wallet_connection_is_only_available_on_the_third_party_apps": "Die Verbindung mit der Hardware-Wallet ist nur über Drittanbieter-Apps verfügbar",
   "hidden_assets": "Versteckte Vermögenswerte",
+  "history.notification_receiver_label": "Benachrichtigung erhalten von",
   "history.switch_account_dialog_title": "Primärkonto auf {account} umstellen?",
   "hw_banner_description": "Sichern Sie Ihre Krypto mit der leistungsstärksten Hardware-Wallet",
   "interact_with_contract": "Interagieren mit (An)",

diff --git a/packages/shared/src/locale/json/en.json b/packages/shared/src/locale/json/en.json
@@ -1197,6 +1197,7 @@
   "hardware.wallet_connection_is_only_available_on_the_official_app": "Hardware wallet connection is only available on the official app",
   "hardware.wallet_connection_is_only_available_on_the_third_party_apps": "Hardware wallet connection is only available on third-party apps",
   "hidden_assets": "Hidden assets",
+  "history.notification_receiver_label": "Notification received by",
   "history.switch_account_dialog_title": "Switch primary account to {account}?",
   "hw_banner_description": "Secure your crypto with the most powerful hardware wallet",
   "interact_with_contract": "Interact with (To)",

diff --git a/packages/shared/src/locale/json/en_US.json b/packages/shared/src/locale/json/en_US.json
@@ -1197,6 +1197,7 @@
   "hardware.wallet_connection_is_only_available_on_the_official_app": "Hardware wallet connection is only available on the official app",
   "hardware.wallet_connection_is_only_available_on_the_third_party_apps": "Hardware wallet connection is only available on third-party apps",
   "hidden_assets": "Hidden assets",
+  "history.notification_receiver_label": "Notification received by",
   "history.switch_account_dialog_title": "Switch primary account to {account}?",
   "hw_banner_description": "Secure your crypto with the most powerful hardware wallet",
   "interact_with_contract": "Interact with (To)",