v0.12 Migration Guide

v0.12 Migration Guide

This guide helps you to migrate your codebase from v0.11 to v0.12 of this project.

Please read the following sections carefully and check, if some of the changes affects your code!

General

Moving forward, testing is done with React Spectrum v3.9. Consider all previous versions unsupported.

The minimum required node version for all packages is now Node v14!

Vert.x Event Bus @wuespace/vertx-event-bus

For reference:

const eb = new EventBus('http://localhost:9870/bridge');

• Changed:
  • eb.messageCount split up, please use: eb.sentMessages, eb.receivedMessages
  • eb.state now returns a custom connection state type
  • the auto reconnection feature is now enabled by default (disable it via the Options or setAutoReconnect)
• Renamed:
  • eb.serverUrl → eb.url
  • eb.isReconnectEnabled → eb.autoReconnect
  • eb.enableReconnect → eb.setAutoReconnect
  • eb.registerHandler → eb.register
  • eb.unregisterHandler → eb.unregister
• Removed:
  • eb.isPingEnabled
  • eb.enablePing
  • EventBus.getStateName
  • EventBus.CONNECTING
  • EventBus.OPEN
  • EventBus.CLOSING
  • EventBus.CLOSED

Vert.x Mock Server @wuespace/vertx-mock-server

• The listen function now requires an object as argument which contains the port and hostname as properties:

  const server = new MockServer();
  server.listen({
    port: 12345,
    hostname: 'localhost'
  }); // listen on port 12345 on 'localhost'

• The event bus and http server instance properties are now marked private. Please use the provided abstractions and hooks instead. (see onInit, send, handle, register, etc.)

Telestion Client Types @wuespace/telestion-client-types

• The Callback type now only returns the actual content instead of the mix of received content and error message:

  export type Callback<T extends JsonSerializable = JsonSerializable> = (
    content: T
  ) => void;

• The error message now extends a base message and so the error message is no longer addressable!

  export interface ErrorMessage extends BaseMessage {
    //...
  }

• The auto connection feature of the Vert.x Event Bus is now initially configurable via the constructor options!

  export interface Options {
    autoReconnect: boolean;
    //...
  }

Telestion Client Core @wuespace/telestion-client-core

• the useRequest hook now returns a send function which callback receives the data from the backend (and no longer the mix arguments):

  export type SendFunction<T extends JsonSerializable> =
    (message: JsonSerializable, callback: (message: T) => void) => void;
  
  export function useRequest<T extends JsonSerializable = JsonSerializable>(
    address: ChannelAddress
  ): SendFunction<T> {
    //...
  }

• the useChannel hook now requires a callback function which receives the data from backend (and no longer the mix arguments):

  export function useChannel<T extends JsonSerializable = JsonSerializable>(
    address: ChannelAddress,
    onUpdate: (data: T) => void
  ): void {
    //...
  }

Telestion Client Common @wuespace/telestion-client-common

Header

• <ActionButton>s for header actions now require a isQuiet={true} attribute to work properly with React Spectrum

Loading Indicator

• The useDependencyTimeout now returns true if all dependencies are defined and false if not all dependencies are defined yet. Before the return value was inverted. (9ca4b6a)
• The loading indicator gives the children function the current dependencies which are always defined. (e482423)
• The loading indicator now supports variadic tuples for the dependency list via generics and gives the children function the current dependencies which are always defined. (e482423) Now the LoadingIndicator is simpler to use, for example:

  const [position, setPosition] = useState<Position>();
  return (
    <LoadingIndicator dependencies={[position]}>
      // "currentPos" is "position" from above but always defined
      {(currentPos) => (
        <p>{currentPos}</p>
      )}
    </LoadingIndicator>
  );

• Make useDependencyTimeout generic and usable as type guard for the dependency list. (9ca4b6a) It makes the hook useful as a condition in if-statements, for example:

  const [position, setPosition] = useState<Position>();
  
  // throws if no position received after 5 seconds
  if (useDependencyTimeout(5000, [position])) {
    // type guarded - "position" is always defined
    return <p>Latest position: {position}</p>;
  }
  
  return <p>Waiting for incoming data</p>;