ActionheroWebsocketClient typescript support

[mfvargo]

When developing a websocket client for an actionhero server it would be great to have a typescript implementation that could be imported to give rich typing to developers. In the current situation, you need to add the script import to your layout and then in the code you just make a new client but typescript has no idea what the client is. Also the messages that the client creates do not have any interfaces as well.

Desired solution: new package that would have the interfaces and the primus code.

Users would just

npm i actionhero-web-socket

You would not need to include the javascript anymore. In your front end code you would:

import { ActionheroWebsocketClient, ChatMessage } from 'actionhero-web-socket';

const client = new ActionheroWebsocketClient();
const messages = new Array<ChatMessage>;

I think the ChatMessage might be the existing ChatPubSubMessage but I'm not sure.

My current alternative is to include the javascript in my layout and just use the code without any type information.

Extra thoughts:

I think maybe it might also be possible to have the ActionheroWebsocketClient keep the list of messages and expose them via the client

const message = client.messages.shift();
// message is a ChatMessage

Also, the state of the connection could be kept in the client as well. So as a user of this api I would just need to construct the client, connect it and then process callbacks.

[evantahler]

This is all a good idea!

I think we might be be able to compile a client library targeting the browser in the same project. This way, the version of actionhero you are using will provide the right client version to match. Something like:

// in the browser
import { ActionheroWebSocketClient } from "actionhero/clients"

const client = new ActionheroWebSocketClient('https://site.com');

I still want to ship a compiled JS version as well for "simpler" sites to use.

I'm going to use this as an excuse to remove primus too, and just use the normal ws client and browser implementations. All browsers support websockets now!

[evantahler]

Regarding storing messages, that's a good idea... to a point. It's a memory leak to store all the messages that you might get :D. Would you be interested in storing the most recent N message, where N is configurable?

[nerdoza]

FWIW, we implemented our own AH client in our SDK. It uses Axios and Cockatiel libraries and both of those dependencies have been difficult to move away from, but they allow graceful degrading from websocket back to web requests when necessary and allow us to use the SDK across web and server code.

The next step we are hoping to take will be to move away from maintaining models in a separate SDK and allowing AH to drive the generation of strongly typed responses to action requests. Is this what you are envisioning or are you just looking to solve the client connection portion?

[evantahler]

That's an interesting question @bayssmekanique! If we were to generate a client library in the project, we could probably get some types from the action responses. If we made a more generic client lib, we couldn't.

FWIW, you can use your Action's response types today in an out-of-band sort of way - Here's an Actionhero -> React demo project https://github.com/evantahler/pokemon-typescript

[rogorman9]

@evantahler Are you still working on this? I'd love to use a TS-based client in my project 🙂

[evantahler]

Not actively - here's a draft PR from a while back #1949. Any interest in taking on this project, @rogorman9?

[nerdoza]

I no longer work for this company but I had written a TS connection class which works with ActionHero that you could reference: https://github.com/KeiserCorp/Keiser.Metrics.SDK/blob/master/src/connection.ts

[evantahler]

I no longer work for this company but I had written a TS connection class which works with ActionHero that you could reference: https://github.com/KeiserCorp/Keiser.Metrics.SDK/blob/master/src/connection.ts

Looks like MIT Licensed code! Thanks OSS!