khades

import * as actionTypes from "./actionTypes";

export function dispatchFirstAction(payload: string) {
  return {
    type: actionTypes.FirstAction,
    payload
  };
}

export function dispatchSecondAction(payload: number) {

khades

import * as React from "react";

function preventReconnect(timeoutIDRef: React.MutableRefObject<number>) {
  if (timeoutIDRef.current !== -1) {
    window.clearInterval(timeoutIDRef.current);
  }
}

function isEventSourceActive(eventSource: WebSocket) {
  return eventSource && eventSource.readyState === WebSocket.OPEN;

khades

function shallowClone(obj: any): any {
  if (Array.isArray(obj)) {
    return obj.slice();
  }
  return Object.assign({}, obj);
}

type Path = (number | string)[];

// set is immutable object modifier

khades

// Well, that's version that takes fetch function, and does not create it from passed params

enum FetchState {
  Failed,
  Ok,
  AliensAteIt,
  ProxyFailed,
  DoneNuthing,
  Looding,
  Whoops

khades

export function useAsyncState<T>(initialState: T): [T, (arg0: (arg0: T) => T | T) => Promise<T>] {
    const [state, setState] = React.useState(initialState);

    const setAsyncState = React.useCallback((stateUpdate: (arg0: T) => T | T): Promise<T> => {
        return new Promise<T>((resolve) => {
            setState((prevState: T) => {
                let newState = null;
                if (typeof stateUpdate === "function") {
                    newState = stateUpdate(prevState);
                } else {

khades

import * as React from "react";
import States from "../utils/states";
import * as API from "./api";
import { IChannelNames } from "./types";

export function fetchChannelNameThunk(
    channelID: string,
    channelNames: IChannelNames,
    setChannelNames: React.Dispatch<React.SetStateAction<IChannelNames>>,
    getChannelName: (channelID: string) => Promise<string> = API.getChannelName) {

khades

// So you have such component

const component = () => {
  const [robotFaceDirection, setRobotFaceDirection] = useState<number>(0);
  const [robotPositionX, setRobotPositionX] = useState<number>(0);
  const [robotPositionY, setRobotPositionY] = useState<number>(0);

  const handleOnInputXChange = (event: any) => {
    const value = event.currentTarget.value;
    setRobotPositionX(Number(value));

khades

import * as React from "react";
import States from "../utils/states";
import Context, { IChannelNameContext } from "./context";
import { IChannelNames } from "./types";
import States from "../utils/states";
import * as API from "./api";

const Container = ({ children }: { children: any }) => {
    const [channelNames, setChannelNames] = React.useState<IChannelNames>();
    const fetchChannelName = React.useCallback((channelID: string) => {

khades

import React from 'react';
import throttle from 'lodash/throttle';

class WidthListener extends React.PureComponent {
  width = 0;

  constructor(props) {
    super(props);
    this.onWidthChangeThrottled = throttle(this.onWidthChange, 200);
  }

khades

      Error: Uncaught [TypeError: Cannot read property 'baseVal' of undefined]
          at reportException (D:\projects\servbot-react-frontend\node_modules\jsdom\lib\jsdom\living\helpers\runtime-script-errors.js:66:24)
          at invokeEventListeners (D:\projects\servbot-react-frontend\node_modules\jsdom\lib\jsdom\living\events\EventTarget-impl.js:209:9)
          at HTMLUnknownElementImpl._dispatch (D:\projects\servbot-react-frontend\node_modules\jsdom\lib\jsdom\living\events\EventTarget-impl.js:119:9)
          at HTMLUnknownElementImpl.dispatchEvent (D:\projects\servbot-react-frontend\node_modules\jsdom\lib\jsdom\living\events\EventTarget-impl.js:82:17)
          at HTMLUnknownElementImpl.dispatchEvent (D:\projects\servbot-react-frontend\node_modules\jsdom\lib\jsdom\living\nodes\HTMLElement-impl.js:30:27)
          at HTMLUnknownElement.dispatchEvent (D:\projects\servbot-react-frontend\node_modules\jsdom\lib\jsdom\living\generated\EventTarget.js:157:21)
          at Object.invokeGuardedCallbackDev (D:\p