Improve output resolution in invitation screen

src/tui/screens/invitations/InvitationScreen.tsx

@@ -21,7 +21,7 @@ import { useSatoshisConversion } from '../../hooks/useSatoshisConversion.js';
 import { colors, logoSmall, formatSatoshis } from '../../theme.js';
 import { copyToClipboard } from '../../utils/clipboard.js';
 import type { Invitation } from '../../../services/invitation.js';
-import type { XOInvitationCommit, XOTemplate } from '@xo-cash/types';
+import type { XOInvitationCommit, XOInvitationVariableValue, XOTemplate } from '@xo-cash/types';
 
 import {
   getInvitationState,
@@ -34,6 +34,7 @@ import {
 } from '../../../utils/invitation-utils.js';
 
 import { InvitationImportFlow } from './invitation-import/InvitationImportFlow.js';
+import { compileCashAssemblyString } from '@xo-cash/engine';
 
 /**
  * Map state color name to theme color.
@@ -681,9 +682,17 @@ export function InvitationScreen(): React.ReactElement {
                     key={`input-${idx}`}
                     color={isUserInput ? colors.success : colors.text}
                   >
+                    {/* Indicator for whether this is the user's input */}
                     {'  '}{isUserInput ? '• ' : '○ '}
+                    
+                    {/* TODO: Why doesnt this stuff work? It just cant resolve inputs? */}
+                    {/* Input name */}
                     {inputTemplate?.name ?? input.inputIdentifier ?? `Input ${idx}`}
+                    
+                    {/* Input role */}
                     {input.roleIdentifier && ` (${input.roleIdentifier})`}
+                    
+                    {/* Input value */}
                     {inputSatoshis !== null && ` ${formatSatoshis(inputSatoshis)}${getFiatSuffix(inputSatoshis)}`}
                   </Text>
                 );
@@ -707,8 +716,19 @@ export function InvitationScreen(): React.ReactElement {
                     key={`output-${idx}`}
                     color={isUserOutput ? colors.success : colors.text}
                   >
+                    {/* Indicator for whether this is the user's output */}
                     {'  '}{isUserOutput ? '• ' : '○ '}
+
+                    {/* Output name */}
                     {outputTemplate?.name ?? output.outputIdentifier ?? `Output ${idx}`}
+                    
+                    {/* Output description */}
+                    {outputTemplate?.description && ' - ' + compileCashAssemblyString(outputTemplate?.description ?? '', variables.reduce((acc, variable) => {
+                      acc[variable.variableIdentifier] = variable.value as XOInvitationVariableValue;
+                      return acc;
+                    }, {} as Record<string, XOInvitationVariableValue>))}
+                    
+                    {/* Output value */}
                     {outputSatoshis !== null && ` (${formatSatoshis(outputSatoshis)}${getFiatSuffix(outputSatoshis)})`}
                   </Text>
                 );