Large amount of changes. Successfully broadcasts txs

2026-03-08 15:53:50 +00:00
parent 66e9918e04
commit 9ef1720e1f
19 changed files with 1374 additions and 352 deletions
--- a/src/tui/screens/invitations/invitation-import/steps/PreviewInvitationStep.tsx
+++ b/src/tui/screens/invitations/invitation-import/steps/PreviewInvitationStep.tsx
@@ -0,0 +1,167 @@
+/**
+ * PreviewInvitationStep — displays the current state of a fetched invitation.
+ *
+ * Shows which roles, inputs, outputs, and variables have already been filled
+ * so the user can understand what they're joining before proceeding.
+ * Press Enter to continue, Esc to cancel.
+ */
+
+import React from 'react';
+import { Box, Text, useInput } from 'ink';
+import { colors, formatSatoshis } from '../../../../theme.js';
+import {
+  getInvitationState,
+  getStateColorName,
+  getInvitationInputs,
+  getInvitationOutputs,
+  getInvitationVariables,
+} from '../../../../../utils/invitation-utils.js';
+import type { PreviewStepProps } from '../types.js';
+
+/**
+ * Map a semantic color name to an actual theme color value.
+ */
+function stateColor(state: string): string {
+  const name = getStateColorName(state);
+  switch (name) {
+    case 'info': return colors.info as string;
+    case 'warning': return colors.warning as string;
+    case 'success': return colors.success as string;
+    case 'error': return colors.error as string;
+    case 'muted':
+    default: return colors.textMuted as string;
+  }
+}
+
+export function PreviewInvitationStep({
+  invitation,
+  template,
+  onComplete,
+  onCancel,
+  isActive,
+}: PreviewStepProps): React.ReactElement {
+  useInput((_input, key) => {
+    if (!isActive) return;
+    if (key.return) onComplete();
+    if (key.escape) onCancel();
+  }, { isActive });
+
+  const state = getInvitationState(invitation);
+  const action = template?.actions?.[invitation.data.actionIdentifier];
+  const inputs = getInvitationInputs(invitation);
+  const outputs = getInvitationOutputs(invitation);
+  const variables = getInvitationVariables(invitation);
+
+  // Collect role identifiers that appear across all commits
+  const filledRoles = new Set<string>();
+  for (const commit of invitation.data.commits ?? []) {
+    for (const input of commit.data?.inputs ?? []) {
+      if (input.roleIdentifier) filledRoles.add(input.roleIdentifier);
+    }
+  }
+
+  return (
+    <Box flexDirection="column">
+      {/* Template & action info */}
+      <Box flexDirection="column" marginBottom={1}>
+        <Text color={colors.primary} bold>Template: </Text>
+        <Text color={colors.text}>{template?.name ?? invitation.data.templateIdentifier}</Text>
+        {template?.description && (
+          <Text color={colors.textMuted} dimColor>{template.description}</Text>
+        )}
+      </Box>
+
+      <Box flexDirection="row" marginBottom={1}>
+        <Box width="50%" flexDirection="column">
+          <Text color={colors.primary} bold>Action: </Text>
+          <Text color={colors.text}>{action?.name ?? invitation.data.actionIdentifier}</Text>
+          {action?.description && (
+            <Text color={colors.textMuted} dimColor>{action.description}</Text>
+          )}
+        </Box>
+        <Box width="50%" flexDirection="column">
+          <Text color={colors.primary} bold>Status: </Text>
+          <Text color={stateColor(state)}>{state}</Text>
+        </Box>
+      </Box>
+
+      {/* Roles already filled */}
+      <Box flexDirection="column" marginBottom={1}>
+        <Text color={colors.primary} bold>Roles Filled ({filledRoles.size}):</Text>
+        {filledRoles.size === 0 ? (
+          <Text color={colors.textMuted}>  None yet</Text>
+        ) : (
+          Array.from(filledRoles).map(role => {
+            const roleInfoRaw = template?.roles?.[role];
+            const roleInfo = roleInfoRaw && typeof roleInfoRaw === 'object' ? roleInfoRaw : null;
+            return (
+              <Text key={role} color={colors.text}>  • {roleInfo?.name ?? role}</Text>
+            );
+          })
+        )}
+      </Box>
+
+      {/* Inputs & Outputs side by side */}
+      <Box flexDirection="row" marginBottom={1}>
+        <Box width="50%" flexDirection="column">
+          <Text color={colors.primary} bold>Inputs ({inputs.length}):</Text>
+          {inputs.length === 0 ? (
+            <Text color={colors.textMuted}>  None yet</Text>
+          ) : (
+            inputs.map((input, idx) => {
+              const inputTemplate = template?.inputs?.[input.inputIdentifier ?? ''];
+              return (
+                <Text key={`input-${idx}`} color={colors.text}>
+                  {'  '}• {inputTemplate?.name ?? input.inputIdentifier ?? `Input ${idx}`}
+                  {input.roleIdentifier && ` (${input.roleIdentifier})`}
+                </Text>
+              );
+            })
+          )}
+        </Box>
+
+        <Box width="50%" flexDirection="column">
+          <Text color={colors.primary} bold>Outputs ({outputs.length}):</Text>
+          {outputs.length === 0 ? (
+            <Text color={colors.textMuted}>  None yet</Text>
+          ) : (
+            outputs.map((output, idx) => {
+              const outputTemplate = template?.outputs?.[output.outputIdentifier ?? ''];
+              return (
+                <Text key={`output-${idx}`} color={colors.text}>
+                  {'  '}• {outputTemplate?.name ?? output.outputIdentifier ?? `Output ${idx}`}
+                  {output.valueSatoshis !== undefined && ` (${formatSatoshis(output.valueSatoshis)})`}
+                </Text>
+              );
+            })
+          )}
+        </Box>
+      </Box>
+
+      {/* Variables */}
+      <Box flexDirection="column" marginBottom={1}>
+        <Text color={colors.primary} bold>Variables ({variables.length}):</Text>
+        {variables.length === 0 ? (
+          <Text color={colors.textMuted}>  None set</Text>
+        ) : (
+          variables.map((variable, idx) => {
+            const varTemplate = template?.variables?.[variable.variableIdentifier];
+            const displayValue = typeof variable.value === 'bigint'
+              ? variable.value.toString()
+              : String(variable.value);
+            return (
+              <Text key={`var-${idx}`} color={colors.text}>
+                {'  '}• {varTemplate?.name ?? variable.variableIdentifier}: {displayValue}
+              </Text>
+            );
+          })
+        )}
+      </Box>
+
+      {/* Navigation hint */}
+      <Box marginTop={1}>
+        <Text color={colors.textMuted}>Enter: Continue • Esc: Cancel</Text>
+      </Box>
+    </Box>
+  );
+}