@@ -102,34 +102,48 @@ export const HelloMilestoneDemo = ({
102102 return hash ;
103103 } ;
104104
105- // Helper function to create explorer URLs
106105 const createExplorerUrls = ( txHash : string , isRealTransaction : boolean = false ) => {
107- // Only create explorer URLs for real blockchain transactions
108- if ( ! isRealTransaction ) {
109- return {
110- explorerUrl : null ,
111- stellarExpertUrl : null ,
112- horizonUrl : null ,
113- accountUrl : walletData ?. publicKey
114- ? `${ API_ENDPOINTS . STELLAR_EXPERT . BASE_URL } ${ walletData . publicKey }
115- : null ,
116- } ;
117- }
118-
119- const isTestnet = walletData ?. network === 'TESTNET' || ! walletData ?. isMainnet ;
120- const networkSuffix = isTestnet ? 'testnet' : 'public' ;
106+ // Lógica de red, definida una sola vez y accesible en toda la función
107+ const isTestnet = walletData ?. network === 'TESTNET' || ! walletData ?. isMainnet ;
108+ const networkSuffix = isTestnet ? 'testnet' : 'public' ;
121109
110+ // 1. Caso de SIMULACIÓN (isRealTransaction es false)
111+ // Devuelve valores nulos/simulados si no es una transacción real
112+ if ( ! isRealTransaction ) {
122113 return {
123- explorerUrl : `${ API_ENDPOINTS . STELLAR_EXPERT . BASE_URL } ${ networkSuffix } ${ txHash } ,
124- stellarExpertUrl : `${ API_ENDPOINTS . STELLAR_EXPERT . BASE_URL } ${ networkSuffix } ${ txHash } ,
125- horizonUrl : isTestnet
126- ? `${ API_ENDPOINTS . HORIZON . TESTNET } ${ txHash }
127- : `${ API_ENDPOINTS . HORIZON . MAINNET } ${ txHash } ,
114+ explorerUrl : null , // URL nula para simulación
115+ stellarExpertUrl : null , // URL nula para simulación
116+ horizonUrl : null , // URL nula para simulación
128117 accountUrl : walletData ?. publicKey
118+ // PERO SÍ genera la URL de cuenta para simulación si es necesario
129119 ? `${ API_ENDPOINTS . STELLAR_EXPERT . BASE_URL } ${ networkSuffix } ${ walletData . publicKey }
130120 : null ,
131121 } ;
122+ }
123+
124+ // 2. Caso de TRANSACCIÓN REAL (isRealTransaction es true)
125+ // Ahora, construimos las URLs reales usando las constantes globales:
126+ return {
127+ // URL de Horizon (explorador genérico)
128+ explorerUrl : isTestnet
129+ ? `${ API_ENDPOINTS . HORIZON . TESTNET } ${ txHash }
130+ : `${ API_ENDPOINTS . HORIZON . MAINNET } ${ txHash } ,
131+
132+ // URL de Stellar Expert (La clave que lee el modal)
133+ stellarExpertUrl : `${ API_ENDPOINTS . STELLAR_EXPERT . BASE_URL } ${ networkSuffix } ${ txHash } ,
134+
135+ // Otra referencia a Horizon (si es necesaria)
136+ horizonUrl : isTestnet
137+ ? `${ API_ENDPOINTS . HORIZON . TESTNET } ${ txHash }
138+ : `${ API_ENDPOINTS . HORIZON . MAINNET } ${ txHash } ,
139+
140+ // URL de Cuenta de Stellar Expert
141+ accountUrl : walletData ?. publicKey
142+ ? `${ API_ENDPOINTS . STELLAR_EXPERT . BASE_URL } ${ networkSuffix } ${ walletData . publicKey }
143+ : null ,
132144 } ;
145+ } ;
146+
133147
134148 // Check if demo was already completed
135149 const isCompleted = ( ( ) => {
@@ -660,48 +674,65 @@ export const HelloMilestoneDemo = ({
660674 const realTxHash = transactionResult . hash ;
661675
662676 // Create proper explorer URLs for the real transaction
663- const realUrls = createExplorerUrls ( realTxHash ) ;
664-
665- // Update transaction details with real hash
666- setTransactionDetails ( prev => ( {
667- ...prev ,
668- [ txHash ] : {
669- ...prev [ txHash ] ,
670- hash : realTxHash ,
671- explorerUrl : realUrls . explorerUrl ,
672- stellarExpertUrl : realUrls . stellarExpertUrl ,
673- } ,
674- } ) ) ;
675-
676- // Update the transaction history with the real hash
677- updateTransaction (
678- txHash ,
679- 'success' ,
680- `Escrow initialized successfully! Real transaction: ${ realTxHash }
681- ) ;
682- addTransaction ( {
683- hash : realTxHash ,
684- status : 'success' ,
685- message : 'Escrow initialized successfully!' ,
686- type : 'escrow' ,
687- demoId : 'hello-milestone' ,
688- amount : '10 USDC' ,
689- asset : 'USDC' ,
690- } ) ;
691-
692- // Clear timeout and mark as successful
693- clearTimeout ( timeout ) ;
694- setTransactionTimeouts ( prev => {
695- const newTimeouts = { ...prev } ;
696- delete newTimeouts [ txHash ] ;
697- return newTimeouts ;
698- } ) ;
699-
700- updateTransactionStatusAndCheckCompletion (
701- txHash ,
702- 'success' ,
703- `Real blockchain transaction completed! Hash: ${ realTxHash }
704- ) ;
677+ const realUrls = createExplorerUrls ( realTxHash , true ) ;
678+ setTransactionDetails ( prev => {
679+ const simulatedEntry = prev [ txHash ] ;
680+
681+ // 2. Preparamos una copia de trabajo del estado anterior.
682+ const newState = { ...prev } ;
683+
684+ // 3. Eliminamos explícitamente la clave antigua (hash simulado) de la copia.
685+ if ( simulatedEntry ) {
686+ delete newState [ txHash ] ;
687+ }
688+
689+ // 4. Crea la entrada REAL
690+ const realEntry = {
691+ // Usa los datos simulados como base, con fallback a objeto vacío
692+ ...( simulatedEntry || { } ) ,
693+
694+ // ⬇️ ¡SOBRESCRITURA DE DATOS VITALES CON NULLISH COALESCING! ⬇️
695+ hash : realTxHash , // HASH REAL
696+ // Usamos ?. y el fallback a null si realUrls?.explorerUrl es nulo/undefined
697+ explorerUrl : realUrls ?. explorerUrl ?? null ,
698+ stellarExpertUrl : realUrls ?. stellarExpertUrl ?? null , // URL REAL
699+ } ;
700+
701+ // 5. Añade la entrada REAL con la clave REAL
702+ newState [ realTxHash ] = realEntry ;
703+
704+ // 6. Devuelve el nuevo estado.
705+ return newState ;
706+ } ) ;
707+ setTimeout ( ( ) => {
708+
709+ // 1. Update the transaction history with the real hash
710+ updateTransaction (
711+ realTxHash , // ✅ HASH REAL
712+ 'success' ,
713+ `Escrow initialized successfully! Real transaction: ${ realTxHash }
714+ ) ;
715+
716+ // 2. Add transaction to the history (mantener para asegurar el contexto)
717+ addTransaction ( {
718+ hash : realTxHash ,
719+ status : 'success' ,
720+ message : 'Escrow initialized successfully!' ,
721+ type : 'escrow' ,
722+ demoId : 'hello-milestone' ,
723+ amount : '10 USDC' ,
724+ asset : 'USDC' ,
725+
726+ } ) ;
727+
728+ // 3. LLAMAR A LA FUNCIÓN DE COMPLETACIÓN FINAL CON LOS 3 ARGUMENTOS CORREGIDOS
729+ updateTransactionStatusAndCheckCompletion (
730+ realTxHash ,
731+ 'success' ,
732+ 'Escrow initialized successfully!'
733+ ) ;
734+
735+ } , 3000 ) ; // ⬅️ Retardo de 3 segundos
705736
706737 // Clear from pending transactions
707738 setPendingTransactions ( prev => {
@@ -1420,7 +1451,7 @@ export const HelloMilestoneDemo = ({
14201451 < div className = 'flex items-center space-x-2' >
14211452 { /* Auto-completion countdown */ }
14221453 < div className = 'text-xs text-blue-300 bg-blue-500/20 px-2 py-1 rounded flex items-center space-x-1' >
1423- < div className = 'w-2 h-2 bg-blue-400 rounded-full animate-pulse ' > </ div >
1454+ < div className = 'w-2 h-2 bg-blue-400 rounded-full ' > </ div >
14241455 < span >
14251456 Auto-completing in { autoCompleteCountdown [ 'initialize' ] || 5 } s...
14261457 </ span >
0 commit comments