@senstate/client

[![NPM Version][client-npm-img]][client-npm-url] [![Package Size][client-size-img]][client-size-url] [![Known Vulnerabilities][client-snyk-img]][client-snyk-url]

Usage no npm install needed!

<script type="module">
  import senstateClient from 'https://cdn.skypack.dev/@senstate/client';
</script>

README

@senstate/client TS Client

NPM Version Package Size Known Vulnerabilities

npm install @senstate/client

This library contains the JS/TS client code.

Connect to Senstate (@senstate/client-connection)

NPM Version Package Size Known Vulnerabilities

npm install @senstate/client-connection

import {setSenstateConnection} from "@senstate/client-connection";

setSenstateConnection({
  name: 'My Example App',
  // appId: 'customShortId' optional
}  /* , ws://localhost:3333 */);

// second parameter is a custom hub-address, working locally you won't need to change this

Without calling setSenstateConnection all watchers/senders won't send anything to the Dashboard.

Low-Level Senders

Those methods sending the data to the hub:

Watch Log Error
Function Send the current value of a "tag" Sends a log entry to the Hub Subscribes to the window.onerror method, and send this to the Hub
Create const watcher = createWatchSender({tag: string, group?: string, type?: WatchType}) const logger = createLogSender(logLevel: LogLevel = LogLevel.Info, logName?: string) registerWindowErrorHandler()
const otherLogger = genericLogSender()
Send Data watcher(value) logger(logMessage, data?, line?) Once an error happened it'll be sent
otherLogger(GenericLogSenderArgs) (full params, use code completion :))

Measure Utils

TimeMeasurer uses the time between .start() and .stop as value for the internal Watcher

  const time = new TimeMeasurer({tag: string, group?: string});
  time.start();
  // your work
  time.step();  // step can be called often, to get multiple updates, if called in a loop

Decorators

Add @PropertyWatcher({tag: string, group?: string}) to your class-property, it uses a watcher internally to send the data

  @PropertyWatcher()
  public watchProperty = 0;

  @PropertyWatcher({tag: 'otherKey', group: 'Important'})
  public watchOtherProperty = 0;

more to be added

Promise() Helpers

Measure the time of a promise, and send the value

const result = await measurePromise({tag: string, group?: string}, () => myPromiseFunc());

RXJS Pipes

import { SenstateOperators } from '@senstate/client';

myObservable$.pipe(
   SenstateOperators.watch({tag: 'Watcher Tag', group: 'optional'}), // Watcher
)

other$.pipe(
   SenstateOperators.log('Log Name')
)

const time = new TimeMeasurer({tag: 'Measurer Tag', group: 'optional'});

trigger$.pipe(
   SenstateOperators.measureStart(time),
   mergeMap(() => longerObservableExecution$),
   SenstateOperators.measureStep(time)
)