fix unknownAssetId bugs

apps/minifront/src/state/send.ts

@@ -152,10 +152,11 @@ export const amountMoreThanBalance = (
    */
   amountInDisplayDenom: string,
 ): boolean => {
-  if (asset.balanceView?.valueView.case !== 'knownAssetId')
-    throw new Error('unknown asset selected');
+  if (!asset.balanceView) {
+    throw new Error('Missing balanceView');
+  }
 
-  const balanceAmt = fromValueView(asset.balanceView.valueView.value);
+  const balanceAmt = fromValueView(asset.balanceView);
   return Boolean(amountInDisplayDenom) && BigNumber(amountInDisplayDenom).gt(balanceAmt);
 };
 

packages/types/src/amount.test.ts

@@ -15,7 +15,7 @@ import {
 import { Amount } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/num/v1/num_pb';
 import {
   Metadata,
-  ValueView_KnownAssetId,
+  ValueView,
 } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/asset/v1/asset_pb';
 
 describe('lohi helpers', () => {
@@ -30,7 +30,7 @@ describe('lohi helpers', () => {
     expect(joinLoHiAmount(new Amount({ lo, hi }))).toBe(340282366920938463463374607431768211455n);
   });
 
-  it('fromBaseUnitAmountAndMetadata works', () => {
+  it('fromBaseUnitAmountAndMetadata works for knownAssetId', () => {
     const penumbraMetadata = new Metadata({
       display: 'penumbra',
       denomUnits: [
@@ -50,14 +50,34 @@ describe('lohi helpers', () => {
     });
 
     const result = fromValueView(
-      new ValueView_KnownAssetId({
-        amount: { lo: 123456789n, hi: 0n },
-        metadata: penumbraMetadata,
+      new ValueView({
+        valueView: {
+          case: 'knownAssetId',
+          value: {
+            amount: { lo: 123456789n, hi: 0n },
+            metadata: penumbraMetadata,
+          },
+        },
       }),
     );
 
     expect(result.toString()).toBe('123.456789');
   });
+
+  it('fromBaseUnitAmountAndMetadata works for unknownAssetId', () => {
+    const result = fromValueView(
+      new ValueView({
+        valueView: {
+          case: 'unknownAssetId',
+          value: {
+            amount: { lo: 123456789n, hi: 0n },
+          },
+        },
+      }),
+    );
+
+    expect(result.toString()).toBe('123456789');
+  });
 });
 
 describe('addAmounts', () => {

packages/types/src/amount.ts

@@ -1,8 +1,8 @@
 import { Amount } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/num/v1/num_pb';
 import { fromBaseUnit, joinLoHi, splitLoHi, toBaseUnit } from './lo-hi';
 import { BigNumber } from 'bignumber.js';
-import { ValueView_KnownAssetId } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/asset/v1/asset_pb';
-import { getDisplayDenomExponent } from '@penumbra-zone/getters/metadata';
+import { ValueView } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/asset/v1/asset_pb';
+import { getAmount, getDisplayDenomExponentFromValueView } from '@penumbra-zone/getters/value-view';
 
 export const joinLoHiAmount = (amount: Amount): bigint => {
   return joinLoHi(amount.lo, amount.hi);
@@ -16,11 +16,13 @@ export const isZero = (amount: Amount): boolean => {
   return joinLoHiAmount(amount) === 0n;
 };
 
-export const fromValueView = ({ amount, metadata }: ValueView_KnownAssetId): BigNumber => {
-  if (!amount) throw new Error('No amount in value view');
-  if (!metadata) throw new Error('No denom in value view');
-
-  return fromBaseUnitAmount(amount, getDisplayDenomExponent(metadata));
+export const fromValueView = (valueView: ValueView): BigNumber => {
+  return fromBaseUnitAmount(
+    getAmount(valueView),
+    valueView.valueView.case === 'knownAssetId'
+      ? getDisplayDenomExponentFromValueView(valueView)
+      : 0,
+  );
 };
 
 export const fromString = (amount: string, exponent = 0): Amount =>

packages/ui/components/ui/tx/view/value/index.tsx

@@ -1,20 +1,12 @@
 import { ValueView } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/asset/v1/asset_pb';
 import { getDisplayDenomFromView } from '@penumbra-zone/getters/value-view';
 import { getDisplayDenomExponent } from '@penumbra-zone/getters/metadata';
-import { CopyToClipboard } from '../../../copy-to-clipboard';
-import { AssetIcon } from '../asset-icon';
-import { CopyIcon } from '@radix-ui/react-icons';
 import { Amount } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/num/v1/num_pb';
 import { fromBaseUnitAmount } from '@penumbra-zone/types/amount';
-import { Pill } from '../../../pill';
-import { cn } from '../../../../../lib/utils';
+import { ValueComponent } from './value';
 
 interface ValueViewProps {
   view: ValueView | undefined;
-  /**
-   * When rendering an equivalent value, use the `equivalent` variant to
-   * visually distinguish it as an equivalent value.
-   */
   variant?: 'default' | 'equivalent';
   showDenom?: boolean;
   showValue?: boolean;
@@ -30,61 +22,46 @@ export const ValueViewComponent = ({
   showIcon = true,
   size = 'default',
 }: ValueViewProps) => {
-  if (!view) return <></>;
+  if (!view) return null;
 
-  if (view.valueView.case === 'knownAssetId' && view.valueView.value.metadata) {
-    const value = view.valueView.value;
-    const metadata = view.valueView.value.metadata;
-    const amount = value.amount ?? new Amount();
-    const exponent = getDisplayDenomExponent.optional()(metadata);
-    // The regex trims trailing zeros which toFormat adds in
-    const formattedAmount = fromBaseUnitAmount(amount, exponent)
+  const formatAmount = (amount: Amount, exponent = 0) =>
+    fromBaseUnitAmount(amount, exponent)
       .toFormat(6)
       .replace(/(\.\d*?[1-9])0+$|\.0*$/, '$1');
-    const symbol = metadata.symbol || 'Unknown Asset';
 
+  if (view.valueView.case === 'knownAssetId' && view.valueView.value.metadata) {
+    const { amount = new Amount(), metadata } = view.valueView.value;
+    const exponent = getDisplayDenomExponent.optional()(metadata);
+    const formattedAmount = formatAmount(amount, exponent);
+    const symbol = metadata.symbol || 'Unknown Asset';
     return (
-      <Pill variant={variant === 'default' ? 'default' : 'dashed'}>
-        <div className='flex min-w-0 items-center gap-1'>
-          {showIcon && (
-            <div className='-ml-2 mr-1 flex shrink-0 items-center justify-center rounded-full'>
-              <AssetIcon metadata={metadata} size={size === 'default' ? 'sm' : 'xs'} />
-            </div>
-          )}
-          {showValue && (
-            <span className={cn('-mb-0.5 text-nowrap leading-[15px]', size === 'sm' && 'text-xs')}>
-              {variant === 'equivalent' && <>~ </>}
-              {formattedAmount}
-            </span>
-          )}
-          {showDenom && (
-            <span className='truncate font-mono text-xs text-muted-foreground'>{symbol}</span>
-          )}
-        </div>
-      </Pill>
+      <ValueComponent
+        formattedAmount={formattedAmount}
+        symbol={symbol}
+        metadata={metadata}
+        variant={variant}
+        showIcon={showIcon}
+        showValue={showValue}
+        showDenom={showDenom}
+        size={size}
+      />
     );
   }
 
   if (view.valueView.case === 'unknownAssetId') {
-    const value = view.valueView.value;
-    const amount = value.amount ?? new Amount();
+    const { amount = new Amount() } = view.valueView.value;
+    const formattedAmount = formatAmount(amount);
     const encodedAssetId = getDisplayDenomFromView(view);
     return (
-      <div className='flex font-mono'>
-        <p className='-mb-0.5 truncate text-[15px] leading-[22px]'>
-          {fromBaseUnitAmount(amount, 0).toFormat()}
-        </p>
-        <span className='truncate font-mono text-sm italic text-foreground'>{encodedAssetId}</span>
-        <CopyToClipboard
-          text={encodedAssetId}
-          label={
-            <div>
-              <CopyIcon className='size-4 text-muted-foreground hover:opacity-50' />
-            </div>
-          }
-          className='w-4 px-4'
-        />
-      </div>
+      <ValueComponent
+        formattedAmount={formattedAmount}
+        symbol={encodedAssetId}
+        variant={variant}
+        showIcon={showIcon}
+        showValue={showValue}
+        showDenom={showDenom}
+        size={size}
+      />
     );
   }
 

packages/ui/components/ui/tx/view/value/value.tsx

@@ -0,0 +1,45 @@
+import { Metadata } from '@buf/penumbra-zone_penumbra.bufbuild_es/penumbra/core/asset/v1/asset_pb';
+import { AssetIcon } from '../asset-icon';
+import { Pill } from '../../../pill';
+import { cn } from '../../../../../lib/utils';
+
+interface ValueComponentProps {
+  formattedAmount: string;
+  symbol: string;
+  metadata?: Metadata;
+  variant: 'default' | 'equivalent';
+  showIcon: boolean;
+  showValue: boolean;
+  showDenom: boolean;
+  size: 'default' | 'sm';
+}
+
+export const ValueComponent = ({
+  formattedAmount,
+  symbol,
+  metadata,
+  variant,
+  showIcon,
+  showValue,
+  showDenom,
+  size,
+}: ValueComponentProps) => (
+  <Pill variant={variant === 'default' ? 'default' : 'dashed'}>
+    <div className='flex min-w-0 items-center gap-1'>
+      {showIcon && (
+        <div className='-ml-2 mr-1 flex shrink-0 items-center justify-center rounded-full'>
+          <AssetIcon metadata={metadata} size={size === 'default' ? 'sm' : 'xs'} />
+        </div>
+      )}
+      {showValue && (
+        <span className={cn('-mb-0.5 text-nowrap leading-[15px]', size === 'sm' && 'text-xs')}>
+          {variant === 'equivalent' && <>~ </>}
+          {formattedAmount}
+        </span>
+      )}
+      {showDenom && (
+        <span className='truncate font-mono text-xs text-muted-foreground'>{symbol}</span>
+      )}
+    </div>
+  </Pill>
+);