home assistant react hooks

useHass.ts

import constate from "constate";
import * as React from "react";
import {
  Connection,
  subscribeEntities,
  HassEntities,
  AuthData,
  Auth,
  createConnection
} from "home-assistant-js-websocket";

interface AppState {
  connection: Connection | undefined;
  entities: HassEntities | undefined;
}

export const [HASSProvider, useHass, useHassEntities] = constate(
  ({ authData }: { authData: AuthData }): AppState => {
    const auth = React.useMemo(() => new Auth(authData), [authData]);
    const [state, setState] = React.useState<AppState>({
      connection: undefined,
      entities: undefined
    });

    const setConnection = (connection: Connection): void =>
      setState({ ...state, connection });

    const setEntities = (entities: HassEntities): void =>
      setState({ ...state, entities });

    React.useEffect(() => {
      (async (): Promise<void> => {
        try {
          const connection = await createConnection({ auth });
          subscribeEntities(connection, setEntities);
          setConnection(connection);
        } catch (e) {
          console.log("unhandled exception connecting to hass", e);
        }
      })();
    }, []);

    return state;
  },
  value => value,
  value => value.entities
);