118 lines
3.6 KiB
TypeScript
118 lines
3.6 KiB
TypeScript
import {
|
|
CheckCircleOutlined,
|
|
ExclamationCircleOutlined,
|
|
} from "@ant-design/icons";
|
|
import {
|
|
selectWatcherError,
|
|
selectWatcherStatus,
|
|
} from "@renderer/redux/app.slice";
|
|
import { useAppSelector } from "@renderer/redux/reduxHooks";
|
|
import { Alert, Button, Card, InputNumber, Space, Switch } from "antd";
|
|
import { useTranslation } from "react-i18next";
|
|
import ipcTypes from "../../../../util/ipcTypes.json";
|
|
import { useEffect, useState } from "react";
|
|
|
|
const SettingsWatcher: React.FC = () => {
|
|
const { t } = useTranslation();
|
|
const isWatcherStarted = useAppSelector(selectWatcherStatus);
|
|
const watcherError = useAppSelector(selectWatcherError);
|
|
|
|
const [pollingState, setPollingState] = useState<{
|
|
enabled: boolean;
|
|
interval: number;
|
|
}>({
|
|
enabled: false,
|
|
interval: 0,
|
|
});
|
|
|
|
console.log("*** ~ pollingState:", pollingState);
|
|
const getPollingStateFromStore = (): void => {
|
|
window.electron.ipcRenderer
|
|
.invoke(ipcTypes.toMain.settings.watcher.getpolling)
|
|
.then((storePollingState: { enabled: boolean; interval: number }) => {
|
|
console.log("*** ~ .then ~ storePollingState:", storePollingState);
|
|
setPollingState(storePollingState);
|
|
});
|
|
};
|
|
|
|
//Get state first time it renders.
|
|
useEffect(() => {
|
|
getPollingStateFromStore();
|
|
}, []);
|
|
|
|
const handleStart = (): void => {
|
|
window.electron.ipcRenderer.send(ipcTypes.toMain.watcher.start);
|
|
};
|
|
|
|
const handleStop = (): void => {
|
|
window.electron.ipcRenderer.send(ipcTypes.toMain.watcher.stop);
|
|
};
|
|
|
|
const toggleWatcherMode = (checked: boolean): void => {
|
|
window.electron.ipcRenderer
|
|
.invoke(ipcTypes.toMain.settings.watcher.setpolling, {
|
|
enabled: !checked,
|
|
interval: pollingState.interval,
|
|
})
|
|
.then((storePollingState: { enabled: boolean; interval: number }) => {
|
|
setPollingState(storePollingState);
|
|
});
|
|
};
|
|
|
|
const handlePollingIntervalChange = (value: number | null): void => {
|
|
if (value) {
|
|
window.electron.ipcRenderer
|
|
.invoke(ipcTypes.toMain.settings.watcher.setpolling, {
|
|
enabled: pollingState.enabled,
|
|
interval: value,
|
|
})
|
|
.then((storePollingState: { enabled: boolean; interval: number }) => {
|
|
setPollingState(storePollingState);
|
|
});
|
|
}
|
|
getPollingStateFromStore();
|
|
};
|
|
|
|
return (
|
|
<Card title={t("settings.labels.watcherstatus")}>
|
|
<Space>
|
|
{isWatcherStarted ? (
|
|
<Button onClick={handleStop}>
|
|
{t("settings.actions.stopwatcher")}
|
|
</Button>
|
|
) : (
|
|
<Button onClick={handleStart}>
|
|
{t("settings.actions.startwatcher")}
|
|
</Button>
|
|
)}
|
|
{isWatcherStarted ? (
|
|
<Space>
|
|
<CheckCircleOutlined style={{ color: "green" }} />
|
|
{t("settings.labels.started")}
|
|
</Space>
|
|
) : (
|
|
<Space>
|
|
<ExclamationCircleOutlined style={{ color: "tomato" }} />
|
|
{t("settings.labels.stopped")}
|
|
</Space>
|
|
)}
|
|
<Switch
|
|
checked={!pollingState.enabled}
|
|
onChange={toggleWatcherMode}
|
|
checkedChildren={t("settings.labels.watchermoderealtime")}
|
|
unCheckedChildren={t("settings.labels.watchermodepolling")}
|
|
/>
|
|
<InputNumber
|
|
title={t("settings.labels.pollinginterval")}
|
|
disabled={!pollingState.enabled}
|
|
min={1000}
|
|
value={pollingState.interval}
|
|
onChange={handlePollingIntervalChange}
|
|
/>
|
|
{watcherError && <Alert message={watcherError} />}
|
|
</Space>
|
|
</Card>
|
|
);
|
|
};
|
|
export default SettingsWatcher;
|