import * as React from "react";
import * as ReactDOM from "react-dom";
import { AppContainer } from "react-hot-loader";

import App from "./components/App";
import { MqttApiClient } from "./mqtt";
import {Message, UiStore} from "./ui";

const client = new MqttApiClient();
client.start();
const device = client.getDevice("grinklers");
const uiStore = new UiStore();
uiStore.addMessage(new Message("asdf", "boo!", Message.Type.Error));

const rootElem = document.getElementById("app");

ReactDOM.render(<AppContainer>
    <App device={device} uiStore={uiStore} />
</AppContainer>, rootElem);

if (module.hot) {
    module.hot.accept("./components/App", () => {
        const NextApp = require<any>("./components/App").default;
        ReactDOM.render(<AppContainer>
            <App device={device} uiStore={uiStore} />
        </AppContainer>, rootElem);
    });
}