Merge branch 'develop' into dev-tools/remove-useless-clap-renaming

.github/workflows/apps_explorer_prod_deploy.yml

@@ -24,7 +24,7 @@ jobs:
         run: pnpm install --frozen-lockfile
       - name: Turbo Cache
         id: turbo-cache
-        uses: actions/cache@3624ceb22c1c5a301c8db4169662070a689d9ea8 # v4.1.1
+        uses: actions/cache@1bd1e32a3bdc45362d1e726936510720a7c30a57 # v4.2.0
         with:
           path: node_modules/.cache/turbo
           key: turbo-${{ runner.os }}-${{ github.sha }}

.github/workflows/apps_wallet_dashboard_prod_deploy.yml

@@ -24,7 +24,7 @@ jobs:
         run: pnpm install --frozen-lockfile
       - name: Turbo Cache
         id: turbo-cache
-        uses: actions/cache@3624ceb22c1c5a301c8db4169662070a689d9ea8 # v4.1.1
+        uses: actions/cache@1bd1e32a3bdc45362d1e726936510720a7c30a57 # v4.2.0
         with:
           path: node_modules/.cache/turbo
           key: turbo-${{ runner.os }}-${{ github.sha }}

.github/workflows/apps_wallet_nightly_build.yml

@@ -36,7 +36,7 @@ jobs:
         run: pnpm install --frozen-lockfile
       - name: Turbo Cache
         id: turbo-cache
-        uses: actions/cache@3624ceb22c1c5a301c8db4169662070a689d9ea8 # v4.1.1
+        uses: actions/cache@1bd1e32a3bdc45362d1e726936510720a7c30a57 # v4.2.0
         with:
           path: node_modules/.cache/turbo
           key: turbo-${{ runner.os }}-${{ github.sha }}

.github/workflows/turbo_hierarchy.yml

@@ -74,7 +74,7 @@ jobs:
         run: pnpm manypkg check
       - name: Turbo Cache
         id: turbo-cache
-        uses: actions/cache@3624ceb22c1c5a301c8db4169662070a689d9ea8 # v4.1.1
+        uses: actions/cache@1bd1e32a3bdc45362d1e726936510720a7c30a57 # v4.2.0
         with:
           path: .turbo
           key: turbo-${{ runner.os }}-${{ github.sha }}

apps/explorer/src/pages/transaction-result/transaction-summary/ObjectChanges.tsx

@@ -4,6 +4,8 @@
 
 import {
     ObjectChangeLabels,
+    useFormatCoin,
+    useGetObject,
     type IotaObjectChangeTypes,
     type IotaObjectChangeWithDisplay,
     type ObjectChangesByOwner,
@@ -34,6 +36,7 @@ import {
     BadgeType,
     KeyValueInfo,
     TitleSize,
+    LoadingIndicator,
 } from '@iota/apps-ui-kit';
 import { TriangleDown } from '@iota/apps-ui-icons';
 
@@ -118,6 +121,29 @@ function ObjectDetailPanel({ panelContent, headerContent }: ObjectDetailPanelPro
         </Accordion>
     );
 }
+function ObjectDetailBalance({
+    objectId,
+    typeArg,
+}: {
+    objectId: string;
+    typeArg: string;
+}): JSX.Element {
+    const { data: objectData, isPending } = useGetObject(objectId);
+    const content = objectData?.data?.content;
+    const balance =
+        content?.dataType === 'moveObject' && content?.fields && 'balance' in content.fields
+            ? (content.fields.balance as string)
+            : BigInt(0);
+    const [formatted, symbol] = useFormatCoin(balance, typeArg);
+
+    return isPending ? (
+        <div className="mt-1 flex w-full justify-center">
+            <LoadingIndicator text="Loading data" />
+        </div>
+    ) : (
+        <KeyValueInfo keyText="Balance" value={`${formatted} ${symbol}`} />
+    );
+}
 
 interface ObjectDetailProps {
     objectType: string;
@@ -132,6 +158,8 @@ function ObjectDetail({ objectType, objectId, display }: ObjectDetailProps): JSX
     const { address, module, name } = parseStructTag(objectType);
 
     const objectDetailLabels = [ItemLabel.Package, ItemLabel.Module, ItemLabel.Type];
+    const isIotaCoin = typeName?.startsWith('Coin');
+    const typeArg = typeName?.match(/<([^>]+)>/)?.[1] || '';
 
     if (display?.data) return <ObjectDisplay display={display} objectId={objectId} />;
 
@@ -145,6 +173,7 @@ function ObjectDetail({ objectType, objectId, display }: ObjectDetailProps): JSX
             }
             panelContent={
                 <div className="flex flex-col gap-xs px-md--rs py-sm--rs pr-16 capitalize">
+                    {isIotaCoin && <ObjectDetailBalance objectId={objectId} typeArg={typeArg} />}
                     {objectDetailLabels.map((label) => (
                         <Item
                             key={label}

apps/wallet/src/ui/app/pages/approval-request/transaction-request/transaction-details/Command.tsx

@@ -3,26 +3,60 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { TypeTagSerializer, type TypeTag } from '@iota/iota-sdk/bcs';
-import { type TransactionArgument, type Commands } from '@iota/iota-sdk/transactions/';
-import { formatAddress, normalizeIotaAddress, toB64 } from '@iota/iota-sdk/utils';
+import { type Commands } from '@iota/iota-sdk/transactions/';
+import { formatAddress, normalizeIotaAddress } from '@iota/iota-sdk/utils';
 import { Collapsible } from '@iota/core';
 import { TitleSize } from '@iota/apps-ui-kit';
+import { type IotaArgument, type MoveCallIotaTransaction } from '@iota/iota-sdk/client';
+import { ErrorBoundary } from '_src/ui/app/components';
 
 type TransactionType = ReturnType<(typeof Commands)[keyof typeof Commands]>;
-type MakeMoveVecTransaction = ReturnType<(typeof Commands)['MakeMoveVec']>;
-type PublishTransaction = ReturnType<(typeof Commands)['Publish']>;
+type CommandArgTypes = string | string[] | IotaArgument | IotaArgument[] | null;
 
-function convertCommandArgumentToString(
-    arg:
-        | string
-        | number
-        | string[]
-        | number[]
-        | TransactionArgument
-        | TransactionArgument[]
-        | MakeMoveVecTransaction['MakeMoveVec']['type']
-        | PublishTransaction['Publish']['modules'],
-): string | null {
+function CommandArgument({ data }: { data: TransactionType }): JSX.Element {
+    return (
+        <>
+            {data &&
+                Object.entries(data)
+                    .map(
+                        ([key, value]) =>
+                            `${key}: ${convertCommandArgumentToString(value as CommandArgTypes)}`,
+                    )
+                    .join(', ')}
+        </>
+    );
+}
+
+function MoveCall({ data }: { data: MoveCallIotaTransaction }): JSX.Element {
+    const {
+        module,
+        package: movePackage,
+        function: func,
+        arguments: args,
+        type_arguments: typeArgs,
+    } = data;
+    return (
+        <span className="text-body-md text-neutral-40 dark:text-neutral-60">
+            package:{' '}
+            <span className="break-all text-primary-30 dark:text-primary-80">
+                {formatAddress(normalizeIotaAddress(movePackage))}
+            </span>
+            , module:{' '}
+            <span className="break-all text-primary-30 dark:text-primary-80">{module}</span>,
+            function: <span className="break-all text-primary-30 dark:text-primary-80">{func}</span>
+            {args && (
+                <span className="break-all">
+                    , arguments: {convertCommandArgumentToString(args)}
+                </span>
+            )}
+            {typeArgs && (
+                <span className="break-all">, type_arguments: [{typeArgs.join(', ')}]</span>
+            )}
+        </span>
+    );
+}
+
+function convertCommandArgumentToString(arg: CommandArgTypes): string | null {
     if (!arg) return null;
 
     if (typeof arg === 'string' || typeof arg === 'number') return String(arg);
@@ -33,31 +67,25 @@ function convertCommandArgumentToString(
 
     if (typeof arg === 'object' && 'Some' in arg) {
         if (typeof arg.Some === 'object') {
-            // MakeMoveVecTransaction['type'] is TypeTag type
             return TypeTagSerializer.tagToString(arg.Some as TypeTag);
         }
         return String(arg.Some);
     }
 
     if (Array.isArray(arg)) {
-        // Publish transaction special casing:
-        if (typeof arg[0] === 'number') {
-            return toB64(new Uint8Array(arg as number[]));
-        }
-
         return `[${arg.map((argVal) => convertCommandArgumentToString(argVal)).join(', ')}]`;
     }
 
-    if (arg && typeof arg === 'object' && 'kind' in arg) {
-        switch (arg.kind) {
+    if (arg && typeof arg === 'object' && '$kind' in arg) {
+        switch (arg.$kind) {
             case 'GasCoin':
                 return 'GasCoin';
             case 'Input':
-                return `Input(${'index' in arg ? arg.index : 'unknown'})`;
+                return `Input(${'Input' in arg ? arg.Input : 'unknown'})`;
             case 'Result':
-                return `Result(${'index' in arg ? arg.index : 'unknown'})`;
+                return `Result(${'Result' in arg ? arg.Result : 'unknown'})`;
             case 'NestedResult':
-                return `NestedResult(${'index' in arg ? arg.index : 'unknown'}, ${'resultIndex' in arg ? arg.resultIndex : 'unknown'})`;
+                return `NestedResult(${'NestedResult' in arg ? `${arg.NestedResult[0]}, ${arg.NestedResult[1]})` : 'unknown'}`;
             default:
                 // eslint-disable-next-line no-console
                 console.warn('Unexpected command argument type.', arg);
@@ -67,40 +95,25 @@ function convertCommandArgumentToString(
     return null;
 }
 
-function convertCommandToString({ $kind, ...command }: TransactionType): string {
-    const commandArguments = Object.entries(command);
-
-    return commandArguments
-        .map(([key, value]) => {
-            if (key === 'target') {
-                const [packageId, moduleName, functionName] = value.split('::');
-                return [
-                    `package: ${formatAddress(normalizeIotaAddress(packageId))}`,
-                    `module: ${moduleName}`,
-                    `function: ${functionName}`,
-                ].join(', ');
-            }
-
-            const stringValue = convertCommandArgumentToString(value);
-
-            if (!stringValue) return null;
-
-            return `${key}: ${stringValue}`;
-        })
-        .filter(Boolean)
-        .join(', ');
-}
-
 interface CommandProps {
     command: TransactionType;
 }
 
 export function Command({ command }: CommandProps) {
+    const [[type, data]] = Object.entries(command);
     return (
         <Collapsible hideBorder defaultOpen title={command.$kind} titleSize={TitleSize.Small}>
             <div className="flex flex-col gap-y-sm px-md">
                 <span className="text-body-md text-neutral-40 dark:text-neutral-60">
-                    {convertCommandToString(command)}
+                    {type === 'MoveCall' ? (
+                        <ErrorBoundary>
+                            <MoveCall data={data as MoveCallIotaTransaction} />
+                        </ErrorBoundary>
+                    ) : (
+                        <ErrorBoundary>
+                            <CommandArgument data={data as TransactionType} />
+                        </ErrorBoundary>
+                    )}
                 </span>
             </div>
         </Collapsible>