import { Alert } from "antd";
import React from "react";
import { connect } from "react-redux";
import { createStructuredSelector } from "reselect";
import {
  selectWatcherError,
  selectWatcherStatus,
} from "../../../redux/application/application.selectors";

const { ipcRenderer } = window;

const mapStateToProps = createStructuredSelector({
  watcherStatus: selectWatcherStatus,
  watcherError: selectWatcherError,
});

export function WatcherStatusAtom({ watcherStatus, watcherError }) {
  return (
    <div
      onDoubleClick={() => ipcRenderer.send("test")}
      style={{ color: watcherStatus === "Started" ? "green" : "tomato" }}
    >
      <strong>{watcherStatus}</strong>
      {watcherError && <Alert message={watcherError} />}
    </div>
  );
}
export default connect(mapStateToProps, null)(WatcherStatusAtom);
