Farmbot-Web-App/frontend/devices/components/fbos_settings/auto_sync_row.tsx

40 lines
1.3 KiB
TypeScript

import * as React from "react";
import { Row, Col } from "../../../ui/index";
import { ToggleButton } from "../../../controls/toggle_button";
import { Content, DeviceSetting } from "../../../constants";
import { updateConfig } from "../../actions";
import { ColWidth } from "../farmbot_os_settings";
import { AutoSyncRowProps } from "./interfaces";
import { t } from "../../../i18next_wrapper";
import { Highlight } from "../maybe_highlight";
import { DevSettings } from "../../../account/dev/dev_support";
export function AutoSyncRow(props: AutoSyncRowProps) {
const autoSync = props.sourceFbosConfig("auto_sync");
const newFormat = DevSettings.futureFeaturesEnabled();
return <Highlight settingName={DeviceSetting.autoSync}>
<Row>
<Col xs={newFormat ? 9 : ColWidth.label}>
<label>
{t("AUTO SYNC")}
</label>
</Col>
{!newFormat &&
<Col xs={ColWidth.description}>
<p>
{t(Content.AUTO_SYNC)}
</p>
</Col>}
<Col xs={newFormat ? 3 : ColWidth.button}>
<ToggleButton
toggleValue={autoSync.value}
dim={!autoSync.consistent}
toggleAction={() => {
props.dispatch(updateConfig({ auto_sync: !autoSync.value }));
}} />
</Col>
</Row>
{newFormat && <Row><p>{t(Content.AUTO_SYNC)}</p></Row>}
</Highlight>;
}