# Flows komponentförråd: 146 komponenter, katalogen och testaren

> En rundtur i totaljs/flowstreamcomponents, Flows komponenter med öppen källkod: vilka grupper det täcker, hur db.json genereras, hur Flow laddar katalogen och hur du testar en komponent med den medföljande testaren.

Framework: flow
Product: Flow (flow@11.1)
Language: sv
Content-SHA256: 991bdcc78ca9d34e38ac25ddbcba05b9ae2ec1adcd02190364a691bce8f29a52
Snapshot: c0700e321579725c5cf4f5ace1ad7d2866d1b4f93c24a63c0b41b6b7998e976c
Sources: 
Review: not-recorded

[`totaljs/flowstreamcomponents`](https://github.com/totaljs/flowstreamcomponents) innehåller komponenterna med öppen källkod som Flows editor erbjuder. I revisionen som dokumenteras här (`e34d283`) har det **146 komponenter** i `components/`, 32 äldre i `archived/`, katalogens generator (`db.js`), själva katalogen (`db.json`) och en testare.

## Vad katalogen täcker

Komponenterna är ordnade i grupper. Några av de större:

| Grupp | Komponenter (exempel) |
|---|---|
| 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` |

Dessutom finns komponenter för tolkning (`xmlparser`, `dataparser`, `csvdataset`, `cheerio`), datum och tidszoner (`date`, `timezone`, `duration`), text och mallar (`tangular`, `qrcode`), OAuth2 (`oauth2`), nedladdningar (`downloader`, `urldownload`), notiser (`sms`, `rssreader`, `openweather`, `googlesearch`) och Linux-hårdvara (`nvidiasmi`). Mappen `archived/` behåller för referens den äldre generationen av familjen (Raspberry Pi GPIO och I2C, RabbitMQ, systemmått).

## Hur Flow hittar dem: `db.json`

Flow laddar inte ner HTML-koden för varje komponent. Det laddar ner **en katalog**, en JSON-fil (som standard `https://cdn.totaljs.com/flowstream/webcomponents/db.json`, inställd i [inställningarna](/en/flow/settings-and-files/)) med en post per komponent:

```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. ..."
}
```

Editorn visar listan med `readme` och laddar ner komponentens `url` när du lägger till den. För att erbjuda dina egna komponenter vid sidan av de officiella publicerar du dina HTML-filer och en egen `db.json` och skriver dess adress i inställningen `components2`.

`db.js` genererar katalogen: den läser varje fil i `components/`, hämtar `group`, `name`, `author`, `icon`, `color`, `version` och `kind` från dess `exports`, hämtar texten i `<readme>`, bygger `url` på CDN och skriver `db.json` sorterad efter namn. Kör den med Node.js efter att du lagt till eller ändrat en komponent.

## Testaren

`tester.js` kör en komponent utan editorn och `tests/` har exempel (`counter.js`, `example.js`, `example-multiple.js`, `influxdb.js`, `sqlite3.js`, `trigger.js`) och en `readme.md` med alla alternativ. Ett test ser ut så här:

```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` laddar komponenten, `test.input(data)` skickar ett meddelande till den, `test.output` och `test.message` tar emot vad den skickar, `test.configure({...})` ändrar dess konfiguration, `test.trigger()` anropar dess trigger och `test.ok()` och `test.fail()` markerar resultatet. För att köra alla tester: `cd flowstreamcomponents`, en gång `npm install total4` och `node tester.js`. Testaren i den här revisionen är skriven för Total.js 4 (`require('total4')`), som dess readme säger.

## Bidra

Förrådet ber dig följa Total.js kodstandarder och riktlinjer, och dess readme länkar dem; kontakten är `info@totaljs.com`. För att skriva en komponent, se [skriv en komponent](/en/flow/write-a-component/).