# Utiliser des variables

Dans Hablla, lors de la configuration d'un flux d'automatisation, vous pouvez utiliser **des variables** pour récupérer des données de composants précédents et des expressions **logiques et conditionnelles** pour rendre vos automatisations plus dynamiques et intelligentes.

Cela permet que les informations soient réutilisées automatiquement, sans avoir à les remplir manuellement, rendant le processus plus efficace et sans erreurs.

### 🎯 **Que sont les variables dans Hablla ?**

Chaque composant à l'intérieur d'un flux a un **code unique** et peut générer **des données de sortie** qui peuvent être utilisées par d'autres composants dans le même flux.

<figure><img src="https://2835740493-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FrmxWrIrMauHcIrsuqfGq%2Fuploads%2FWpztEh7gCvaKUGA9aENC%2Fimage.png?alt=media&#x26;token=f7845359-1265-4bad-91a6-7b747e789e21" alt=""><figcaption></figcaption></figure>

Vous pouvez accéder à ces données en utilisant la syntaxe suivante :

```plaintext
{{$data?.codigoDoComponente?.caminhoVariavel}}
```

➡ **Exemple réel :**\
Si un composant appelé `whatsappReceptive_tmy0de` a identifié une personne, et son ID est stocké dans le champ `person.id`, nous pouvons accéder à cette valeur ainsi :

```plaintext
{{$data?.whatsappReceptive_tmy0de?.person?.id}}
```

Si ce composant ne renvoie pas de valeur valide, nous pouvons essayer un second composant appelé `whatsappReceptive_r2b7wr`:

```plaintext
{{$data?.whatsappReceptive_tmy0de?.person?.id ?? $data?.whatsappReceptive_r2b7wr?.person?.id}}
```

📌 Ici, `??` signifie : **si la première valeur est nulle ou indéfinie, utilisez la seconde.**

***

### 🔥 **Opérateurs et expressions dans Hablla**

En plus d'accéder aux variables, vous pouvez utiliser **des opérateurs logiques** pour créer des règles et des conditions dans vos flux.

#### 🛠 Opérateurs logiques et conditionnels

| Opérateur                                         | Signification                                                                                   | Exemple                                                       |
| ------------------------------------------------- | ----------------------------------------------------------------------------------------------- | ------------------------------------------------------------- |
| `??` (Nullish Coalescing - "Si nul ou indéfini")  | Si la première valeur est nulle ou indéfinie, utilisez la seconde                               | `{{$data?.componente1?.valor ?? $data?.componente2?.valor}}`  |
| \|\| (Logical OR - "Ou")                          | Si la première valeur est fausse (`false`, `null`, `undefined`, `0`, `""`), utilisez la seconde | {{$data?.status \|\| "Pendente"}}                             |
| `:` (Opérateur ternaire - "Si... alors... sinon") | Fonctionne comme un opérateur ternaire (if/else)                                                | `{{$data?.idade > 18 ? "Maior de idade" : "Menor de idade"}}` |
| `&&` (Logical AND - "Et")                         | Retourne la seconde valeur si la première est vraie                                             | `{{$data?.temDesconto && "Desconto Aplicado"}}`               |

***

| Opérateur            | Signification                     | Exemple            |
| -------------------- | --------------------------------- | ------------------ |
| `+` (Addition)       | Additionne deux valeurs.          | `{{5 + 3}}` → `8`  |
| `-` (Soustraction)   | Soustrait deux valeurs.           | `{{10 - 4}}` → `6` |
| `*` (Multiplication) | Multiplie deux valeurs.           | `{{3 * 4}}` → `12` |
| `/` (Division)       | Divise deux valeurs.              | `{{10 / 2}}` → `5` |
| `%` (Modulo)         | Retourne le reste de la division. | `{{10 % 3}}` → `1` |

***

#### 🔍 **Opérateurs de comparaison**

| Opérateur                     | Signification                                                               | Exemple                   |
| ----------------------------- | --------------------------------------------------------------------------- | ------------------------- |
| `==` (Égalité)                | Compare des valeurs sans vérifier le type.                                  | `{{5 == "5"}}` → `true`   |
| `===` (Strictement égal)      | Compare les valeurs et le type de données.                                  | `{{5 === "5"}}` → `false` |
| `!=` (Différent)              | Compare si les valeurs sont différentes.                                    | `{{5 != "5"}}` → `false`  |
| `!==` (Strictement différent) | Compare si les valeurs et les types sont différents.                        | `{{5 !== "5"}}` → `true`  |
| `>` (Supérieur à)             | Retourne `true` si la première valeur est supérieure à la seconde.          | `{{10 > 5}}` → `true`     |
| `<` (Inférieur à)             | Retourne `true` si la première valeur est inférieure à la seconde.          | `{{3 < 7}}` → `true`      |
| `>=` (Supérieur ou égal)      | Retourne `true` si la première valeur est supérieure ou égale à la seconde. | `{{8 >= 8}}` → `true`     |
| `<=` (Inférieur ou égal)      | Retourne `true` si la première valeur est inférieure ou égale à la seconde. | `{{6 <= 5}}` → `false`    |

***

#### 🔄 **Opérateurs de chaîne**

| Opérateur           | Signification          | Exemple                                    |
| ------------------- | ---------------------- | ------------------------------------------ |
| `+` (Concaténation) | Assemble deux chaînes. | `{{"Olá, " + "mundo!"}}` → `"Olá, mundo!"` |

***

#### 🔀 **Opérateurs de tableaux**

| Opérateur     | Signification                                 | Exemple                                    |
| ------------- | --------------------------------------------- | ------------------------------------------ |
| `.length`     | Retourne la taille d'un tableau.              | `{{$data?.nomes.length}}`                  |
| `.includes()` | Vérifie si une valeur existe dans le tableau. | `{{$data?.cidades.includes("São Paulo")}}` |
| `.map()`      | Itère sur les éléments et modifie le tableau. | `{{$data?.numeros.map(n => n * 2)}}`       |
| `.filter()`   | Filtre les éléments du tableau.               | `{{$data?.numeros.filter(n => n > 5)}}`    |

### 🔍 **Comment utiliser les conditions IF/ELSE**

Dans Hablla, vous pouvez créer **des règles conditionnelles** au sein des flux. Voici comment cela fonctionne :

#### ✅ **Exemple 1 : Vérifier si un client est qualifié**

```plaintext
{{$data?.lead?.score > 50 ? "Lead Qualificado" : "Lead Não Qualificado"}}
```

Si le score du lead est **supérieur à 50**, le résultat sera `"Lead Qualificado"`, sinon, `"Lead Não Qualificado"`.

#### ✅ **Exemple 2 : Définir un statut par défaut**

```plaintext
{{$data?.pedido?.status ?? "Em processamento"}}
```

Si le statut de la commande existe, il sera utilisé. Sinon, le statut par défaut `"Em processamento"` sera appliqué.

#### ✅ **Exemple 3 : Combiner plusieurs conditions**

```plaintext
{{$data?.usuario?.idade >= 18 ? "Maior de idade" : $data?.usuario?.idade > 0 ? "Menor de idade" : "Idade não informada"}}
```

🔹 Si l'âge est supérieur ou égal à **18**, le résultat sera `"Maior de idade"`.\
🔹 Si l'âge est supérieur à **0**, mais inférieur à **18**, le résultat sera `"Menor de idade"`.\
🔹 Si l'âge n'est pas renseigné, le résultat sera `"Idade não informada"`.

***

### 🎯 **Comment utiliser ces expressions dans la configuration d'un composant**

Chaque fois que vous configurez un composant dans Hablla, vous pouvez utiliser ces expressions dans les champs où vous souhaitez insérer des valeurs dynamiques.

📌 **Exemple pratique :**\
Supposons que nous créons une nouvelle carte dans le flux et que nous voulons y associer une personne identifiée dans un composant précédent. Nous pouvons le faire ainsi :

```plaintext
{{$data?.whatsappReceptive_tmy0de?.person?.id ?? $data?.whatsappReceptive_r2b7wr?.person?.id}}
```

Cela garantit que, si un composant ne trouve pas la personne, l'autre sera utilisé automatiquement.

***

### 🔥 **Résumé : Comment utiliser les variables et expressions dans Hablla**

✅ **Utilisez `{{$data?.codigoDoComponente?.caminhoVariavel}}`** pour accéder aux données des composants précédents.\
✅ **Utilisez `??` pour définir une valeur alternative si la première est nulle ou indéfinie.**\
✅ **Utilisez `||` pour définir une valeur alternative si la première est fausse.**\
✅ **Utilisez `:` pour créer des règles `if/else` au sein des champs.**\
✅ **Utilisez `&&` pour définir une valeur seulement si la condition est vraie.**

🚀 **Avec ces techniques, vous pouvez créer des flux intelligents et personnalisés sans avoir à programmer !**