Construye en Flow: Aprende FCL - 8. Como consultar una transacción por su id
Published: 2022-06-13 05:58:39

## Resumen

En esta corta guía, aprenderás a:

- encontrar la data de una transacción por su id.
- procesar y analizar la data adquirida.

Corto, pero directo al punto!

## ¿Por qué?

Después de que una transacción es enviada a la cadena, obtendrás el correspondiente `id`, que cualquiera puede usar para consultar la data de esa específica transacción . Por ejemplo, si estás transfiriendo algunos tokens a otra cuenta, también puedes proveer el `id` de la transacción como una prueba de que has cumplido con la tarea en tu lado y ahora el recipiente puede obtener actualizaciones consultando cambios de estado a esa transacción. 

## ¿Como?

FCL provee una función `[tx](https://docs.onflow.org/fcl/reference/api/#tx)` que te permite suscribirte a actualizaciones de estado (via polling), pero subsecuentemente también retorna el resultado final si el estado de la transacción es `sealed`. La función `tx` retornará un objeto y uno de los campos es el método `.onceSealed()`. Cuando es llamado este método retornará una promesa, la cual se resolverá si la transaccion con el `id` especificado tienej estado igual a `5` (sealed).

### Sellado de nuevo? 🤔

Similar a los bloques, las transacciones también tienen diferentes [estados](https://docs.onflow.org/fcl/reference/api/#transaction-statuses):

- 1 - `pending` - la transacción espera **finalización**
- 2 - `finalized` -  la transacción espera **ejecución**
- 3- `executed` -  la transacción espera ser **sellada.**
- 4 - `sealed`** - la transacción esta **sellada** y podría verse como **completa** e irreversible.
- 5 - `expired` - la transacción **expiró**.

> *Has leído eso bien, las transacciones pueden expirar! Cuando una transacción es creada, es “anclada” al último bloque disponible y necesita ser sellada dentro del rango de los 600 bloques (o alrededor de 10 minutes en tiempo humano 👨‍🏫).*
> 

Ahora pongámoslo en practica! 💪

### Paso 1 - Instalación

Añade `"@onflow/fcl": "1.0.0"` como tu dependencia.

### Paso 2 - Configuración

Justo como la última vez importaremos los métodos necesarios para configurar FCL:

```jsx
// Importar métodos de FCL
import { tx, config } from "@onflow/fcl";

// Especificar el endpoint de la API- esta vez usaremos Mainnet
const api = "https://rest-mainnet.onflow.org";

// Configuraremos FCL para que use mainnet como el nodo de acceso
config().put("accessNode.api", api);
```

### Finalmente

Envolveremos el código en un bloque IIFE para ejecución automática:

```jsx
// usaremos IIFE para ejecute nuestro codigo de inmediato
(async () => {
  console.clear();

	// Este es un id cualquiera que consegui del live feed de Flowscan
	const id = "2297668a3f35d6c6b4a18bb9c5ea8d3e60ce7e4a4e0fe31ad5a9c623d002b9d7";

  const txResult = await tx(id).onceSealed();
  console.log({ txResult });
}
```

Después de la ejecución tu consola debería tener este output:

```jsx
txResult: {
	blockId: "f21eb65a65cd8f2f26a340265c24497ee2ca130862e4c7e9d6f1e6d6680a2fe6",
	status: 4,
	statusString: "SEALED",
	statusCode: 0,
	errorMessage: "",
	events: Array(7),
}
```

Cada evento tendra la forma de un objeto:

```jsx
{
	type: "A.2d4c3caffbeab845.FLOAT.FLOATMinted",
	transactionId: "2297668a3f35d6c6b4a18bb9c5ea8d3e60ce7e4a4e0fe31ad5a9c623d002b9d7",
	transactionIndex: 4,
	eventIndex: 0,
	data: Object,
}
```

Si le das una vista al nombre de tipo de evento de varios events veras claramente un patrón:

- `A` - es por **A**ccount
- `2d4c3caffbeab845` - esta es la dirección donde el contrato conteniendo declaraciones de eventos es desplegado.
- `FLOAT` - nombre del contrato.
- `FLOATMinted` - nombre del evento.

Podemos crear un enlace y explorar este [contrato en Flow View Source](https://flow-view-source.com/mainnet/account/0x2d4c3caffbeab845/contract/FLOAT). `Línea 53` tiene la definición del evento `FLOATMinted`.

La [referencia rápida de FCL en la documentación de Flow](https://docs.onflow.org/fcl/) tiene más información acerca de transacciones y eventos: 

- resultado de transacciones - [https://docs.onflow.org/fcl/reference/api/#returns-after-decoding-7](https://docs.onflow.org/fcl/reference/api/#returns-after-decoding-7)
- data de eventos  - [https://docs.onflow.org/fcl/reference/api/#event-object](https://docs.onflow.org/fcl/reference/api/#event-object)

## Otras maneras de explorar transacciones

De manera similar a Account, como cubrimos la ultima vez, exploraremos la data de las transacciones en FlowScan and Flow View Source

- **Flow View Source** - [https://flow-view-source.com/mainnet/tx/2297668a3f35d6c6b4a18bb9c5ea8d3e60ce7e4a4e0fe31ad5a9c623d002b9d7](https://flow-view-source.com/mainnet/tx/2297668a3f35d6c6b4a18bb9c5ea8d3e60ce7e4a4e0fe31ad5a9c623d002b9d7) - es un proyecto de la comunidad por el creador original de FCL - James Hunter - [https://github.com/orodio](https://github.com/orodio)
- **Flowscan** -h[ttps://flowscan.org/transaction/2297668a3f35d6c6b4a18bb9c5ea8d3e60ce7e4a4e0fe31ad5a9c623d002b9d7](https://flowscan.org/transaction/2297668a3f35d6c6b4a18bb9c5ea8d3e60ce7e4a4e0fe31ad5a9c623d002b9d7) - contrario a la información de la cuenta, una transacción en Flowscan tiene la misma data en Flow View Source.

Hasta la próxima 👋

## Recursos

- **Código del ejemplo** - [https://codesandbox.io/s/dev-to-fcl-08-fetch-transaction-by-id-44kccc?file=/src/index.js](https://codesandbox.io/s/dev-to-fcl-08-fetch-transaction-by-id-44kccc?file=/src/index.js)
- **Documentacion de la funciñon**`tx`- [https://docs.onflow.org/fcl/reference/api/#tx](https://docs.onflow.org/fcl/reference/api/#tx)
- **Documentación sobre la respuesta del status de una transacción** - `transaction status` response - [https://docs.onflow.org/fcl/reference/api/#returns-after-decoding-7](https://docs.onflow.org/fcl/reference/api/#returns-after-decoding-7)
- **Documentación sobre la data de eventos**- `event` data - [https://docs.onflow.org/fcl/reference/api/#event-object](https://docs.onflow.org/fcl/reference/api/#event-object)

Otros recursos que podrías encontrar útil:

- **Documentación de  Flow** - [https://docs.onflow.org/](https://docs.onflow.org/) - más información de tallada acerca de Flow blockchain y como interactuar con ella.
- **Flow Portal** - [https://flow.com/](https://flow.com/) - tu punto de entrada a Flow.
- **FCL JS** - [https://github.com/onflow/fcl-js](https://github.com/onflow/fcl-js) - Código fuente y la habilidad de contribuir a la librería FCL JS.
- **Cadence** - [https://docs.onflow.org/cadence/](https://docs.onflow.org/cadence/) - Introducción a Cadence
- **Codesandbox** - [https://codesandbox.io](https://codesandbox.io/) - Un asombroso IDE en el navegador para prototipar.

*Esta es una traducción al español del octavo artículo de la serie Build on Flow | Learn FCL escrito por [Maksimus Starka](https://twitter.com/MaxStalker).*