@widergy/web-utils/README.md

Utility GO! Web utils

# web-utils
Utility GO! Web Utils  

## Analytics

Se utiliza desde Frontend Web, mediante Google Analytics 4, para recoger datos de los sitios web y comprender mejor el recorrido del cliente.

### Funciones

#### - `initializeGA(analyticsTrackingId, options)`

Se encarga de inicializar analytics.
- `analyticsTrackingId`: Google Analytics Tracking ID. 
- `options`: Objeto de configuración custom para Analytics.
	- En caso de querer un tracker, se debe indicar acá:
  ```js
	{ gaOptions: { name: ANALYTICS_TRACKER }, alwaysSendToDefaultTracker: false }
	```
	- En caso de no recibir ``options``, se usará como default
  ```js
  { titleCase: false }
  ```
    
#### - `sendGAEvent(category, action, label, value)`

Se utiliza para enviar eventos.
- `category`: Categoría del evento.
- `action`: Acción del evento.
- `label`: Label del evento. 
- `value`: Valor del evento. 

Por ejemplo, si se quiere enviar un evento sobre una recarga prepaga exitosa: 

```js
sendGAEvent('Cobranzas', 'Generación de carga prepago', 'WDRG | Valor agregado | -OK- |', '1850')
```

#### - `sendGAPageView(pathname)`

Se utiliza para trackear cambios de página.
- `pathname`: URL de la página a trackear.

Ejemplo: 

```js
sendGAPageView(ROUTES.BALANCE_TO_PAY);
```

#### - `setGAUserId(userId)`

Se utiliza para setear el id de usuario.
- `userId`: ID del usuario

Ejemplo:
```js
setGAUserId(getState().user.currentUser.id);
```


#### - `createMiddleware(eventDataDefinition)`

Se utiliza para crear un middleware que intercepte acciones de redux y envíe eventos de analytics.
	
- ``eventDataDefinition`` debe ser un diccionario de tipo de acción - función.

```js
const eventDataDefinition = {
  actionType: function
}
```

Por ejemplo:
```js
const eventDataDefinition = {
  [paymentActions.PREPAID_PAYMENT_REQUEST_FAILURE]: prepaidPaymentRequestFailure
}
```

Cada uno de estas funciones, al ejecutarse, debe devolver los valores a usar en el trackeo de eventos.
```js
const function = action => ({
  category,
  action,
  label,
  value
});
```

Por ejemplo:
```js
const prepaidPaymentRequestFailure = action => ({
  category: categories.COBRANZAS,
  action: actions.GENERACION_DE_CARGA_PREPAGO_ERRONEA,
  label: `${labels.GENERACION_DE_PAGO_ERROR} ${action.payload}`,
  value: Math.round(action.totalAmount)
});
```