# Il repository dei componenti di Flow: 146 componenti, il catalogo e il tester

> Un giro in totaljs/flowstreamcomponents, i componenti open source di Flow: quali gruppi copre, come viene generato db.json, come Flow carica il catalogo e come testare un componente con il tester incluso.

Framework: flow
Product: Flow (flow@11.1)
Language: it
Content-SHA256: a58f648d64501c7a141e32ebc38339d415383272431d667003a805f160f1a847
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: 
Review: not-recorded

[`totaljs/flowstreamcomponents`](https://github.com/totaljs/flowstreamcomponents) contiene i componenti open source offerti dall’editor di Flow. Nella revisione documentata qui (`e34d283`) ha **146 componenti** in `components/`, 32 più vecchi conservati in `archived/`, il generatore del catalogo (`db.js`), il catalogo stesso (`db.json`) e un tester.

## Cosa copre il catalogo

I componenti sono organizzati in gruppi. Alcuni dei più grandi:

| Gruppo | Componenti (esempi) |
|---|---|
| Common (40) | `delay`, `print`, `counter`, `switch`, `merge`, `code`, `request`, `throttle`, `transform`, `macro`, `modify`, `stringoperations` |
| Total.js (17) | `taction`, `troute`, `tschema`, `tcors`, `tresponse`, `tauthtoken`, `twebsocketroute`, `tuploadedfiles`, `tsql`, `querybuilderpg` |
| Total.js API Services (13) | `tapiocrapi`, `tapigeoipapi`, `tapiweatherapi`, `tapismsapi`, `tapichatgptapi`, `tapiinvoiceparserapi`, `tapicheckvatapi`, `tapiprintapi` |
| Databases (8) | `postgresql`, `mysql`, `sqlite3`, `mongodb-query`, `mongodb-insert`, `influxdb`, `nosql`, `localstorage` |
| Triggers (7) | `timer`, `trigger`, `crontab`, `minutely`, `notify` |
| Files (6) | `filewriter`, `filewatcher`, `fileswatcher`, `fsrename`, `fstouch`, `fsunlink` |
| Flow, FlowStream, Stats, Checks, Security... | `debug`, `flowstats`, `input`, `output`, `publish`, `subscribe`, `stopwatch`, `checkurl`, `checklog`, `checkfreespace`, `totp`, `iplimiter` |
| MQTT, AI, Ollama | `mqtt-broker`, `mqtt-publish`, `mqtt-subscribe`, `aiagent`, `aitool`, `aicontext`, `chatgpt`, `ollamaprompt`, `ollamals`, `ollamawebsearch` |

Inoltre ci sono componenti per l’analisi (`xmlparser`, `dataparser`, `csvdataset`, `cheerio`), date e fusi orari (`date`, `timezone`, `duration`), testo e modelli (`tangular`, `qrcode`), OAuth2 (`oauth2`), download (`downloader`, `urldownload`), notifiche (`sms`, `rssreader`, `openweather`, `googlesearch`) e l’hardware di Linux (`nvidiasmi`). La cartella `archived/` conserva per riferimento la generazione precedente della famiglia (GPIO e I2C di Raspberry Pi, RabbitMQ, metriche di sistema).

## Come li trova Flow: `db.json`

Flow non scarica l’HTML di ogni componente. Scarica **un catalogo**, un file JSON (per impostazione predefinita `https://cdn.totaljs.com/flowstream/webcomponents/db.json`, impostato in [le impostazioni](/en/flow/settings-and-files/)) con una voce per componente:

```json
{
  "id": "taction",
  "group": "Total.js",
  "name": "Action",
  "url": "https://cdn.totaljs.com/flowstream/webcomponents/taction.html",
  "author": "Peter Širka | Total.js",
  "icon": "ti ti-totaljs",
  "color": "",
  "version": "2",
  "kind": "",
  "readme": "This component creates similar functionality as Total.js Actions. ..."
}
```

L’editor mostra l’elenco con il `readme` e scarica l’`url` del componente quando lo aggiungi. Per offrire i tuoi componenti accanto a quelli ufficiali, pubblica i tuoi file HTML e un tuo `db.json` e scrivi il suo indirizzo nell’impostazione `components2`.

`db.js` genera il catalogo: legge ogni file di `components/`, prende `group`, `name`, `author`, `icon`, `color`, `version` e `kind` dai suoi `exports`, prende il testo di `<readme>`, costruisce l’`url` sulla CDN e scrive `db.json` ordinato per nome. Eseguilo con Node.js dopo aver aggiunto o modificato un componente.

## Il tester

`tester.js` esegue un componente senza l’editor e `tests/` contiene esempi (`counter.js`, `example.js`, `example-multiple.js`, `influxdb.js`, `sqlite3.js`, `trigger.js`) e un `readme.md` con tutte le opzioni. Un test ha questo aspetto:

```js
require('../tester')(async function(describe, done) {

	await describe(function(test, next) {

		let messages = 0;
		let status = 0;

		test.status = function(data) {
			status = data;
		};

		test.input('Hello World!');
		messages++;

		setTimeout(function() {
			test.ok(status === messages, 'Counting');
			next();
		}, 2000);

	});

	done();
});
```

`describe` carica il componente, `test.input(data)` gli invia un messaggio, `test.output` e `test.message` ricevono ciò che invia, `test.configure({...})` ne cambia la configurazione, `test.trigger()` chiama il suo trigger e `test.ok()` e `test.fail()` segnano il risultato. Per eseguire tutti i test: `cd flowstreamcomponents`, `npm install total4` una volta e `node tester.js`. Il tester di questa revisione è scritto per Total.js 4 (`require('total4')`), come dice il suo readme.

## Contribuire

Il repository chiede di seguire gli standard e le linee guida di codice di Total.js e il suo readme li collega; il contatto è `info@totaljs.com`. Per scrivere un componente, vedi [scrivere un componente](/en/flow/write-a-component/).