spacecruft
/
Farmbot-Web-App
1
0
Fork 0
Code Issues Pull Requests Releases Activity

model and version updates part 2

pull/1699/head
gabrielburnworth 2020-02-18 11:21:09 -08:00
parent 310686508f
commit a04ec59ba5
87 changed files with 1481 additions and 701 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/__tests__/attach_app_to_dom_test.ts
View File

@ -1,10 +1,9 @@
jest.mock("../util", () => {
return {
attachToRoot: jest.fn(),
// Incidental mock. Can be removed if errors go away.
trim: jest.fn(x => x)
};
});
jest.mock("../util", () => ({
attachToRoot: jest.fn(),
// Incidental mock. Can be removed if errors go away.
trim: jest.fn(x => x),
urlFriendly: jest.fn(),
}));
jest.mock("../redux/store", () => {
return { store: { dispatch: jest.fn() } };

10
frontend/__tests__/external_urls_test.ts
View File

@ -6,9 +6,9 @@ import { ExternalUrl } from "../external_urls";
describe("ExternalUrl", () => {
it("returns urls", () => {
expect(ExternalUrl.featureMinVersions)
.toEqual("https://raw.githubusercontent.com/FarmBot/farmbot_os/FEATURE_MIN_VERSIONS.json");
.toEqual("https://raw.githubusercontent.com/FarmBot/farmbot_os/staging/FEATURE_MIN_VERSIONS.json");
expect(ExternalUrl.osReleaseNotes)
.toEqual("https://raw.githubusercontent.com/FarmBot/farmbot_os/RELEASE_NOTES.md");
.toEqual("https://raw.githubusercontent.com/FarmBot/farmbot_os/staging/RELEASE_NOTES.md");
expect(ExternalUrl.latestRelease)
.toEqual("https://api.github.com/repos/FarmBot/farmbot_os/releases/latest");
expect(ExternalUrl.webAppRepo)
@ -18,16 +18,16 @@ describe("ExternalUrl", () => {
expect(ExternalUrl.softwareDocs)
.toEqual("https://software.farm.bot/docs");
expect(ExternalUrl.softwareForum)
.toEqual("http://forum.farmbot.org/c/software");
.toEqual("https://forum.farmbot.org/c/software");
expect(ExternalUrl.OpenFarm.cropApi)
.toEqual("https://openfarm.cc/api/v1/crops/");
expect(ExternalUrl.OpenFarm.cropBrowse)
.toEqual("https://openfarm.cc/crops/");
expect(ExternalUrl.OpenFarm.newCrop)
.toEqual("https://openfarm.cc/en/crops/new");
expect(ExternalUrl.Videos.desktop)
expect(ExternalUrl.Video.desktop)
.toEqual("https://cdn.shopify.com/s/files/1/2040/0289/files/Farm_Designer_Loop.mp4?9552037556691879018");
expect(ExternalUrl.Videos.mobile)
expect(ExternalUrl.Video.mobile)
.toEqual("https://cdn.shopify.com/s/files/1/2040/0289/files/Controls.png?9668345515035078097");
});
});

107
frontend/constants.ts
View File

@ -702,9 +702,9 @@ export namespace Content {
trim(`FarmBot sent a malformed message. You may need to upgrade
FarmBot OS. Please upgrade FarmBot OS and log back in.`);
export const OLD_FBOS_REC_UPGRADE = trim(`Your version of FarmBot OS is
outdated and will soon no longer be supported. Please update your device as
soon as possible.`);
export const OLD_FBOS_REC_UPGRADE =
trim(`Your version of FarmBot OS is outdated and will soon no longer
be supported. Please update your device as soon as possible.`);
export const EXPERIMENTAL_WARNING =
trim(`Warning! This is an EXPERIMENTAL feature. This feature may be
@ -812,7 +812,10 @@ export namespace Content {
trim(`add this crop on OpenFarm?`);
export const NO_TOOLS =
trim(`Press "+" to add a new tool.`);
trim(`Press "+" to add a new tool or seed container.`);
export const NO_SEED_CONTAINERS =
trim(`Press "+" to add a seed container.`);
export const MOUNTED_TOOL =
trim(`The tool currently mounted to the UTM can be set here or by using
@ -887,12 +890,23 @@ export namespace TourContent {
selecting one, and dragging it into the garden.`);
export const ADD_TOOLS =
trim(`Press edit and then the + button to add tools and seed containers.`);
trim(`Press the + button to add tools and seed containers.`);
export const ADD_SEED_CONTAINERS =
trim(`Press the + button to add seed containers.`);
export const ADD_TOOLS_AND_SLOTS =
trim(`Press the + button to add tools and seed containers. Then create
tool slots for them to by pressing the tool slot + button.`);
export const ADD_SEED_CONTAINERS_AND_SLOTS =
trim(`Press the + button to add seed containers. Then create
slots for them to by pressing the seed container slot + button.`);
export const ADD_TOOLS_SLOTS =
trim(`Add the newly created tools and seed containers to the
corresponding tool slots on FarmBot:
press edit and then + to create a tool slot.`);
press the + button to create a tool slot.`);
export const ADD_PERIPHERALS =
trim(`Press edit and then the + button to add peripherals.`);
@ -930,6 +944,87 @@ export namespace TourContent {
trim(`Toggle various settings to customize your web app experience.`);
}
export enum DeviceSetting {
// Homing and calibration
homingAndCalibration = `Homing and Calibration`,
homing = `Homing`,
calibration = `Calibration`,
setZeroPosition = `Set Zero Position`,
findHomeOnBoot = `Find Home on Boot`,
stopAtHome = `Stop at Home`,
stopAtMax = `Stop at Max`,
negativeCoordinatesOnly = `Negative Coordinates Only`,
axisLength = `Axis Length (mm)`,
// Motors
motors = `Motors`,
maxSpeed = `Max Speed (mm/s)`,
homingSpeed = `Homing Speed (mm/s)`,
minimumSpeed = `Minimum Speed (mm/s)`,
accelerateFor = `Accelerate for (mm)`,
stepsPerMm = `Steps per MM`,
microstepsPerStep = `Microsteps per step`,
alwaysPowerMotors = `Always Power Motors`,
invertMotors = `Invert Motors`,
motorCurrent = `Motor Current`,
enable2ndXMotor = `Enable 2nd X Motor`,
invert2ndXMotor = `Invert 2nd X Motor`,
// Encoders / Stall Detection
encoders = `Encoders`,
stallDetection = `Stall Detection`,
enableEncoders = `Enable Encoders`,
enableStallDetection = `Enable Stall Detection`,
stallSensitivity = `Stall Sensitivity`,
useEncodersForPositioning = `Use Encoders for Positioning`,
invertEncoders = `Invert Encoders`,
maxMissedSteps = `Max Missed Steps`,
missedStepDecay = `Missed Step Decay`,
encoderScaling = `Encoder Scaling`,
// Endstops
endstops = `Endstops`,
enableEndstops = `Enable Endstops`,
swapEndstops = `Swap Endstops`,
invertEndstops = `Invert Endstops`,
// Error handling
errorHandling = `Error Handling`,
timeoutAfter = `Timeout after (seconds)`,
maxRetries = `Max Retries`,
estopOnMovementError = `E-Stop on Movement Error`,
// Pin Guard
pinGuard = `Pin Guard`,
// Danger Zone
dangerZone = `dangerZone`,
resetHardwareParams = `Reset hardware parameter defaults`,
// Pin Bindings
pinBindings = `Pin Bindings`,
// FarmBot OS
name = `name`,
timezone = `timezone`,
camera = `camera`,
firmware = `firmware`,
farmbotOSAutoUpdate = `Farmbot OS Auto Update`,
farmbotOS = `Farmbot OS`,
autoSync = `Auto Sync`,
bootSequence = `Boot Sequence`,
// Power and Reset
powerAndReset = `Power and Reset`,
restartFarmbot = `Restart Farmbot`,
shutdownFarmbot = `Shutdown Farmbot`,
restartFirmware = `Restart Firmware`,
factoryReset = `Factory Reset`,
autoFactoryReset = `Automatic Factory Reset`,
connectionAttemptPeriod = `Connection Attempt Period`,
changeOwnership = `Change Ownership`,
}
export namespace DiagnosticMessages {
export const OK = trim(`All systems nominal.`);

2
frontend/controls/controls.tsx
View File

@ -38,6 +38,7 @@ export class RawControls extends React.Component<Props, {}> {
getWebAppConfigVal={this.props.getWebAppConfigVal} />
peripherals = () => <Peripherals
firmwareHardware={this.props.firmwareHardware}
bot={this.props.bot}
peripherals={this.props.peripherals}
dispatch={this.props.dispatch}
@ -50,6 +51,7 @@ export class RawControls extends React.Component<Props, {}> {
sensors = () => this.hideSensors
? <div id="hidden-sensors-widget" />
: <Sensors
firmwareHardware={this.props.firmwareHardware}
bot={this.props.bot}
sensors={this.props.sensors}
dispatch={this.props.dispatch}

18
frontend/controls/peripherals/__tests__/index_test.tsx
View File

@ -5,7 +5,7 @@ import { bot } from "../../../__test_support__/fake_state/bot";
import { PeripheralsProps } from "../../../devices/interfaces";
import { fakePeripheral } from "../../../__test_support__/fake_state/resources";
import { clickButton } from "../../../__test_support__/helpers";
import { SpecialStatus } from "farmbot";
import { SpecialStatus, FirmwareHardware } from "farmbot";
import { error } from "../../../toast/toast";
describe("<Peripherals />", () => {
@ -14,7 +14,8 @@ describe("<Peripherals />", () => {
bot,
peripherals: [fakePeripheral()],
dispatch: jest.fn(),
disabled: false
disabled: false,
firmwareHardware: undefined,
};
}
@ -73,11 +74,18 @@ describe("<Peripherals />", () => {
expect(p.dispatch).toHaveBeenCalled();
});
it("adds farmduino peripherals", () => {
it.each<[FirmwareHardware, number]>([
["arduino", 2],
["farmduino", 5],
["farmduino_k14", 5],
["farmduino_k15", 5],
["express_k10", 3],
])("adds peripherals: %s", (firmware, expectedAdds) => {
const p = fakeProps();
p.firmwareHardware = firmware;
const wrapper = mount(<Peripherals {...p} />);
wrapper.setState({ isEditing: true });
clickButton(wrapper, 3, "farmduino");
expect(p.dispatch).toHaveBeenCalledTimes(5);
clickButton(wrapper, 3, "stock");
expect(p.dispatch).toHaveBeenCalledTimes(expectedAdds);
});
});

38
frontend/controls/peripherals/index.tsx
View File

@ -56,12 +56,31 @@ export class Peripherals
this.props.dispatch(init("Peripheral", { pin, label }));
};
farmduinoPeripherals = () => {
this.newPeripheral(7, t("Lighting"));
this.newPeripheral(8, t("Water"));
this.newPeripheral(9, t("Vacuum"));
this.newPeripheral(10, t("Peripheral ") + "4");
this.newPeripheral(12, t("Peripheral ") + "5");
get stockPeripherals() {
switch (this.props.firmwareHardware) {
case "arduino":
return [
{ pin: 8, label: t("Water") },
{ pin: 9, label: t("Vacuum") },
];
case "farmduino":
case "farmduino_k14":
case "farmduino_k15":
default:
return [
{ pin: 7, label: t("Lighting") },
{ pin: 8, label: t("Water") },
{ pin: 9, label: t("Vacuum") },
{ pin: 10, label: t("Peripheral ") + "4" },
{ pin: 12, label: t("Peripheral ") + "5" },
];
case "express_k10":
return [
{ pin: 7, label: t("Lighting") },
{ pin: 8, label: t("Water") },
{ pin: 9, label: t("Vacuum") },
];
}
}
render() {
@ -92,10 +111,11 @@ export class Peripherals
hidden={!isEditing}
className="fb-button green"
type="button"
onClick={this.farmduinoPeripherals}>
onClick={() => this.stockPeripherals.map(p =>
this.newPeripheral(p.pin, p.label))}>
<i className="fa fa-plus" style={{ marginRight: "0.5rem" }} />
Farmduino
</button>
{t("Stock")}
</button>
</WidgetHeader>
<WidgetBody>
{this.showPins()}

11
frontend/controls/sensors/__tests__/index_test.tsx
View File

@ -18,7 +18,8 @@ describe("<Sensors />", () => {
bot,
sensors: [fakeSensor1, fakeSensor2],
dispatch: jest.fn(),
disabled: false
disabled: false,
firmwareHardware: undefined,
};
}
@ -68,8 +69,16 @@ describe("<Sensors />", () => {
it("adds stock sensors", () => {
const p = fakeProps();
const wrapper = mount(<Sensors {...p} />);
expect(wrapper.text().toLowerCase()).toContain("stock sensors");
wrapper.setState({ isEditing: true });
clickButton(wrapper, 3, "stock sensors");
expect(p.dispatch).toHaveBeenCalledTimes(2);
});
it("doesn't display + stock button", () => {
const p = fakeProps();
p.firmwareHardware = "express_k10";
const wrapper = mount(<Sensors {...p} />);
expect(wrapper.text().toLowerCase()).not.toContain("stock sensors");
});
});

7
frontend/controls/sensors/__tests__/sensor_list_test.tsx
View File

@ -100,4 +100,11 @@ describe("<SensorList/>", function () {
readSensorBtn.last().simulate("click");
expect(mockDevice.readPin).not.toHaveBeenCalled();
});
it("renders analog reading", () => {
const p = fakeProps();
p.pins[50] && (p.pins[50].value = 600);
const wrapper = mount(<SensorList {...p} />);
expect(wrapper.html()).toContain("margin-left: -3.5rem");
});
});

18
frontend/controls/sensors/index.tsx
View File

@ -10,6 +10,7 @@ import { saveAll, init } from "../../api/crud";
import { ToolTips } from "../../constants";
import { uniq } from "lodash";
import { t } from "../../i18next_wrapper";
import { isExpressBoard } from "../../devices/components/firmware_hardware_support";
export class Sensors extends React.Component<SensorsProps, SensorState> {
constructor(props: SensorsProps) {
@ -79,14 +80,15 @@ export class Sensors extends React.Component<SensorsProps, SensorState> {
onClick={() => this.newSensor()}>
<i className="fa fa-plus" />
</button>
<button
hidden={!isEditing}
className="fb-button green"
type="button"
onClick={this.stockSensors}>
<i className="fa fa-plus" style={{ marginRight: "0.5rem" }} />
{t("Stock sensors")}
</button>
{!isExpressBoard(this.props.firmwareHardware) &&
<button
hidden={!isEditing}
className="fb-button green"
type="button"
onClick={this.stockSensors}>
<i className="fa fa-plus" style={{ marginRight: "0.5rem" }} />
{t("Stock sensors")}
</button>}
</WidgetHeader>
<WidgetBody>
{this.showPins()}

1
frontend/css/_blueprint_overrides.scss
View File

@ -1,5 +1,6 @@
// Padding for the popups.
.bp3-popover-content {
z-index: 999;
padding: 1rem;
}

20
frontend/css/global.scss
View File

@ -1629,3 +1629,23 @@ textarea:focus {
}
}
}
.section {
display: block !important;
}
.highlight,
.unhighlight {
display: flex;
}
.highlight {
background-color: $light_yellow;
box-shadow: 0px 0px 7px 4px $light_yellow;
}
.unhighlight {
transition: background-color 10s linear, box-shadow 10s linear;
background-color: transparent;
box-shadow: none;
}

4
frontend/demo/demo_iframe.tsx
View File

@ -60,9 +60,9 @@ export class DemoIframe extends React.Component<{}, State> {
return <div className="demo-container">
<video muted={true} autoPlay={true} loop={true} className="demo-video">
<source src={ExternalUrl.Videos.desktop} type="video/mp4" />
<source src={ExternalUrl.Video.desktop} type="video/mp4" />
</video>
<img className="demo-phone" src={ExternalUrl.Videos.mobile} />
<img className="demo-phone" src={ExternalUrl.Video.mobile} />
<button className="demo-button" onClick={this.requestAccount}>
{this.state.stage}
</button>

3
frontend/devices/components/__tests__/boolean_mcu_input_group_test.tsx
View File

@ -7,13 +7,14 @@ import { ToggleButton } from "../../../controls/toggle_button";
import { settingToggle } from "../../actions";
import { bot } from "../../../__test_support__/fake_state/bot";
import { BooleanMCUInputGroupProps } from "../interfaces";
import { DeviceSetting } from "../../../constants";
describe("BooleanMCUInputGroup", () => {
const fakeProps = (): BooleanMCUInputGroupProps => ({
sourceFwConfig: x => ({ value: bot.hardware.mcu_params[x], consistent: true }),
dispatch: jest.fn(),
tooltip: "Tooltip",
name: "Name",
label: DeviceSetting.invertEncoders,
x: "encoder_invert_x",
y: "encoder_invert_y",
z: "encoder_invert_z",

20
frontend/devices/components/__tests__/farmbot_os_settings_test.tsx
View File

@ -22,6 +22,8 @@ import axios from "axios";
import { fakeTimeSettings } from "../../../__test_support__/fake_time_settings";
import { edit } from "../../../api/crud";
import { fakeWebAppConfig } from "../../../__test_support__/fake_state/resources";
import { formEvent } from "../../../__test_support__/fake_html_events";
import { Content } from "../../../constants";
describe("<FarmbotOsSettings />", () => {
beforeEach(() => {
@ -54,8 +56,8 @@ describe("<FarmbotOsSettings />", () => {
const osSettings = mount(<FarmbotOsSettings {...fakeProps()} />);
expect(osSettings.find("input").length).toBe(1);
expect(osSettings.find("button").length).toBe(7);
["NAME", "TIME ZONE", "FARMBOT OS", "CAMERA", "FIRMWARE"]
.map(string => expect(osSettings.text()).toContain(string));
["name", "time zone", "farmbot os", "camera", "firmware"]
.map(string => expect(osSettings.text().toLowerCase()).toContain(string));
});
it("fetches OS release notes", async () => {
@ -115,4 +117,18 @@ describe("<FarmbotOsSettings />", () => {
const osSettings = shallow(<FarmbotOsSettings {...p} />);
expect(osSettings.find("BootSequenceSelector").length).toEqual(1);
});
it("prevents default form submit action", () => {
const osSettings = shallow(<FarmbotOsSettings {...fakeProps()} />);
const e = formEvent();
osSettings.find("form").simulate("submit", e);
expect(e.preventDefault).toHaveBeenCalled();
});
it("warns about timezone mismatch", () => {
const p = fakeProps();
p.deviceAccount.body.timezone = "different";
const osSettings = mount(<FarmbotOsSettings {...p} />);
expect(osSettings.text()).toContain(Content.DIFFERENT_TZ_WARNING);
});
});

18
frontend/devices/components/__tests__/firmware_hardware_support_test.ts
View File

@ -1,4 +1,5 @@
import { boardType } from "../firmware_hardware_support";
import { boardType, getFwHardwareValue } from "../firmware_hardware_support";
import { fakeFbosConfig } from "../../../__test_support__/fake_state/resources";
describe("boardType()", () => {
it("returns Farmduino", () => {
@ -32,3 +33,18 @@ describe("boardType()", () => {
expect(boardType("none")).toEqual("none");
});
});
describe("getFwHardwareValue()", () => {
it("returns undefined", () => {
const fbosConfig = fakeFbosConfig();
fbosConfig.body.firmware_hardware = "wrong";
expect(getFwHardwareValue(fbosConfig)).toEqual(undefined);
expect(getFwHardwareValue(undefined)).toEqual(undefined);
});
it("returns real value", () => {
const fbosConfig = fakeFbosConfig();
fbosConfig.body.firmware_hardware = "express_k10";
expect(getFwHardwareValue(fbosConfig)).toEqual("express_k10");
});
});

81
frontend/devices/components/__tests__/maybe_highlight_test.tsx 100644
View File

@ -0,0 +1,81 @@
jest.mock("../../actions", () => ({
toggleControlPanel: jest.fn(),
}));
import * as React from "react";
import { mount } from "enzyme";
import {
Highlight, HighlightProps, maybeHighlight, maybeOpenPanel, highlight
} from "../maybe_highlight";
import { DeviceSetting } from "../../../constants";
import { panelState } from "../../../__test_support__/control_panel_state";
import { toggleControlPanel } from "../../actions";
describe("<Highlight />", () => {
const fakeProps = (): HighlightProps => ({
settingName: DeviceSetting.motors,
children: <div />,
className: "section",
});
it("fades highlight", () => {
const p = fakeProps();
const wrapper = mount<Highlight>(<Highlight {...p} />);
wrapper.setState({ className: "highlight" });
wrapper.instance().componentDidMount();
expect(wrapper.state().className).toEqual("unhighlight");
});
});
describe("maybeHighlight()", () => {
beforeEach(() => {
highlight.opened = false;
highlight.highlighted = false;
});
it("highlights only once", () => {
location.search = "?highlight=motors";
expect(maybeHighlight(DeviceSetting.motors)).toEqual("highlight");
expect(maybeHighlight(DeviceSetting.motors)).toEqual("");
});
it("doesn't highlight: different setting", () => {
location.search = "?highlight=name";
expect(maybeHighlight(DeviceSetting.motors)).toEqual("");
});
it("doesn't highlight: no matches", () => {
location.search = "?highlight=na";
expect(maybeHighlight(DeviceSetting.motors)).toEqual("");
});
});
describe("maybeOpenPanel()", () => {
beforeEach(() => {
highlight.opened = false;
highlight.highlighted = false;
});
it("opens panel only once", () => {
location.search = "?highlight=motors";
maybeOpenPanel(panelState())(jest.fn());
expect(toggleControlPanel).toHaveBeenCalledWith("motors");
jest.resetAllMocks();
maybeOpenPanel(panelState())(jest.fn());
expect(toggleControlPanel).not.toHaveBeenCalled();
});
it("doesn't open panel: already open", () => {
location.search = "?highlight=motors";
const panels = panelState();
panels.motors = true;
maybeOpenPanel(panels)(jest.fn());
expect(toggleControlPanel).not.toHaveBeenCalled();
});
it("doesn't open panel: no search term", () => {
location.search = "";
maybeOpenPanel(panelState())(jest.fn());
expect(toggleControlPanel).not.toHaveBeenCalled();
});
});

76
frontend/devices/components/boolean_mcu_input_group.tsx
View File

@ -4,12 +4,14 @@ import { settingToggle } from "../actions";
import { Row, Col, Help } from "../../ui/index";
import { BooleanMCUInputGroupProps } from "./interfaces";
import { Position } from "@blueprintjs/core";
import { t } from "../../i18next_wrapper";
import { Highlight } from "./maybe_highlight";
export function BooleanMCUInputGroup(props: BooleanMCUInputGroupProps) {
const {
tooltip,
name,
label,
x,
y,
z,
@ -26,40 +28,42 @@ export function BooleanMCUInputGroup(props: BooleanMCUInputGroupProps) {
const zParam = sourceFwConfig(z);
return <Row>
<Col xs={6} className={"widget-body-tooltips"}>
<label>
{name}
{caution &&
<i className="fa fa-exclamation-triangle caution-icon" />}
</label>
<Help text={tooltip} requireClick={true} position={Position.RIGHT} />
</Col>
<Col xs={2} className={"centered-button-div"}>
<ToggleButton
grayscale={grayscale?.x}
disabled={disable?.x}
dim={!xParam.consistent}
toggleValue={xParam.value}
toggleAction={() =>
dispatch(settingToggle(x, sourceFwConfig, displayAlert))} />
</Col>
<Col xs={2} className={"centered-button-div"}>
<ToggleButton
grayscale={grayscale?.y}
disabled={disable?.y}
dim={!yParam.consistent}
toggleValue={yParam.value}
toggleAction={() =>
dispatch(settingToggle(y, sourceFwConfig, displayAlert))} />
</Col>
<Col xs={2} className={"centered-button-div"}>
<ToggleButton
grayscale={grayscale?.z}
disabled={disable?.z}
dim={!zParam.consistent}
toggleValue={zParam.value}
toggleAction={() =>
dispatch(settingToggle(z, sourceFwConfig, displayAlert))} />
</Col>
<Highlight settingName={label}>
<Col xs={6} className={"widget-body-tooltips"}>
<label>
{t(label)}
{caution &&
<i className="fa fa-exclamation-triangle caution-icon" />}
</label>
<Help text={tooltip} requireClick={true} position={Position.RIGHT} />
</Col>
<Col xs={2} className={"centered-button-div"}>
<ToggleButton
grayscale={grayscale?.x}
disabled={disable?.x}
dim={!xParam.consistent}
toggleValue={xParam.value}
toggleAction={() =>
dispatch(settingToggle(x, sourceFwConfig, displayAlert))} />
</Col>
<Col xs={2} className={"centered-button-div"}>
<ToggleButton
grayscale={grayscale?.y}
disabled={disable?.y}
dim={!yParam.consistent}
toggleValue={yParam.value}
toggleAction={() =>
dispatch(settingToggle(y, sourceFwConfig, displayAlert))} />
</Col>
<Col xs={2} className={"centered-button-div"}>
<ToggleButton
grayscale={grayscale?.z}
disabled={disable?.z}
dim={!zParam.consistent}
toggleValue={zParam.value}
toggleAction={() =>
dispatch(settingToggle(z, sourceFwConfig, displayAlert))} />
</Col>
</Highlight>
</Row>;
}

59
frontend/devices/components/farmbot_os_settings.tsx
View File

@ -5,7 +5,7 @@ import { FarmbotOsProps, FarmbotOsState, Feature } from "../interfaces";
import { Widget, WidgetHeader, WidgetBody, Row, Col } from "../../ui";
import { save, edit } from "../../api/crud";
import { isBotOnline } from "../must_be_online";
import { Content } from "../../constants";
import { Content, DeviceSetting } from "../../constants";
import { TimezoneSelector } from "../timezones/timezone_selector";
import { timezoneMismatch } from "../timezones/guess_timezone";
import { CameraSelection } from "./fbos_settings/camera_selection";
@ -16,6 +16,7 @@ import { AutoSyncRow } from "./fbos_settings/auto_sync_row";
import { PowerAndReset } from "./fbos_settings/power_and_reset";
import { BootSequenceSelector } from "./fbos_settings/boot_sequence_selector";
import { ExternalUrl } from "../../external_urls";
import { Highlight } from "./maybe_highlight";
export enum ColWidth {
label = 3,
@ -85,34 +86,38 @@ export class FarmbotOsSettings
</WidgetHeader>
<WidgetBody>
<Row>
<Col xs={ColWidth.label}>
<label>
{t("NAME")}
</label>
</Col>
<Col xs={9}>
<input name="name"
onChange={this.changeBot}
onBlur={this.updateBot}
value={this.props.deviceAccount.body.name} />
</Col>
<Highlight settingName={DeviceSetting.name}>
<Col xs={ColWidth.label}>
<label>
{t(DeviceSetting.name)}
</label>
</Col>
<Col xs={9}>
<input name="name"
onChange={this.changeBot}
onBlur={this.updateBot}
value={this.props.deviceAccount.body.name} />
</Col>
</Highlight>
</Row>
<Row>
<Col xs={ColWidth.label}>
<label>
{t("TIME ZONE")}
</label>
</Col>
<Col xs={ColWidth.description}>
<div className="note">
{this.maybeWarnTz()}
</div>
<div>
<TimezoneSelector
currentTimezone={this.props.deviceAccount.body.timezone}
onUpdate={this.handleTimezone} />
</div>
</Col>
<Highlight settingName={DeviceSetting.timezone}>
<Col xs={ColWidth.label}>
<label>
{t("TIME ZONE")}
</label>
</Col>
<Col xs={ColWidth.description}>
<div className="note">
{this.maybeWarnTz()}
</div>
<div>
<TimezoneSelector
currentTimezone={this.props.deviceAccount.body.timezone}
onUpdate={this.handleTimezone} />
</div>
</Col>
</Highlight>
</Row>
<CameraSelection
env={this.props.env}

41
frontend/devices/components/fbos_settings/auto_sync_row.tsx
View File

@ -1,32 +1,35 @@
import * as React from "react";
import { Row, Col } from "../../../ui/index";
import { ToggleButton } from "../../../controls/toggle_button";
import { Content } from "../../../constants";
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";
export function AutoSyncRow(props: AutoSyncRowProps) {
const autoSync = props.sourceFbosConfig("auto_sync");
return <Row>
<Col xs={ColWidth.label}>
<label>
{t("AUTO SYNC")}
</label>
</Col>
<Col xs={ColWidth.description}>
<p>
{t(Content.AUTO_SYNC)}
</p>
</Col>
<Col xs={ColWidth.button}>
<ToggleButton
toggleValue={autoSync.value}
dim={!autoSync.consistent}
toggleAction={() => {
props.dispatch(updateConfig({ auto_sync: !autoSync.value }));
}} />
</Col>
<Highlight settingName={DeviceSetting.autoSync}>
<Col xs={ColWidth.label}>
<label>
{t("AUTO SYNC")}
</label>
</Col>
<Col xs={ColWidth.description}>
<p>
{t(Content.AUTO_SYNC)}
</p>
</Col>
<Col xs={ColWidth.button}>
<ToggleButton
toggleValue={autoSync.value}
dim={!autoSync.consistent}
toggleAction={() => {
props.dispatch(updateConfig({ auto_sync: !autoSync.value }));
}} />
</Col>
</Highlight>
</Row>;
}

39
frontend/devices/components/fbos_settings/auto_update_row.tsx
View File

@ -3,10 +3,11 @@ import { Row, Col } from "../../../ui/index";
import { ColWidth } from "../farmbot_os_settings";
import { ToggleButton } from "../../../controls/toggle_button";
import { updateConfig } from "../../actions";
import { Content } from "../../../constants";
import { Content, DeviceSetting } from "../../../constants";
import { AutoUpdateRowProps } from "./interfaces";
import { t } from "../../../i18next_wrapper";
import { OtaTimeSelector, changeOtaHour } from "./ota_time_selector";
import { Highlight } from "../maybe_highlight";
export function AutoUpdateRow(props: AutoUpdateRowProps) {
const osAutoUpdate = props.sourceFbosConfig("os_auto_update");
@ -18,23 +19,25 @@ export function AutoUpdateRow(props: AutoUpdateRowProps) {
value={props.device.body.ota_hour}
onChange={changeOtaHour(props.dispatch, props.device)} />
<Row>
<Col xs={ColWidth.label}>
<label>
{t("FARMBOT OS AUTO UPDATE")}
</label>
</Col>
<Col xs={ColWidth.description}>
<p>
{t(Content.OS_AUTO_UPDATE)}
</p>
</Col>
<Col xs={ColWidth.button}>
<ToggleButton toggleValue={osAutoUpdate.value}
dim={!osAutoUpdate.consistent}
toggleAction={() => props.dispatch(updateConfig({
os_auto_update: !osAutoUpdate.value
}))} />
</Col>
<Highlight settingName={DeviceSetting.farmbotOSAutoUpdate}>
<Col xs={ColWidth.label}>
<label>
{t(DeviceSetting.farmbotOSAutoUpdate)}
</label>
</Col>
<Col xs={ColWidth.description}>
<p>
{t(Content.OS_AUTO_UPDATE)}
</p>
</Col>
<Col xs={ColWidth.button}>
<ToggleButton toggleValue={osAutoUpdate.value}
dim={!osAutoUpdate.consistent}
toggleAction={() => props.dispatch(updateConfig({
os_auto_update: !osAutoUpdate.value
}))} />
</Col>
</Highlight>
</Row>
</div>;
}

52
frontend/devices/components/fbos_settings/board_type.tsx
View File

@ -10,6 +10,8 @@ import { FirmwareHardwareStatus } from "./firmware_hardware_status";
import {
isFwHardwareValue, getFirmwareChoices, FIRMWARE_CHOICES_DDI
} from "../firmware_hardware_support";
import { Highlight } from "../maybe_highlight";
import { DeviceSetting } from "../../../constants";
interface BoardTypeState { sending: boolean }
@ -47,30 +49,32 @@ export class BoardType extends React.Component<BoardTypeProps, BoardTypeState> {
render() {
return <Row>
<Col xs={ColWidth.label}>
<label>
{t("FIRMWARE")}
</label>
</Col>
<Col xs={ColWidth.description}>
<div>
<FBSelect
key={this.apiValue}
extraClass={this.state.sending ? "dim" : ""}
list={getFirmwareChoices()}
selectedItem={this.selectedBoard}
onChange={this.sendOffConfig} />
</div>
</Col>
<Col xs={ColWidth.button}>
<FirmwareHardwareStatus
botOnline={this.props.botOnline}
apiFirmwareValue={this.apiValue}
alerts={this.props.alerts}
bot={this.props.bot}
dispatch={this.props.dispatch}
timeSettings={this.props.timeSettings} />
</Col>
<Highlight settingName={DeviceSetting.firmware}>
<Col xs={ColWidth.label}>
<label>
{t("FIRMWARE")}
</label>
</Col>
<Col xs={ColWidth.description}>
<div>
<FBSelect
key={this.apiValue}
extraClass={this.state.sending ? "dim" : ""}
list={getFirmwareChoices()}
selectedItem={this.selectedBoard}
onChange={this.sendOffConfig} />
</div>
</Col>
<Col xs={ColWidth.button}>
<FirmwareHardwareStatus
botOnline={this.props.botOnline}
apiFirmwareValue={this.apiValue}
alerts={this.props.alerts}
bot={this.props.bot}
dispatch={this.props.dispatch}
timeSettings={this.props.timeSettings} />
</Col>
</Highlight>
</Row>;
}
}

28
frontend/devices/components/fbos_settings/boot_sequence_selector.tsx
View File

@ -9,6 +9,8 @@ import { selectAllSequences, findSequenceById } from "../../../resources/selecto
import { betterCompact } from "../../../util";
import { ColWidth } from "../farmbot_os_settings";
import { t } from "../../../i18next_wrapper";
import { Highlight } from "../maybe_highlight";
import { DeviceSetting } from "../../../constants";
interface Props {
list: DropDownItem[];
@ -56,18 +58,20 @@ export class RawBootSequenceSelector extends React.Component<Props, {}> {
render() {
return <Row>
<Col xs={ColWidth.label}>
<label>
{t("BOOT SEQUENCE")}
</label>
</Col>
<Col xs={7}>
<FBSelect
allowEmpty={true}
list={this.props.list}
selectedItem={this.props.selectedItem}
onChange={this.onChange} />
</Col>
<Highlight settingName={DeviceSetting.bootSequence}>
<Col xs={ColWidth.label}>
<label>
{t("BOOT SEQUENCE")}
</label>
</Col>
<Col xs={7}>
<FBSelect
allowEmpty={true}
list={this.props.list}
selectedItem={this.props.selectedItem}
onChange={this.onChange} />
</Col>
</Highlight>
</Row>;
}
}

35
frontend/devices/components/fbos_settings/camera_selection.tsx
View File

@ -8,7 +8,8 @@ import { getDevice } from "../../../device";
import { ColWidth } from "../farmbot_os_settings";
import { Feature, UserEnv } from "../../interfaces";
import { t } from "../../../i18next_wrapper";
import { Content, ToolTips } from "../../../constants";
import { Content, ToolTips, DeviceSetting } from "../../../constants";
import { Highlight } from "../maybe_highlight";
/** Check if the camera has been disabled. */
export const cameraDisabled = (env: UserEnv): boolean =>
@ -84,21 +85,23 @@ export class CameraSelection
render() {
return <Row>
<Col xs={ColWidth.label}>
<label>
{t("CAMERA")}
</label>
</Col>
<Col xs={ColWidth.description}>
<div>
<FBSelect
allowEmpty={false}
list={CAMERA_CHOICES()}
selectedItem={this.selectedCamera()}
onChange={this.sendOffConfig}
extraClass={this.props.botOnline ? "" : "disabled"} />
</div>
</Col>
<Highlight settingName={DeviceSetting.camera}>
<Col xs={ColWidth.label}>
<label>
{t("CAMERA")}
</label>
</Col>
<Col xs={ColWidth.description}>
<div>
<FBSelect
allowEmpty={false}
list={CAMERA_CHOICES()}
selectedItem={this.selectedCamera()}
onChange={this.sendOffConfig}
extraClass={this.props.botOnline ? "" : "disabled"} />
</div>
</Col>
</Highlight>
</Row>;
}
}

121
frontend/devices/components/fbos_settings/factory_reset_row.tsx
View File

@ -1,12 +1,13 @@
import * as React from "react";
import { Row, Col } from "../../../ui/index";
import { Content } from "../../../constants";
import { Content, DeviceSetting } from "../../../constants";
import { factoryReset, updateConfig } from "../../actions";
import { ToggleButton } from "../../../controls/toggle_button";
import { BotConfigInputBox } from "../bot_config_input_box";
import { FactoryResetRowProps } from "./interfaces";
import { ColWidth } from "../farmbot_os_settings";
import { t } from "../../../i18next_wrapper";
import { Highlight } from "../maybe_highlight";
export function FactoryResetRow(props: FactoryResetRowProps) {
const { dispatch, sourceFbosConfig, botOnline } = props;
@ -14,66 +15,72 @@ export function FactoryResetRow(props: FactoryResetRowProps) {
const maybeDisableTimer = disableFactoryReset.value ? { color: "grey" } : {};
return <div>
<Row>
<Col xs={ColWidth.label}>
<label>
{t("Factory Reset")}
</label>
</Col>
<Col xs={ColWidth.description}>
<p>
{t(Content.FACTORY_RESET_WARNING)}
</p>
</Col>
<Col xs={ColWidth.button}>
<button
className="fb-button red"
type="button"
onClick={factoryReset}
disabled={!botOnline}>
{t("FACTORY RESET")}
</button>
</Col>
<Highlight settingName={DeviceSetting.factoryReset}>
<Col xs={ColWidth.label}>
<label>
{t(DeviceSetting.factoryReset)}
</label>
</Col>
<Col xs={ColWidth.description}>
<p>
{t(Content.FACTORY_RESET_WARNING)}
</p>
</Col>
<Col xs={ColWidth.button}>
<button
className="fb-button red"
type="button"
onClick={factoryReset}
disabled={!botOnline}>
{t("FACTORY RESET")}
</button>
</Col>
</Highlight>
</Row>
<Row>
<Col xs={ColWidth.label}>
<label>
{t("Automatic Factory Reset")}
</label>
</Col>
<Col xs={ColWidth.description}>
<p>
{t(Content.AUTO_FACTORY_RESET)}
</p>
</Col>
<Col xs={ColWidth.button}>
<ToggleButton
toggleValue={!disableFactoryReset.value}
dim={!disableFactoryReset.consistent}
toggleAction={() => {
dispatch(updateConfig({
disable_factory_reset: !disableFactoryReset.value
}));
}} />
</Col>
<Highlight settingName={DeviceSetting.autoFactoryReset}>
<Col xs={ColWidth.label}>
<label>
{t(DeviceSetting.autoFactoryReset)}
</label>
</Col>
<Col xs={ColWidth.description}>
<p>
{t(Content.AUTO_FACTORY_RESET)}
</p>
</Col>
<Col xs={ColWidth.button}>
<ToggleButton
toggleValue={!disableFactoryReset.value}
dim={!disableFactoryReset.consistent}
toggleAction={() => {
dispatch(updateConfig({
disable_factory_reset: !disableFactoryReset.value
}));
}} />
</Col>
</Highlight>
</Row>
<Row>
<Col xs={ColWidth.label}>
<label style={maybeDisableTimer}>
{t("Connection Attempt Period")}
</label>
</Col>
<Col xs={ColWidth.description}>
<p style={maybeDisableTimer}>
{t(Content.AUTO_FACTORY_RESET_PERIOD)}
</p>
</Col>
<Col xs={ColWidth.button}>
<BotConfigInputBox
setting="network_not_found_timer"
dispatch={dispatch}
disabled={!!disableFactoryReset.value}
sourceFbosConfig={sourceFbosConfig} />
</Col>
<Highlight settingName={DeviceSetting.connectionAttemptPeriod}>
<Col xs={ColWidth.label}>
<label style={maybeDisableTimer}>
{t(DeviceSetting.connectionAttemptPeriod)}
</label>
</Col>
<Col xs={ColWidth.description}>
<p style={maybeDisableTimer}>
{t(Content.AUTO_FACTORY_RESET_PERIOD)}
</p>
</Col>
<Col xs={ColWidth.button}>
<BotConfigInputBox
setting="network_not_found_timer"
dispatch={dispatch}
disabled={!!disableFactoryReset.value}
sourceFbosConfig={sourceFbosConfig} />
</Col>
</Highlight>
</Row>
</div>;
}

88
frontend/devices/components/fbos_settings/farmbot_os_row.tsx
View File

@ -7,6 +7,8 @@ import { FarmbotOsRowProps } from "./interfaces";
import { FbosDetails } from "./fbos_details";
import { t } from "../../../i18next_wrapper";
import { ErrorBoundary } from "../../../error_boundary";
import { Highlight } from "../maybe_highlight";
import { DeviceSetting } from "../../../constants";
const getVersionString =
(fbosVersion: string | undefined, onBeta: boolean | undefined): string => {
@ -21,48 +23,50 @@ export function FarmbotOsRow(props: FarmbotOsRowProps) {
} = bot.hardware.informational_settings;
const version = getVersionString(controller_version, currently_on_beta);
return <Row>
<Col xs={ColWidth.label}>
<label>
{t("FARMBOT OS")}
</label>
</Col>
<Col xs={3}>
<Popover position={Position.BOTTOM_LEFT}>
<p>
{t("Version {{ version }}", { version })}
</p>
<ErrorBoundary>
<FbosDetails
botInfoSettings={bot.hardware.informational_settings}
dispatch={dispatch}
shouldDisplay={props.shouldDisplay}
sourceFbosConfig={sourceFbosConfig}
botToMqttLastSeen={props.botToMqttLastSeen}
timeSettings={props.timeSettings}
deviceAccount={props.deviceAccount} />
</ErrorBoundary>
</Popover>
</Col>
<Col xs={3}>
<Popover position={Position.BOTTOM}>
<p className="release-notes-button">
{t("Release Notes")}&nbsp;
<Highlight settingName={DeviceSetting.farmbotOS}>
<Col xs={ColWidth.label}>
<label>
{t(DeviceSetting.farmbotOS)}
</label>
</Col>
<Col xs={3}>
<Popover position={Position.BOTTOM_LEFT}>
<p>
{t("Version {{ version }}", { version })}
</p>
<ErrorBoundary>
<FbosDetails
botInfoSettings={bot.hardware.informational_settings}
dispatch={dispatch}
shouldDisplay={props.shouldDisplay}
sourceFbosConfig={sourceFbosConfig}
botToMqttLastSeen={props.botToMqttLastSeen}
timeSettings={props.timeSettings}
deviceAccount={props.deviceAccount} />
</ErrorBoundary>
</Popover>
</Col>
<Col xs={3}>
<Popover position={Position.BOTTOM}>
<p className="release-notes-button">
{t("Release Notes")}&nbsp;
<i className="fa fa-caret-down" />
</p>
<div className="release-notes">
<h1>{props.osReleaseNotesHeading}</h1>
<Markdown>
{osReleaseNotes}
</Markdown>
</div>
</Popover>
</Col>
<Col xs={3}>
<OsUpdateButton
bot={bot}
sourceFbosConfig={sourceFbosConfig}
shouldDisplay={props.shouldDisplay}
botOnline={botOnline} />
</Col>
</p>
<div className="release-notes">
<h1>{props.osReleaseNotesHeading}</h1>
<Markdown>
{osReleaseNotes}
</Markdown>
</div>
</Popover>
</Col>
<Col xs={3}>
<OsUpdateButton
bot={bot}
sourceFbosConfig={sourceFbosConfig}
shouldDisplay={props.shouldDisplay}
botOnline={botOnline} />
</Col>
</Highlight>
</Row>;
}

44
frontend/devices/components/fbos_settings/fbos_button_row.tsx
View File

@ -2,10 +2,12 @@ import * as React from "react";
import { Row, Col } from "../../../ui";
import { ColWidth } from "../farmbot_os_settings";
import { t } from "../../../i18next_wrapper";
import { Highlight } from "../maybe_highlight";
import { DeviceSetting } from "../../../constants";
export interface FbosButtonRowProps {
botOnline: boolean;
label: string;
label: DeviceSetting;
description: string;
buttonText: string;
color: string;
@ -14,24 +16,26 @@ export interface FbosButtonRowProps {
export const FbosButtonRow = (props: FbosButtonRowProps) => {
return <Row>
<Col xs={ColWidth.label}>
<label>
{t(props.label)}
</label>
</Col>
<Col xs={ColWidth.description}>
<p>
{t(props.description)}
</p>
</Col>
<Col xs={ColWidth.button}>
<button
className={`fb-button ${props.color}`}
type="button"
onClick={props.action}
disabled={!props.botOnline}>
{t(props.buttonText)}
</button>
</Col>
<Highlight settingName={props.label}>
<Col xs={ColWidth.label}>
<label>
{t(props.label)}
</label>
</Col>
<Col xs={ColWidth.description}>
<p>
{t(props.description)}
</p>
</Col>
<Col xs={ColWidth.button}>
<button
className={`fb-button ${props.color}`}
type="button"
onClick={props.action}
disabled={!props.botOnline}>
{t(props.buttonText)}
</button>
</Col>
</Highlight>
</Row>;
};

35
frontend/devices/components/fbos_settings/power_and_reset.tsx
View File

@ -5,37 +5,39 @@ import { FactoryResetRow } from "./factory_reset_row";
import { PowerAndResetProps } from "./interfaces";
import { ChangeOwnershipForm } from "./change_ownership_form";
import { FbosButtonRow } from "./fbos_button_row";
import { Content } from "../../../constants";
import { Content, DeviceSetting } from "../../../constants";
import { reboot, powerOff, restartFirmware } from "../../actions";
import { t } from "../../../i18next_wrapper";
import { Highlight } from "../maybe_highlight";
export function PowerAndReset(props: PowerAndResetProps) {
const { dispatch, sourceFbosConfig, botOnline } = props;
const { power_and_reset } = props.controlPanelState;
return <section>
return <Highlight className={"section"}
settingName={DeviceSetting.powerAndReset}>
<Header
expanded={power_and_reset}
title={t("Power and Reset")}
name={"power_and_reset"}
title={DeviceSetting.powerAndReset}
panel={"power_and_reset"}
dispatch={dispatch} />
<Collapse isOpen={!!power_and_reset}>
<FbosButtonRow
botOnline={botOnline}
label={t("RESTART FARMBOT")}
label={DeviceSetting.restartFarmbot}
description={Content.RESTART_FARMBOT}
buttonText={t("RESTART")}
color={"yellow"}
action={reboot} />
<FbosButtonRow
botOnline={botOnline}
label={t("SHUTDOWN FARMBOT")}
label={DeviceSetting.shutdownFarmbot}
description={Content.SHUTDOWN_FARMBOT}
buttonText={t("SHUTDOWN")}
color={"red"}
action={powerOff} />
<FbosButtonRow
botOnline={botOnline}
label={t("RESTART FIRMWARE")}
label={DeviceSetting.restartFirmware}
description={Content.RESTART_FIRMWARE}
buttonText={t("RESTART")}
color={"yellow"}
@ -45,14 +47,15 @@ export function PowerAndReset(props: PowerAndResetProps) {
sourceFbosConfig={sourceFbosConfig}
botOnline={botOnline} />
{botOnline &&
<Popover position={Position.BOTTOM_LEFT}>
<p className={"release-notes-button"}>
{t("Change Ownership")}&nbsp;
<i className="fa fa-caret-down" />
</p>
<ChangeOwnershipForm />
</Popover>
}
<Highlight settingName={DeviceSetting.changeOwnership}>
<Popover position={Position.BOTTOM_LEFT}>
<p className={"release-notes-button"}>
{t(DeviceSetting.changeOwnership)}&nbsp;
<i className="fa fa-caret-down" />
</p>
<ChangeOwnershipForm />
</Popover>
</Highlight>}
</Collapse>
</section>;
</Highlight>;
}

8
frontend/devices/components/firmware_hardware_support.ts
View File

@ -1,4 +1,4 @@
import { FirmwareHardware } from "farmbot";
import { FirmwareHardware, TaggedFbosConfig } from "farmbot";
export const isFwHardwareValue = (x?: unknown): x is FirmwareHardware => {
const values: FirmwareHardware[] = [
@ -10,6 +10,12 @@ export const isFwHardwareValue = (x?: unknown): x is FirmwareHardware => {
return !!values.includes(x as FirmwareHardware);
};
export const getFwHardwareValue =
(fbosConfig: TaggedFbosConfig | undefined) => {
const value = fbosConfig?.body.firmware_hardware;
return isFwHardwareValue(value) ? value : undefined;
};
const TMC_BOARDS = ["express_k10", "farmduino_k15"];
const EXPRESS_BOARDS = ["express_k10"];

4
frontend/devices/components/hardware_settings.tsx
View File

@ -18,10 +18,14 @@ import { FwParamExportMenu } from "./hardware_settings/export_menu";
import { t } from "../../i18next_wrapper";
import { PinBindings } from "./hardware_settings/pin_bindings";
import { ErrorHandling } from "./hardware_settings/error_handling";
import { maybeOpenPanel } from "./maybe_highlight";
export class HardwareSettings extends
React.Component<HardwareSettingsProps, {}> {
componentDidMount = () =>
this.props.dispatch(maybeOpenPanel(this.props.controlPanelState));
render() {
const {
bot, dispatch, sourceFwConfig, controlPanelState, firmwareConfig,

3
frontend/devices/components/hardware_settings/__tests__/calibration_row_test.tsx
View File

@ -3,6 +3,7 @@ import { mount } from "enzyme";
import { CalibrationRow } from "../calibration_row";
import { bot } from "../../../../__test_support__/fake_state/bot";
import { CalibrationRowProps } from "../../interfaces";
import { DeviceSetting } from "../../../../constants";
describe("<CalibrationRow />", () => {
const fakeProps = (): CalibrationRowProps => ({
@ -11,7 +12,7 @@ describe("<CalibrationRow />", () => {
botDisconnected: false,
action: jest.fn(),
toolTip: "calibrate",
title: "calibrate",
title: DeviceSetting.calibration,
axisTitle: "calibrate",
});

7
frontend/devices/components/hardware_settings/__tests__/header_test.tsx
View File

@ -1,16 +1,17 @@
import * as React from "react";
import { Header } from "../header";
import { mount } from "enzyme";
import { DeviceSetting } from "../../../../constants";
describe("<Header/>", () => {
it("renders", () => {
const fn = jest.fn();
const el = mount(<Header
title="FOO"
title={DeviceSetting.motors}
expanded={true}
name={"motors"}
panel={"motors"}
dispatch={fn} />);
expect(el.text()).toContain("FOO");
expect(el.text().toLowerCase()).toContain("motors");
expect(el.find(".fa-minus").length).toBe(1);
});
});

41
frontend/devices/components/hardware_settings/calibration_row.tsx
View File

@ -5,30 +5,33 @@ import { Row, Col, Help } from "../../../ui/index";
import { CalibrationRowProps } from "../interfaces";
import { t } from "../../../i18next_wrapper";
import { Position } from "@blueprintjs/core";
import { Highlight } from "../maybe_highlight";
export function CalibrationRow(props: CalibrationRowProps) {
const { hardware, botDisconnected } = props;
return <Row>
<Col xs={6} className={"widget-body-tooltips"}>
<label>
{t(props.title)}
</label>
<Help text={t(props.toolTip)}
requireClick={true} position={Position.RIGHT} />
</Col>
{axisTrackingStatus(hardware)
.map(row => {
const { axis } = row;
const hardwareDisabled = props.type == "zero" ? false : row.disabled;
return <Col xs={2} key={axis} className={"centered-button-div"}>
<LockableButton
disabled={hardwareDisabled || botDisconnected}
onClick={() => props.action(axis)}>
{`${t(props.axisTitle)} ${axis}`}
</LockableButton>
</Col>;
})}
<Highlight settingName={props.title}>
<Col xs={6} className={"widget-body-tooltips"}>
<label>
{t(props.title)}
</label>
<Help text={t(props.toolTip)}
requireClick={true} position={Position.RIGHT} />
</Col>
{axisTrackingStatus(hardware)
.map(row => {
const { axis } = row;
const hardwareDisabled = props.type == "zero" ? false : row.disabled;
return <Col xs={2} key={axis} className={"centered-button-div"}>
<LockableButton
disabled={hardwareDisabled || botDisconnected}
onClick={() => props.action(axis)}>
{`${t(props.axisTitle)} ${axis}`}
</LockableButton>
</Col>;
})}
</Highlight>
</Row>;
}

50
frontend/devices/components/hardware_settings/danger_zone.tsx
View File

@ -3,41 +3,45 @@ import { DangerZoneProps } from "../interfaces";
import { Row, Col } from "../../../ui/index";
import { Header } from "./header";
import { Collapse } from "@blueprintjs/core";
import { Content } from "../../../constants";
import { Content, DeviceSetting } from "../../../constants";
import { t } from "../../../i18next_wrapper";
import { Highlight } from "../maybe_highlight";
export function DangerZone(props: DangerZoneProps) {
const { dispatch, onReset, botDisconnected } = props;
const { danger_zone } = props.controlPanelState;
return <section>
return <Highlight className={"section"}
settingName={DeviceSetting.dangerZone}>
<Header
expanded={danger_zone}
title={t("Danger Zone")}
name={"danger_zone"}
title={DeviceSetting.dangerZone}
panel={"danger_zone"}
dispatch={dispatch} />
<Collapse isOpen={!!danger_zone}>
<Row>
<Col xs={4}>
<label>
{t("Reset hardware parameter defaults")}
</label>
</Col>
<Col xs={6}>
<p>
{t(Content.RESTORE_DEFAULT_HARDWARE_SETTINGS)}
</p>
</Col>
<Col xs={2} className={"centered-button-div"}>
<button
className="fb-button red"
disabled={botDisconnected}
onClick={onReset}>
{t("RESET")}
</button>
</Col>
<Highlight settingName={DeviceSetting.resetHardwareParams}>
<Col xs={4}>
<label>
{t(DeviceSetting.resetHardwareParams)}
</label>
</Col>
<Col xs={6}>
<p>
{t(Content.RESTORE_DEFAULT_HARDWARE_SETTINGS)}
</p>
</Col>
<Col xs={2} className={"centered-button-div"}>
<button
className="fb-button red"
disabled={botDisconnected}
onClick={onReset}>
{t("RESET")}
</button>
</Col>
</Highlight>
</Row>
</Collapse>
</section>;
</Highlight>;
}

33
frontend/devices/components/hardware_settings/encoders.tsx
View File

@ -1,12 +1,12 @@
import * as React from "react";
import { BooleanMCUInputGroup } from "../boolean_mcu_input_group";
import { ToolTips } from "../../../constants";
import { ToolTips, DeviceSetting } from "../../../constants";
import { NumericMCUInputGroup } from "../numeric_mcu_input_group";
import { EncodersProps } from "../interfaces";
import { Header } from "./header";
import { Collapse } from "@blueprintjs/core";
import { t } from "../../../i18next_wrapper";
import { isExpressBoard } from "../firmware_hardware_support";
import { Highlight } from "../maybe_highlight";
export function Encoders(props: EncodersProps) {
@ -20,19 +20,20 @@ export function Encoders(props: EncodersProps) {
};
const isExpress = isExpressBoard(firmwareHardware);
return <section>
return <Highlight className={"section"}
settingName={DeviceSetting.encoders}>
<Header
expanded={encoders}
title={isExpress
? t("Stall Detection")
: t("Encoders")}
name={"encoders"}
? DeviceSetting.stallDetection
: DeviceSetting.encoders}
panel={"encoders"}
dispatch={dispatch} />
<Collapse isOpen={!!encoders}>
<BooleanMCUInputGroup
name={isExpress
? t("Enable Stall Detection")
: t("Enable Encoders")}
label={isExpress
? DeviceSetting.enableStallDetection
: DeviceSetting.enableEncoders}
tooltip={isExpress
? ToolTips.ENABLE_STALL_DETECTION
: ToolTips.ENABLE_ENCODERS}
@ -43,7 +44,7 @@ export function Encoders(props: EncodersProps) {
sourceFwConfig={sourceFwConfig} />
{isExpress &&
<NumericMCUInputGroup
name={t("Stall Sensitivity")}
label={DeviceSetting.stallSensitivity}
tooltip={ToolTips.STALL_SENSITIVITY}
x={"movement_stall_sensitivity_x"}
y={"movement_stall_sensitivity_y"}
@ -53,7 +54,7 @@ export function Encoders(props: EncodersProps) {
sourceFwConfig={sourceFwConfig} />}
{!isExpress &&
<BooleanMCUInputGroup
name={t("Use Encoders for Positioning")}
label={DeviceSetting.useEncodersForPositioning}
tooltip={ToolTips.ENCODER_POSITIONING}
x={"encoder_use_for_pos_x"}
y={"encoder_use_for_pos_y"}
@ -63,7 +64,7 @@ export function Encoders(props: EncodersProps) {
sourceFwConfig={sourceFwConfig} />}
{!isExpress &&
<BooleanMCUInputGroup
name={t("Invert Encoders")}
label={DeviceSetting.invertEncoders}
tooltip={ToolTips.INVERT_ENCODERS}
x={"encoder_invert_x"}
y={"encoder_invert_y"}
@ -72,7 +73,7 @@ export function Encoders(props: EncodersProps) {
dispatch={dispatch}
sourceFwConfig={sourceFwConfig} />}
<NumericMCUInputGroup
name={t("Max Missed Steps")}
label={DeviceSetting.maxMissedSteps}
tooltip={isExpress
? ToolTips.MAX_MISSED_STEPS_STALL_DETECTION
: ToolTips.MAX_MISSED_STEPS_ENCODERS}
@ -83,7 +84,7 @@ export function Encoders(props: EncodersProps) {
sourceFwConfig={sourceFwConfig}
dispatch={dispatch} />
<NumericMCUInputGroup
name={t("Missed Step Decay")}
label={DeviceSetting.missedStepDecay}
tooltip={ToolTips.MISSED_STEP_DECAY}
x={"encoder_missed_steps_decay_x"}
y={"encoder_missed_steps_decay_y"}
@ -93,7 +94,7 @@ export function Encoders(props: EncodersProps) {
dispatch={dispatch} />
{!isExpress &&
<NumericMCUInputGroup
name={t("Encoder Scaling")}
label={DeviceSetting.encoderScaling}
tooltip={ToolTips.ENCODER_SCALING}
x={"encoder_scaling_x"}
y={"encoder_scaling_y"}
@ -106,5 +107,5 @@ export function Encoders(props: EncodersProps) {
sourceFwConfig={sourceFwConfig}
dispatch={dispatch} />}
</Collapse>
</section>;
</Highlight>;
}

19
frontend/devices/components/hardware_settings/endstops.tsx
View File

@ -1,25 +1,26 @@
import * as React from "react";
import { BooleanMCUInputGroup } from "../boolean_mcu_input_group";
import { ToolTips } from "../../../constants";
import { ToolTips, DeviceSetting } from "../../../constants";
import { EndStopsProps } from "../interfaces";
import { Header } from "./header";
import { Collapse } from "@blueprintjs/core";
import { t } from "../../../i18next_wrapper";
import { Highlight } from "../maybe_highlight";
export function EndStops(props: EndStopsProps) {
const { endstops } = props.controlPanelState;
const { dispatch, sourceFwConfig } = props;
return <section>
return <Highlight className={"section"}
settingName={DeviceSetting.endstops}>
<Header
expanded={endstops}
title={"Endstops"}
name={"endstops"}
title={DeviceSetting.endstops}
panel={"endstops"}
dispatch={dispatch} />
<Collapse isOpen={!!endstops}>
<BooleanMCUInputGroup
name={t("Enable Endstops")}
label={DeviceSetting.enableEndstops}
tooltip={ToolTips.ENABLE_ENDSTOPS}
x={"movement_enable_endpoints_x"}
y={"movement_enable_endpoints_y"}
@ -27,7 +28,7 @@ export function EndStops(props: EndStopsProps) {
dispatch={dispatch}
sourceFwConfig={sourceFwConfig} />
<BooleanMCUInputGroup
name={t("Swap Endstops")}
label={DeviceSetting.swapEndstops}
tooltip={ToolTips.SWAP_ENDPOINTS}
x={"movement_invert_endpoints_x"}
y={"movement_invert_endpoints_y"}
@ -40,7 +41,7 @@ export function EndStops(props: EndStopsProps) {
dispatch={dispatch}
sourceFwConfig={sourceFwConfig} />
<BooleanMCUInputGroup
name={t("Invert Endstops")}
label={DeviceSetting.invertEndstops}
tooltip={ToolTips.INVERT_ENDPOINTS}
x={"movement_invert_2_endpoints_x"}
y={"movement_invert_2_endpoints_y"}
@ -53,5 +54,5 @@ export function EndStops(props: EndStopsProps) {
dispatch={dispatch}
sourceFwConfig={sourceFwConfig} />
</Collapse>
</section>;
</Highlight>;
}

19
frontend/devices/components/hardware_settings/error_handling.tsx
View File

@ -1,14 +1,14 @@
import * as React from "react";
import { NumericMCUInputGroup } from "../numeric_mcu_input_group";
import { ToolTips } from "../../../constants";
import { ToolTips, DeviceSetting } from "../../../constants";
import { ErrorHandlingProps } from "../interfaces";
import { Header } from "./header";
import { Collapse } from "@blueprintjs/core";
import { t } from "../../../i18next_wrapper";
import { McuInputBox } from "../mcu_input_box";
import { settingToggle } from "../../actions";
import { SingleSettingRow } from "./single_setting_row";
import { ToggleButton } from "../../../controls/toggle_button";
import { Highlight } from "../maybe_highlight";
export function ErrorHandling(props: ErrorHandlingProps) {
@ -16,15 +16,16 @@ export function ErrorHandling(props: ErrorHandlingProps) {
const { dispatch, sourceFwConfig } = props;
const eStopOnMoveError = sourceFwConfig("param_e_stop_on_mov_err");
return <section>
return <Highlight className={"section"}
settingName={DeviceSetting.errorHandling}>
<Header
expanded={error_handling}
title={"Error Handling"}
name={"error_handling"}
title={DeviceSetting.errorHandling}
panel={"error_handling"}
dispatch={dispatch} />
<Collapse isOpen={!!error_handling}>
<NumericMCUInputGroup
name={t("Timeout after (seconds)")}
label={DeviceSetting.timeoutAfter}
tooltip={ToolTips.TIMEOUT_AFTER}
x={"movement_timeout_x"}
y={"movement_timeout_y"}
@ -32,7 +33,7 @@ export function ErrorHandling(props: ErrorHandlingProps) {
sourceFwConfig={sourceFwConfig}
dispatch={dispatch} />
<SingleSettingRow settingType="input"
label={t("Max Retries")}
label={DeviceSetting.maxRetries}
tooltip={ToolTips.MAX_MOVEMENT_RETRIES}>
<McuInputBox
setting="param_mov_nr_retry"
@ -40,7 +41,7 @@ export function ErrorHandling(props: ErrorHandlingProps) {
dispatch={dispatch} />
</SingleSettingRow>
<SingleSettingRow settingType="button"
label={t("E-Stop on Movement Error")}
label={DeviceSetting.estopOnMovementError}
tooltip={ToolTips.E_STOP_ON_MOV_ERR}>
<ToggleButton
toggleValue={eStopOnMoveError.value}
@ -49,5 +50,5 @@ export function ErrorHandling(props: ErrorHandlingProps) {
settingToggle("param_e_stop_on_mov_err", sourceFwConfig))} />
</SingleSettingRow>
</Collapse>
</section>;
</Highlight>;
}

12
frontend/devices/components/hardware_settings/header.tsx
View File

@ -2,18 +2,20 @@ import * as React from "react";
import { ControlPanelState } from "../../interfaces";
import { toggleControlPanel } from "../../actions";
import { ExpandableHeader } from "../../../ui/expandable_header";
import { t } from "../../../i18next_wrapper";
import { DeviceSetting } from "../../../constants";
interface Props {
dispatch: Function;
name: keyof ControlPanelState;
title: string;
panel: keyof ControlPanelState;
title: DeviceSetting;
expanded: boolean;
}
export const Header = (props: Props) => {
const { dispatch, name, title, expanded } = props;
const { dispatch, panel, title, expanded } = props;
return <ExpandableHeader
expanded={expanded}
title={title}
onClick={() => dispatch(toggleControlPanel(name))} />;
title={t(title)}
onClick={() => dispatch(toggleControlPanel(panel))} />;
};

28
frontend/devices/components/hardware_settings/homing_and_calibration.tsx
View File

@ -1,6 +1,6 @@
import * as React from "react";
import { BooleanMCUInputGroup } from "../boolean_mcu_input_group";
import { ToolTips } from "../../../constants";
import { ToolTips, DeviceSetting } from "../../../constants";
import { NumericMCUInputGroup } from "../numeric_mcu_input_group";
import { CalibrationRow } from "./calibration_row";
import { disabledAxisMap } from "../axis_tracking_status";
@ -13,6 +13,7 @@ import { isExpressBoard } from "../firmware_hardware_support";
import { getDevice } from "../../../device";
import { commandErr } from "../../actions";
import { CONFIG_DEFAULTS } from "farmbot/dist/config";
import { Highlight } from "../maybe_highlight";
export function HomingAndCalibration(props: HomingAndCalibrationProps) {
@ -31,16 +32,17 @@ export function HomingAndCalibration(props: HomingAndCalibrationProps) {
const scale = calculateScale(sourceFwConfig);
return <section>
return <Highlight className={"section"}
settingName={DeviceSetting.homingAndCalibration}>
<Header
title={t("Homing and Calibration")}
name={"homing_and_calibration"}
title={DeviceSetting.homingAndCalibration}
panel={"homing_and_calibration"}
dispatch={dispatch}
expanded={homing_and_calibration} />
<Collapse isOpen={!!homing_and_calibration}>
<CalibrationRow
type={"find_home"}
title={t("HOMING")}
title={DeviceSetting.homing}
axisTitle={t("FIND HOME")}
toolTip={isExpressBoard(firmwareHardware)
? ToolTips.HOMING_STALL_DETECTION
@ -52,7 +54,7 @@ export function HomingAndCalibration(props: HomingAndCalibrationProps) {
botDisconnected={botDisconnected} />
<CalibrationRow
type={"calibrate"}
title={t("CALIBRATION")}
title={DeviceSetting.calibration}
axisTitle={t("CALIBRATE")}
toolTip={isExpressBoard(firmwareHardware)
? ToolTips.CALIBRATION_STALL_DETECTION
@ -63,7 +65,7 @@ export function HomingAndCalibration(props: HomingAndCalibrationProps) {
botDisconnected={botDisconnected} />
<CalibrationRow
type={"zero"}
title={t("SET ZERO POSITION")}
title={DeviceSetting.setZeroPosition}
axisTitle={t("ZERO")}
toolTip={ToolTips.SET_ZERO_POSITION}
action={axis => getDevice().setZero(axis)
@ -71,7 +73,7 @@ export function HomingAndCalibration(props: HomingAndCalibrationProps) {
hardware={hardware}
botDisconnected={botDisconnected} />
<BooleanMCUInputGroup
name={t("Find Home on Boot")}
label={DeviceSetting.findHomeOnBoot}
tooltip={isExpressBoard(firmwareHardware)
? ToolTips.FIND_HOME_ON_BOOT_STALL_DETECTION
: ToolTips.FIND_HOME_ON_BOOT_ENCODERS}
@ -83,7 +85,7 @@ export function HomingAndCalibration(props: HomingAndCalibrationProps) {
sourceFwConfig={sourceFwConfig}
caution={true} />
<BooleanMCUInputGroup
name={t("Stop at Home")}
label={DeviceSetting.stopAtHome}
tooltip={ToolTips.STOP_AT_HOME}
x={"movement_stop_at_home_x"}
y={"movement_stop_at_home_y"}
@ -91,7 +93,7 @@ export function HomingAndCalibration(props: HomingAndCalibrationProps) {
dispatch={dispatch}
sourceFwConfig={sourceFwConfig} />
<BooleanMCUInputGroup
name={t("Stop at Max")}
label={DeviceSetting.stopAtMax}
tooltip={ToolTips.STOP_AT_MAX}
x={"movement_stop_at_max_x"}
y={"movement_stop_at_max_y"}
@ -99,7 +101,7 @@ export function HomingAndCalibration(props: HomingAndCalibrationProps) {
dispatch={dispatch}
sourceFwConfig={sourceFwConfig} />
<BooleanMCUInputGroup
name={t("Negative Coordinates Only")}
label={DeviceSetting.negativeCoordinatesOnly}
tooltip={ToolTips.NEGATIVE_COORDINATES_ONLY}
x={"movement_home_up_x"}
y={"movement_home_up_y"}
@ -107,7 +109,7 @@ export function HomingAndCalibration(props: HomingAndCalibrationProps) {
dispatch={dispatch}
sourceFwConfig={sourceFwConfig} />
<NumericMCUInputGroup
name={t("Axis Length (mm)")}
label={DeviceSetting.axisLength}
tooltip={ToolTips.LENGTH}
x={"movement_axis_nr_steps_x"}
y={"movement_axis_nr_steps_y"}
@ -124,5 +126,5 @@ export function HomingAndCalibration(props: HomingAndCalibrationProps) {
dispatch={dispatch}
intSize={"long"} />
</Collapse>
</section>;
</Highlight>;
}

35
frontend/devices/components/hardware_settings/motors.tsx
View File

@ -1,18 +1,18 @@
import * as React from "react";
import { BooleanMCUInputGroup } from "../boolean_mcu_input_group";
import { ToolTips } from "../../../constants";
import { ToolTips, DeviceSetting } from "../../../constants";
import { ToggleButton } from "../../../controls/toggle_button";
import { settingToggle } from "../../actions";
import { NumericMCUInputGroup } from "../numeric_mcu_input_group";
import { MotorsProps } from "../interfaces";
import { Header } from "./header";
import { Collapse } from "@blueprintjs/core";
import { t } from "../../../i18next_wrapper";
import { Xyz, McuParamName } from "farmbot";
import { SourceFwConfig } from "../../interfaces";
import { calcMicrostepsPerMm } from "../../../controls/move/direction_axes_props";
import { isTMCBoard } from "../firmware_hardware_support";
import { SingleSettingRow } from "./single_setting_row";
import { Highlight } from "../maybe_highlight";
export const calculateScale =
(sourceFwConfig: SourceFwConfig): Record<Xyz, number | undefined> => {
@ -35,15 +35,16 @@ export function Motors(props: MotorsProps) {
const invert2ndXMotor = sourceFwConfig("movement_secondary_motor_invert_x");
const scale = calculateScale(sourceFwConfig);
return <section>
return <Highlight className={"section"}
settingName={DeviceSetting.motors}>
<Header
expanded={controlPanelState.motors}
title={t("Motors")}
name={"motors"}
title={DeviceSetting.motors}
panel={"motors"}
dispatch={dispatch} />
<Collapse isOpen={!!controlPanelState.motors}>
<NumericMCUInputGroup
name={t("Max Speed (mm/s)")}
label={DeviceSetting.maxSpeed}
tooltip={ToolTips.MAX_SPEED}
x={"movement_max_spd_x"}
y={"movement_max_spd_y"}
@ -54,7 +55,7 @@ export function Motors(props: MotorsProps) {
sourceFwConfig={sourceFwConfig}
dispatch={dispatch} />
<NumericMCUInputGroup
name={t("Homing Speed (mm/s)")}
label={DeviceSetting.homingSpeed}
tooltip={ToolTips.HOME_SPEED}
x={"movement_home_spd_x"}
y={"movement_home_spd_y"}
@ -65,7 +66,7 @@ export function Motors(props: MotorsProps) {
sourceFwConfig={sourceFwConfig}
dispatch={dispatch} />
<NumericMCUInputGroup
name={t("Minimum Speed (mm/s)")}
label={DeviceSetting.minimumSpeed}
tooltip={ToolTips.MIN_SPEED}
x={"movement_min_spd_x"}
y={"movement_min_spd_y"}
@ -76,7 +77,7 @@ export function Motors(props: MotorsProps) {
sourceFwConfig={sourceFwConfig}
dispatch={dispatch} />
<NumericMCUInputGroup
name={t("Accelerate for (mm)")}
label={DeviceSetting.accelerateFor}
tooltip={ToolTips.ACCELERATE_FOR}
x={"movement_steps_acc_dec_x"}
y={"movement_steps_acc_dec_y"}
@ -87,7 +88,7 @@ export function Motors(props: MotorsProps) {
sourceFwConfig={sourceFwConfig}
dispatch={dispatch} />
<NumericMCUInputGroup
name={t("Steps per MM")}
label={DeviceSetting.stepsPerMm}
tooltip={ToolTips.STEPS_PER_MM}
x={"movement_step_per_mm_x"}
y={"movement_step_per_mm_y"}
@ -99,7 +100,7 @@ export function Motors(props: MotorsProps) {
sourceFwConfig={props.sourceFwConfig}
dispatch={props.dispatch} />
<NumericMCUInputGroup
name={t("Microsteps per step")}
label={DeviceSetting.microstepsPerStep}
tooltip={ToolTips.MICROSTEPS_PER_STEP}
x={"movement_microsteps_x"}
y={"movement_microsteps_y"}
@ -107,7 +108,7 @@ export function Motors(props: MotorsProps) {
sourceFwConfig={props.sourceFwConfig}
dispatch={props.dispatch} />
<BooleanMCUInputGroup
name={t("Always Power Motors")}
label={DeviceSetting.alwaysPowerMotors}
tooltip={ToolTips.ALWAYS_POWER_MOTORS}
x={"movement_keep_active_x"}
y={"movement_keep_active_y"}
@ -115,7 +116,7 @@ export function Motors(props: MotorsProps) {
dispatch={dispatch}
sourceFwConfig={sourceFwConfig} />
<BooleanMCUInputGroup
name={t("Invert Motors")}
label={DeviceSetting.invertMotors}
tooltip={ToolTips.INVERT_MOTORS}
x={"movement_invert_motor_x"}
y={"movement_invert_motor_y"}
@ -124,7 +125,7 @@ export function Motors(props: MotorsProps) {
sourceFwConfig={sourceFwConfig} />
{isTMCBoard(firmwareHardware) &&
<NumericMCUInputGroup
name={t("Motor Current")}
label={DeviceSetting.motorCurrent}
tooltip={ToolTips.MOTOR_CURRENT}
x={"movement_motor_current_x"}
y={"movement_motor_current_y"}
@ -132,7 +133,7 @@ export function Motors(props: MotorsProps) {
dispatch={dispatch}
sourceFwConfig={sourceFwConfig} />}
<SingleSettingRow settingType="button"
label={t("Enable 2nd X Motor")}
label={DeviceSetting.enable2ndXMotor}
tooltip={ToolTips.ENABLE_X2_MOTOR}>
<ToggleButton
toggleValue={enable2ndXMotor.value}
@ -141,7 +142,7 @@ export function Motors(props: MotorsProps) {
settingToggle("movement_secondary_motor_x", sourceFwConfig))} />
</SingleSettingRow>
<SingleSettingRow settingType="button"
label={t("Invert 2nd X Motor")}
label={DeviceSetting.invert2ndXMotor}
tooltip={ToolTips.INVERT_MOTORS}>
<ToggleButton
grayscale={!enable2ndXMotor.value}
@ -151,5 +152,5 @@ export function Motors(props: MotorsProps) {
settingToggle("movement_secondary_motor_invert_x", sourceFwConfig))} />
</SingleSettingRow>
</Collapse>
</section>;
</Highlight>;
}

11
frontend/devices/components/hardware_settings/pin_bindings.tsx
View File

@ -3,20 +3,23 @@ import { PinBindingsProps } from "../interfaces";
import { Header } from "./header";
import { Collapse } from "@blueprintjs/core";
import { PinBindingsContent } from "../../pin_bindings/pin_bindings";
import { DeviceSetting } from "../../../constants";
import { Highlight } from "../maybe_highlight";
export function PinBindings(props: PinBindingsProps) {
const { pin_bindings } = props.controlPanelState;
const { dispatch, resources } = props;
return <section>
return <Highlight className={"section"}
settingName={DeviceSetting.pinBindings}>
<Header
expanded={pin_bindings}
title={"Pin Bindings"}
name={"pin_bindings"}
title={DeviceSetting.pinBindings}
panel={"pin_bindings"}
dispatch={dispatch} />
<Collapse isOpen={!!pin_bindings}>
<PinBindingsContent dispatch={dispatch} resources={resources} />
</Collapse>
</section>;
</Highlight>;
}

12
frontend/devices/components/hardware_settings/pin_guard.tsx
View File

@ -4,19 +4,21 @@ import { PinGuardProps } from "../interfaces";
import { Header } from "./header";
import { Collapse, Position } from "@blueprintjs/core";
import { Row, Col, Help } from "../../../ui/index";
import { ToolTips } from "../../../constants";
import { ToolTips, DeviceSetting } from "../../../constants";
import { t } from "../../../i18next_wrapper";
import { Highlight } from "../maybe_highlight";
export function PinGuard(props: PinGuardProps) {
const { pin_guard } = props.controlPanelState;
const { dispatch, sourceFwConfig, resources } = props;
return <section>
return <Highlight className={"section"}
settingName={DeviceSetting.pinGuard}>
<Header
expanded={pin_guard}
title={t("Pin Guard")}
name={"pin_guard"}
title={DeviceSetting.pinGuard}
panel={"pin_guard"}
dispatch={dispatch} />
<Collapse isOpen={!!pin_guard}>
<Row>
@ -79,5 +81,5 @@ export function PinGuard(props: PinGuardProps) {
resources={resources}
sourceFwConfig={sourceFwConfig} />
</Collapse>
</section>;
</Highlight>;
}

33
frontend/devices/components/hardware_settings/single_setting_row.tsx
View File

@ -1,20 +1,27 @@
import * as React from "react";
import { Row, Col, Help } from "../../../ui/index";
import { Position } from "@blueprintjs/core";
import { DeviceSetting } from "../../../constants";
import { Highlight } from "../maybe_highlight";
import { t } from "../../../i18next_wrapper";
export interface SingleSettingRowProps {
label: DeviceSetting;
tooltip: string;
children: React.ReactChild;
settingType: "button" | "input";
}
export const SingleSettingRow =
({ label, tooltip, settingType, children }: {
label: string,
tooltip: string,
children: React.ReactChild,
settingType: "button" | "input",
}) =>
({ label, tooltip, settingType, children }: SingleSettingRowProps) =>
<Row>
<Col xs={6} className={"widget-body-tooltips"}>
<label>{label}</label>
<Help text={tooltip} requireClick={true} position={Position.RIGHT} />
</Col>
{settingType === "button"
? <Col xs={2} className={"centered-button-div"}>{children}</Col>
: <Col xs={6}>{children}</Col>}
<Highlight settingName={label}>
<Col xs={6} className={"widget-body-tooltips"}>
<label>{t(label)}</label>
<Help text={tooltip} requireClick={true} position={Position.RIGHT} />
</Col>
{settingType === "button"
? <Col xs={2} className={"centered-button-div"}>{children}</Col>
: <Col xs={6}>{children}</Col>}
</Highlight>
</Row>;

7
frontend/devices/components/interfaces.ts
View File

@ -6,6 +6,7 @@ import { McuParamName, McuParams, FirmwareHardware } from "farmbot/dist";
import { IntegerSize } from "../../util";
import { FirmwareConfig } from "farmbot/dist/resources/configs/firmware";
import { ResourceIndex } from "../../resources/interfaces";
import { DeviceSetting } from "../../constants";
export interface ZeroRowProps {
botDisconnected: boolean;
@ -25,7 +26,7 @@ export interface BooleanMCUInputGroupProps {
sourceFwConfig: SourceFwConfig;
dispatch: Function;
tooltip: string;
name: string;
label: DeviceSetting;
x: McuParamName;
y: McuParamName;
z: McuParamName;
@ -41,7 +42,7 @@ export interface CalibrationRowProps {
botDisconnected: boolean;
action(axis: Axis): void;
toolTip: string;
title: string;
title: DeviceSetting;
axisTitle: string;
}
@ -49,7 +50,7 @@ export interface NumericMCUInputGroupProps {
sourceFwConfig: SourceFwConfig;
dispatch: Function;
tooltip: string;
name: string;
label: DeviceSetting;
x: McuParamName;
xScale?: number;
y: McuParamName;

162
frontend/devices/components/maybe_highlight.tsx 100644
View File

@ -0,0 +1,162 @@
import * as React from "react";
import { ControlPanelState } from "../interfaces";
import { toggleControlPanel } from "../actions";
import { urlFriendly } from "../../util";
import { DeviceSetting } from "../../constants";
const HOMING_PANEL = [
DeviceSetting.homingAndCalibration,
DeviceSetting.homing,
DeviceSetting.calibration,
DeviceSetting.setZeroPosition,
DeviceSetting.findHomeOnBoot,
DeviceSetting.stopAtHome,
DeviceSetting.stopAtMax,
DeviceSetting.negativeCoordinatesOnly,
DeviceSetting.axisLength,
];
const MOTORS_PANEL = [
DeviceSetting.motors,
DeviceSetting.maxSpeed,
DeviceSetting.homingSpeed,
DeviceSetting.minimumSpeed,
DeviceSetting.accelerateFor,
DeviceSetting.stepsPerMm,
DeviceSetting.microstepsPerStep,
DeviceSetting.alwaysPowerMotors,
DeviceSetting.invertMotors,
DeviceSetting.motorCurrent,
DeviceSetting.enable2ndXMotor,
DeviceSetting.invert2ndXMotor,
];
const ENCODERS_PANEL = [
DeviceSetting.encoders,
DeviceSetting.stallDetection,
DeviceSetting.enableEncoders,
DeviceSetting.enableStallDetection,
DeviceSetting.stallSensitivity,
DeviceSetting.useEncodersForPositioning,
DeviceSetting.invertEncoders,
DeviceSetting.maxMissedSteps,
DeviceSetting.missedStepDecay,
DeviceSetting.encoderScaling,
];
const ENDSTOPS_PANEL = [
DeviceSetting.endstops,
DeviceSetting.enableEndstops,
DeviceSetting.swapEndstops,
DeviceSetting.invertEndstops,
];
const ERROR_HANDLING_PANEL = [
DeviceSetting.errorHandling,
DeviceSetting.timeoutAfter,
DeviceSetting.maxRetries,
DeviceSetting.estopOnMovementError,
];
const PIN_GUARD_PANEL = [
DeviceSetting.pinGuard,
];
const DANGER_ZONE_PANEL = [
DeviceSetting.dangerZone,
DeviceSetting.resetHardwareParams,
];
const PIN_BINDINGS_PANEL = [
DeviceSetting.pinBindings,
];
const POWER_AND_RESET_PANEL = [
DeviceSetting.powerAndReset,
DeviceSetting.restartFarmbot,
DeviceSetting.shutdownFarmbot,
DeviceSetting.restartFirmware,
DeviceSetting.factoryReset,
DeviceSetting.autoFactoryReset,
DeviceSetting.connectionAttemptPeriod,
DeviceSetting.changeOwnership,
];
/** Look up parent panels for settings. */
const SETTING_PANEL_LOOKUP = {} as Record<DeviceSetting, keyof ControlPanelState>;
HOMING_PANEL.map(s => SETTING_PANEL_LOOKUP[s] = "homing_and_calibration");
MOTORS_PANEL.map(s => SETTING_PANEL_LOOKUP[s] = "motors");
ENCODERS_PANEL.map(s => SETTING_PANEL_LOOKUP[s] = "encoders");
ENDSTOPS_PANEL.map(s => SETTING_PANEL_LOOKUP[s] = "endstops");
ERROR_HANDLING_PANEL.map(s => SETTING_PANEL_LOOKUP[s] = "error_handling");
PIN_GUARD_PANEL.map(s => SETTING_PANEL_LOOKUP[s] = "pin_guard");
DANGER_ZONE_PANEL.map(s => SETTING_PANEL_LOOKUP[s] = "danger_zone");
PIN_BINDINGS_PANEL.map(s => SETTING_PANEL_LOOKUP[s] = "pin_bindings");
POWER_AND_RESET_PANEL.map(s => SETTING_PANEL_LOOKUP[s] = "power_and_reset");
/** Look up parent panels for settings using URL-friendly names. */
const URL_FRIENDLY_LOOKUP: Record<string, keyof ControlPanelState> = {};
Object.entries(SETTING_PANEL_LOOKUP).map(([setting, panel]) =>
URL_FRIENDLY_LOOKUP[urlFriendly(setting)] = panel);
/** Look up all relevant names for the same setting. */
const ALTERNATE_NAMES =
Object.values(DeviceSetting).reduce((acc, s) => { acc[s] = [s]; return acc; },
{} as Record<DeviceSetting, DeviceSetting[]>);
ALTERNATE_NAMES[DeviceSetting.encoders].push(DeviceSetting.stallDetection);
ALTERNATE_NAMES[DeviceSetting.stallDetection].push(DeviceSetting.encoders);
/** Generate array of names for the same setting. Most only have one. */
const compareValues = (settingName: DeviceSetting) =>
(ALTERNATE_NAMES[settingName]).map(s => urlFriendly(s));
/** Retrieve a highlight search term. */
const getHighlightName = () => location.search.split("?highlight=").pop();
/** Only open panel and highlight once per app load. Exported for tests. */
export const highlight = { opened: false, highlighted: false };
/** Open a panel if a setting in that panel is highlighted. */
export const maybeOpenPanel = (panelState: ControlPanelState) =>
(dispatch: Function) => {
if (highlight.opened) { return; }
const urlFriendlySettingName = urlFriendly(getHighlightName() || "");
if (!urlFriendlySettingName) { return; }
const panel = URL_FRIENDLY_LOOKUP[urlFriendlySettingName];
const panelIsOpen = panelState[panel];
if (panelIsOpen) { return; }
dispatch(toggleControlPanel(panel));
highlight.opened = true;
};
/** Highlight a setting if provided as a search term. */
export const maybeHighlight = (settingName: DeviceSetting) => {
const item = getHighlightName();
if (highlight.highlighted || !item) { return ""; }
const isCurrentSetting = compareValues(settingName).includes(item);
if (!isCurrentSetting) { return ""; }
highlight.highlighted = true;
return "highlight";
};
export interface HighlightProps {
settingName: DeviceSetting;
children: React.ReactChild
| React.ReactChild[]
| (React.ReactChild | React.ReactChild[])[];
className?: string;
}
interface HighlightState {
className: string;
}
/** Wrap highlight-able settings. */
export class Highlight extends React.Component<HighlightProps, HighlightState> {
state: HighlightState = { className: maybeHighlight(this.props.settingName) };
componentDidMount = () => {
if (this.state.className == "highlight") {
/** Slowly fades highlight. */
this.setState({ className: "unhighlight" });
}
}
render() {
return <div className={`${this.props.className} ${this.state.className}`}>
{this.props.children}
</div>;
}
}

78
frontend/devices/components/numeric_mcu_input_group.tsx
View File

@ -3,48 +3,52 @@ import { McuInputBox } from "./mcu_input_box";
import { NumericMCUInputGroupProps } from "./interfaces";
import { Row, Col, Help } from "../../ui/index";
import { Position } from "@blueprintjs/core";
import { Highlight } from "./maybe_highlight";
import { t } from "../../i18next_wrapper";
export function NumericMCUInputGroup(props: NumericMCUInputGroupProps) {
const {
sourceFwConfig, dispatch, tooltip, name, x, y, z, intSize, gray, float,
sourceFwConfig, dispatch, tooltip, label, x, y, z, intSize, gray, float,
} = props;
return <Row>
<Col xs={6} className={"widget-body-tooltips"}>
<label>
{name}
</label>
<Help text={tooltip} requireClick={true} position={Position.RIGHT} />
</Col>
<Col xs={2}>
<McuInputBox
setting={x}
sourceFwConfig={sourceFwConfig}
dispatch={dispatch}
intSize={intSize}
float={float}
scale={props.xScale}
gray={gray?.x} />
</Col>
<Col xs={2}>
<McuInputBox
setting={y}
sourceFwConfig={sourceFwConfig}
dispatch={dispatch}
intSize={intSize}
float={float}
scale={props.yScale}
gray={gray?.y} />
</Col>
<Col xs={2}>
<McuInputBox
setting={z}
sourceFwConfig={sourceFwConfig}
dispatch={dispatch}
intSize={intSize}
float={float}
scale={props.zScale}
gray={gray?.z} />
</Col>
<Highlight settingName={label}>
<Col xs={6} className={"widget-body-tooltips"}>
<label>
{t(label)}
</label>
<Help text={tooltip} requireClick={true} position={Position.RIGHT} />
</Col>
<Col xs={2}>
<McuInputBox
setting={x}
sourceFwConfig={sourceFwConfig}
dispatch={dispatch}
intSize={intSize}
float={float}
scale={props.xScale}
gray={gray?.x} />
</Col>
<Col xs={2}>
<McuInputBox
setting={y}
sourceFwConfig={sourceFwConfig}
dispatch={dispatch}
intSize={intSize}
float={float}
scale={props.yScale}
gray={gray?.y} />
</Col>
<Col xs={2}>
<McuInputBox
setting={z}
sourceFwConfig={sourceFwConfig}
dispatch={dispatch}
intSize={intSize}
float={float}
scale={props.zScale}
gray={gray?.z} />
</Col>
</Highlight>
</Row>;
}

8
frontend/devices/interfaces.ts
View File

@ -201,6 +201,7 @@ export interface PeripheralsProps {
peripherals: TaggedPeripheral[];
dispatch: Function;
disabled: boolean | undefined;
firmwareHardware: FirmwareHardware | undefined;
}
export interface SensorsProps {
@ -208,6 +209,7 @@ export interface SensorsProps {
sensors: TaggedSensor[];
dispatch: Function;
disabled: boolean | undefined;
firmwareHardware: FirmwareHardware | undefined;
}
export interface FarmwareProps {
@ -248,8 +250,8 @@ export interface ControlPanelState {
encoders: boolean;
endstops: boolean;
error_handling: boolean;
pin_bindings: boolean;
danger_zone: boolean;
power_and_reset: boolean;
pin_guard: boolean;
danger_zone: boolean;
pin_bindings: boolean;
power_and_reset: boolean;
}

18
frontend/devices/pin_bindings/list_and_label_support.tsx
View File

@ -89,17 +89,17 @@ export const piSpi1Pins = [16, 17, 18, 19, 20, 21];
/** Pin numbers used for special purposes by the RPi. (internal pullup, etc.) */
export const reservedPiGPIO = piI2c0Pins;
const LabeledGpioPins: { [x: number]: string } = {
[ButtonPin.estop]: "Button 1: E-STOP",
[ButtonPin.unlock]: "Button 2: UNLOCK",
[ButtonPin.btn3]: "Button 3",
[ButtonPin.btn4]: "Button 4",
[ButtonPin.btn5]: "Button 5",
};
const GPIO_PIN_LABELS = (): { [x: number]: string } => ({
[ButtonPin.estop]: t("Button {{ num }}: E-STOP", { num: 1 }),
[ButtonPin.unlock]: t("Button {{ num }}: UNLOCK", { num: 2 }),
[ButtonPin.btn3]: t("Button {{ num }})", { num: 3 }),
[ButtonPin.btn4]: t("Button {{ num }}", { num: 4 }),
[ButtonPin.btn5]: t("Button {{ num }}", { num: 5 }),
});
export const generatePinLabel = (pin: number) =>
LabeledGpioPins[pin]
? `${LabeledGpioPins[pin]} (Pi ${pin})`
GPIO_PIN_LABELS()[pin]
? `${t(GPIO_PIN_LABELS()[pin])} (Pi ${pin})`
: `Pi GPIO ${pin}`;
/** Raspberry Pi GPIO pin numbers. */

10
frontend/external_urls.ts
View File

@ -20,10 +20,11 @@ export namespace ExternalUrl {
const GITHUB_API = "https://api.github.com";
const OPENFARM = "https://openfarm.cc";
const SOFTWARE_DOCS = "https://software.farm.bot";
const FORUM = "http://forum.farmbot.org";
const FORUM = "https://forum.farmbot.org";
const SHOPIFY_CDN = "https://cdn.shopify.com/s/files/1/2040/0289/files";
const FBOS_RAW = `${GITHUB_RAW}/${Org.FarmBot}/${FarmBotRepo.FarmBotOS}`;
const FBOS_RAW =
`${GITHUB_RAW}/${Org.FarmBot}/${FarmBotRepo.FarmBotOS}/staging`;
export const featureMinVersions = `${FBOS_RAW}/${FbosFile.featureMinVersions}`;
export const osReleaseNotes = `${FBOS_RAW}/${FbosFile.osReleaseNotes}`;
@ -31,8 +32,7 @@ export namespace ExternalUrl {
`${GITHUB_API}/repos/${Org.FarmBot}/${FarmBotRepo.FarmBotOS}/releases/latest`;
export const gitHubFarmBot = `${GITHUB}/${Org.FarmBot}`;
export const webAppRepo =
`${GITHUB}/${Org.FarmBot}/${FarmBotRepo.FarmBotWebApp}`;
export const webAppRepo = `${gitHubFarmBot}/${FarmBotRepo.FarmBotWebApp}`;
export const softwareDocs = `${SOFTWARE_DOCS}/docs`;
export const softwareForum = `${FORUM}/c/software`;
@ -43,7 +43,7 @@ export namespace ExternalUrl {
export const newCrop = `${OPENFARM}/en/crops/new`;
}
export namespace Videos {
export namespace Video {
export const desktop =
`${SHOPIFY_CDN}/Farm_Designer_Loop.mp4?9552037556691879018`;
export const mobile = `${SHOPIFY_CDN}/Controls.png?9668345515035078097`;

1
frontend/farm_designer/map/garden_map.tsx
View File

@ -386,6 +386,7 @@ export class GardenMap extends
visible={!!this.props.showPlants}
plants={this.props.plants}
currentPlant={this.getPlant()}
hoveredPlant={this.props.hoveredPlant}
dragging={!!this.state.isDragging}
editing={this.isEditing}
boxSelected={this.props.designer.selectedPlants}

3
frontend/farm_designer/map/interfaces.ts
View File

@ -14,6 +14,7 @@ export type TaggedPlant = TaggedPlantPointer | TaggedPlantTemplate;
export interface PlantLayerProps {
plants: TaggedPlant[];
currentPlant: TaggedPlant | undefined;
hoveredPlant: TaggedPlant | undefined;
dragging: boolean;
editing: boolean;
visible: boolean;
@ -57,12 +58,14 @@ export interface GardenPlantProps {
dispatch: Function;
plant: Readonly<TaggedPlant>;
selected: boolean;
current: boolean;
editing: boolean;
dragging: boolean;
zoomLvl: number;
activeDragXY: BotPosition | undefined;
uuid: string;
animate: boolean;
hovered: boolean;
}
export interface GardenPlantState {

18
frontend/farm_designer/map/layers/farmbot/__tests__/bot_figure_test.tsx
View File

@ -15,17 +15,19 @@ describe("<BotFigure/>", () => {
plantAreaOffset: { x: 100, y: 100 },
});
const EXPECTED_MOTORS_OPACITY = 0.5;
it.each<[
string, BotOriginQuadrant, Record<"x" | "y", number>, boolean, number
]>([
["motors", 1, { x: 3000, y: 0 }, false, 0.75],
["motors", 2, { x: 0, y: 0 }, false, 0.75],
["motors", 3, { x: 0, y: 1500 }, false, 0.75],
["motors", 4, { x: 3000, y: 1500 }, false, 0.75],
["motors", 1, { x: 0, y: 1500 }, true, 0.75],
["motors", 2, { x: 0, y: 0 }, true, 0.75],
["motors", 3, { x: 3000, y: 0 }, true, 0.75],
["motors", 4, { x: 3000, y: 1500 }, true, 0.75],
["motors", 1, { x: 3000, y: 0 }, false, EXPECTED_MOTORS_OPACITY],
["motors", 2, { x: 0, y: 0 }, false, EXPECTED_MOTORS_OPACITY],
["motors", 3, { x: 0, y: 1500 }, false, EXPECTED_MOTORS_OPACITY],
["motors", 4, { x: 3000, y: 1500 }, false, EXPECTED_MOTORS_OPACITY],
["motors", 1, { x: 0, y: 1500 }, true, EXPECTED_MOTORS_OPACITY],
["motors", 2, { x: 0, y: 0 }, true, EXPECTED_MOTORS_OPACITY],
["motors", 3, { x: 3000, y: 0 }, true, EXPECTED_MOTORS_OPACITY],
["motors", 4, { x: 3000, y: 1500 }, true, EXPECTED_MOTORS_OPACITY],
["encoders", 2, { x: 0, y: 0 }, false, 0.25],
])("shows %s in correct location for quadrant %i",
(name, quadrant, expected, xySwap, opacity) => {

2
frontend/farm_designer/map/layers/farmbot/bot_figure.tsx
View File

@ -31,7 +31,7 @@ export class BotFigure extends
const positionQ = transformXY(
(position.x || 0), (position.y || 0), mapTransformProps);
const color = eStopStatus ? Color.virtualRed : Color.darkGray;
const opacity = name.includes("encoder") ? 0.25 : 0.75;
const opacity = name.includes("encoder") ? 0.25 : 0.5;
return <g id={name}>
<rect id="gantry"
x={xySwap ? -plantAreaOffset.x : positionQ.qx - 10}

21
frontend/farm_designer/map/layers/plants/__tests__/garden_plant_test.tsx
View File

@ -13,6 +13,7 @@ describe("<GardenPlant/>", () => {
return {
mapTransformProps: fakeMapTransformProps(),
plant: fakePlant(),
current: false,
selected: false,
editing: false,
dragging: false,
@ -21,6 +22,7 @@ describe("<GardenPlant/>", () => {
activeDragXY: { x: undefined, y: undefined, z: undefined },
uuid: "plantUuid",
animate: false,
hovered: false,
};
}
@ -31,6 +33,8 @@ describe("<GardenPlant/>", () => {
const wrapper = shallow(<GardenPlant {...p} />);
expect(wrapper.find("image").length).toEqual(1);
expect(wrapper.find("image").props().opacity).toEqual(1);
expect(wrapper.find("image").props().visibility).toEqual("visible");
expect(wrapper.find("image").props().opacity).toEqual(1.0);
expect(wrapper.find("text").length).toEqual(0);
expect(wrapper.find("rect").length).toBeLessThanOrEqual(1);
expect(wrapper.find("use").length).toEqual(0);
@ -88,4 +92,21 @@ describe("<GardenPlant/>", () => {
expect(wrapper.find(".plant-indicator").length).toEqual(1);
expect(wrapper.find("Circle").length).toEqual(1);
});
it("doesn't render indicator circle twice", () => {
const p = fakeProps();
p.selected = true;
p.hovered = true;
const wrapper = shallow(<GardenPlant {...p} />);
expect(wrapper.find(".plant-indicator").length).toEqual(0);
expect(wrapper.find("Circle").length).toEqual(0);
});
it("renders while dragging", () => {
const p = fakeProps();
p.dragging = true;
const wrapper = shallow(<GardenPlant {...p} />);
expect(wrapper.find("image").props().visibility).toEqual("hidden");
expect(wrapper.find("image").props().opacity).toEqual(0.4);
});
});

16
frontend/farm_designer/map/layers/plants/__tests__/plant_layer_test.tsx
View File

@ -8,11 +8,13 @@ import { PlantLayer } from "../plant_layer";
import {
fakePlant, fakePlantTemplate
} from "../../../../../__test_support__/fake_state/resources";
import { PlantLayerProps, GardenPlantProps } from "../../../interfaces";
import { PlantLayerProps } from "../../../interfaces";
import {
fakeMapTransformProps
} from "../../../../../__test_support__/map_transform_props";
import { svgMount } from "../../../../../__test_support__/svg_mount";
import { shallow } from "enzyme";
import { GardenPlant } from "../garden_plant";
describe("<PlantLayer/>", () => {
const fakeProps = (): PlantLayerProps => ({
@ -28,6 +30,7 @@ describe("<PlantLayer/>", () => {
zoomLvl: 1,
activeDragXY: { x: undefined, y: undefined, z: undefined },
animate: true,
hoveredPlant: undefined,
});
it("shows plants", () => {
@ -88,14 +91,14 @@ describe("<PlantLayer/>", () => {
.toEqual("/app/designer/gardens/templates/5");
});
it("has selected plant", () => {
it("has hovered plant", () => {
mockPath = "/app/designer/plants";
const p = fakeProps();
const plant = fakePlant();
p.plants = [plant];
p.currentPlant = plant;
const wrapper = svgMount(<PlantLayer {...p} />);
expect(wrapper.find("GardenPlant").props().selected).toEqual(true);
p.hoveredPlant = plant;
const wrapper = shallow(<PlantLayer {...p} />);
expect(wrapper.find(GardenPlant).props().hovered).toEqual(true);
});
it("has plant selected by selection box", () => {
@ -105,8 +108,7 @@ describe("<PlantLayer/>", () => {
p.plants = [plant];
p.boxSelected = [plant.uuid];
const wrapper = svgMount(<PlantLayer {...p} />);
expect((wrapper.find("GardenPlant").props() as GardenPlantProps).selected)
.toEqual(true);
expect(wrapper.find("GardenPlant").props().selected).toEqual(true);
});
it("allows clicking of unsaved plants", () => {

12
frontend/farm_designer/map/layers/plants/garden_plant.tsx
View File

@ -36,22 +36,22 @@ export class GardenPlant extends
};
get radius() {
const { selected, plant } = this.props;
const { plant } = this.props;
const { hover } = this.state;
const { radius } = plant.body;
return (hover && !selected) ? radius * 1.1 : radius;
return hover ? radius * 1.1 : radius;
}
render() {
const { selected, dragging, plant, mapTransformProps,
activeDragXY, zoomLvl, animate, editing } = this.props;
const { current, selected, dragging, plant, mapTransformProps,
activeDragXY, zoomLvl, animate, editing, hovered } = this.props;
const { id, radius, x, y } = plant.body;
const { icon } = this.state;
const { qx, qy } = transformXY(round(x), round(y), mapTransformProps);
const alpha = dragging ? 0.4 : 1.0;
const className = [
"plant-image", `is-chosen-${selected}`, animate ? "animate" : ""
"plant-image", `is-chosen-${current || selected}`, animate ? "animate" : ""
].join(" ");
return <g id={"plant-" + id}>
@ -65,7 +65,7 @@ export class GardenPlant extends
fill={Color.soilCloud}
fillOpacity={0} />}
{selected && !editing &&
{(current || selected) && !editing && !hovered &&
<g id="selected-plant-indicator">
<Circle
className={`plant-indicator ${animate ? "animate" : ""}`}

10
frontend/farm_designer/map/layers/plants/plant_layer.tsx
View File

@ -19,11 +19,13 @@ export function PlantLayer(props: PlantLayerProps) {
boxSelected,
groupSelected,
animate,
hoveredPlant,
} = props;
return <g id="plant-layer">
{visible && plants.map(p => {
const selected = !!(p.uuid === currentPlant?.uuid);
const current = p.uuid === currentPlant?.uuid;
const hovered = p.uuid === hoveredPlant?.uuid;
const selectedByBox = !!boxSelected?.includes(p.uuid);
const selectedByGroup = groupSelected.includes(p.uuid);
const plantCategory = unpackUUID(p.uuid).kind === "PlantTemplate"
@ -33,12 +35,14 @@ export function PlantLayer(props: PlantLayerProps) {
uuid={p.uuid}
mapTransformProps={mapTransformProps}
plant={p}
selected={selected || selectedByBox || selectedByGroup}
selected={selectedByBox || selectedByGroup}
current={current}
editing={editing}
dragging={selected && dragging && editing}
dragging={current && dragging && editing}
dispatch={dispatch}
zoomLvl={zoomLvl}
activeDragXY={activeDragXY}
hovered={hovered}
animate={animate} />;
const wrapperProps = {
className: "plant-link-wrapper",

4
frontend/farm_designer/map/layers/tool_slots/__tests__/tool_slot_point_test.tsx
View File

@ -66,12 +66,12 @@ describe("<ToolSlotPoint/>", () => {
expect(wrapper.find("text").props().dx).toEqual(-40);
});
it("displays 'no tool'", () => {
it("displays 'empty'", () => {
const p = fakeProps();
p.slot.tool = undefined;
p.hoveredToolSlot = p.slot.toolSlot.uuid;
const wrapper = svgMount(<ToolSlotPoint {...p} />);
expect(wrapper.find("text").text()).toEqual("no tool");
expect(wrapper.find("text").text()).toEqual("empty");
expect(wrapper.find("text").props().dx).toEqual(40);
});

2
frontend/farm_designer/map/layers/tool_slots/tool_slot_point.tsx
View File

@ -32,7 +32,7 @@ export const ToolSlotPoint = (props: TSPProps) => {
const { quadrant, xySwap } = mapTransformProps;
const xPosition = gantry_mounted ? (botPositionX || 0) : x;
const { qx, qy } = transformXY(xPosition, y, props.mapTransformProps);
const toolName = props.slot.tool ? props.slot.tool.body.name : "no tool";
const toolName = props.slot.tool ? props.slot.tool.body.name : "empty";
const hovered = props.slot.toolSlot.uuid === props.hoveredToolSlot;
const toolProps = {
x: qx,

1
frontend/farm_designer/point_groups/__tests__/group_detail_active_test.tsx
View File

@ -40,6 +40,7 @@ describe("<GroupDetailActive/>", () => {
allPoints: [],
shouldDisplay: () => true,
slugs: [],
hovered: undefined,
};
};

3
frontend/farm_designer/point_groups/group_detail.tsx
View File

@ -10,6 +10,7 @@ import { GroupDetailActive } from "./group_detail_active";
import { ShouldDisplay } from "../../devices/interfaces";
import { getShouldDisplayFn } from "../../farmware/state_to_props";
import { uniq } from "lodash";
import { UUID } from "../../resources/interfaces";
interface GroupDetailProps {
dispatch: Function;
@ -17,6 +18,7 @@ interface GroupDetailProps {
allPoints: TaggedPoint[];
shouldDisplay: ShouldDisplay;
slugs: string[];
hovered: UUID | undefined;
}
/** Find a group from a URL-provided ID. */
@ -35,6 +37,7 @@ function mapStateToProps(props: Everything): GroupDetailProps {
shouldDisplay: getShouldDisplayFn(props.resources.index, props.bot),
slugs: uniq(selectAllPlantPointers(props.resources.index)
.map(p => p.body.openfarm_slug)),
hovered: props.resources.consumers.farm_designer.hoveredPlantListItem,
};
}

4
frontend/farm_designer/point_groups/group_detail_active.tsx
View File

@ -18,6 +18,7 @@ import {
GroupCriteria, GroupPointCountBreakdown, pointsSelectedByGroup
} from "./criteria";
import { Content } from "../../constants";
import { UUID } from "../../resources/interfaces";
export interface GroupDetailActiveProps {
dispatch: Function;
@ -25,6 +26,7 @@ export interface GroupDetailActiveProps {
allPoints: TaggedPoint[];
shouldDisplay: ShouldDisplay;
slugs: string[];
hovered: UUID | undefined;
}
type State = { timerId?: ReturnType<typeof setInterval> };
@ -47,7 +49,7 @@ export class GroupDetailActive
return sortedPoints.map(point => {
return <PointGroupItem
key={point.uuid}
hovered={false}
hovered={point.uuid === this.props.hovered}
group={this.props.group}
point={point}
dispatch={this.props.dispatch} />;

2
frontend/farm_designer/point_groups/group_order_visual.tsx
View File

@ -36,7 +36,7 @@ export interface PointsPathLineProps {
}
export const PointsPathLine = (props: PointsPathLineProps) =>
<g id="group-order"
<g id="group-order" style={{ pointerEvents: "none" }}
stroke={props.color || Color.mediumGray}
strokeWidth={props.strokeWidth || 3}
strokeDasharray={props.dash || 12}>

1
frontend/farm_designer/point_groups/point_group_item.tsx
View File

@ -93,6 +93,7 @@ export class PointGroupItem
style={{
border: this.criteriaIcon ? "1px solid gray" : "none",
borderRadius: "5px",
background: this.props.hovered ? "lightgray" : "none",
}}
src={DEFAULT_ICON}
onLoad={this.maybeGetCachedIcon}

24
frontend/farm_designer/tools/__tests__/add_tool_slot_test.tsx
View File

@ -22,6 +22,7 @@ import {
import { init, save, edit, destroy } from "../../../api/crud";
import { history } from "../../../history";
import { SpecialStatus } from "farmbot";
import { ToolPulloutDirection } from "farmbot/dist/resources/api_resources";
describe("<AddToolSlot />", () => {
const fakeProps = (): AddToolSlotProps => ({
@ -30,14 +31,20 @@ describe("<AddToolSlot />", () => {
botPosition: { x: undefined, y: undefined, z: undefined },
dispatch: jest.fn(),
findToolSlot: fakeToolSlot,
firmwareHardware: undefined,
});
it("renders", () => {
const wrapper = mount(<AddToolSlot {...fakeProps()} />);
["add new tool slot", "x (mm)", "y (mm)", "z (mm)", "toolnone",
["add new tool slot", "x (mm)", "y (mm)", "z (mm)", "tool or seed container",
"change slot direction", "use current location", "gantry-mounted"
].map(string => expect(wrapper.text().toLowerCase()).toContain(string));
expect(init).toHaveBeenCalled();
expect(init).toHaveBeenCalledWith("Point", {
pointer_type: "ToolSlot", name: "Tool Slot", radius: 0, meta: {},
x: 0, y: 0, z: 0, tool_id: undefined,
pullout_direction: ToolPulloutDirection.NONE,
gantry_mounted: false,
});
});
it("renders while loading", () => {
@ -102,6 +109,19 @@ describe("<AddToolSlot />", () => {
const wrapper = mount<AddToolSlot>(<AddToolSlot {...p} />);
expect(wrapper.instance().tool).toEqual(undefined);
});
it("renders for express bots", () => {
const p = fakeProps();
p.firmwareHardware = "express_k10";
const wrapper = mount(<AddToolSlot {...p} />);
expect(wrapper.text().toLowerCase()).not.toContain("tool");
expect(init).toHaveBeenCalledWith("Point", {
pointer_type: "ToolSlot", name: "Tool Slot", radius: 0, meta: {},
x: 0, y: 0, z: 0, tool_id: undefined,
pullout_direction: ToolPulloutDirection.NONE,
gantry_mounted: true,
});
});
});
describe("mapStateToProps()", () => {

30
frontend/farm_designer/tools/__tests__/add_tool_test.tsx
View File

@ -11,11 +11,13 @@ import { fakeState } from "../../../__test_support__/fake_state";
import { SaveBtn } from "../../../ui";
import { initSave } from "../../../api/crud";
import { history } from "../../../history";
import { error } from "../../../toast/toast";
import { FirmwareHardware } from "farmbot";
describe("<AddTool />", () => {
const fakeProps = (): AddToolProps => ({
dispatch: jest.fn(),
existingToolNames: [],
firmwareHardware: undefined,
});
it("renders", () => {
@ -38,19 +40,29 @@ describe("<AddTool />", () => {
expect(initSave).toHaveBeenCalledWith("Tool", { name: "Foo" });
});
it("doesn't add stock tools", () => {
const wrapper = mount(<AddTool {...fakeProps()} />);
it.each<[FirmwareHardware, number]>([
["arduino", 6],
["farmduino", 6],
["farmduino_k14", 6],
["farmduino_k15", 8],
["express_k10", 2],
])("adds peripherals: %s", (firmware, expectedAdds) => {
const p = fakeProps();
p.firmwareHardware = firmware;
const wrapper = mount(<AddTool {...p} />);
wrapper.find("button").last().simulate("click");
expect(error).toHaveBeenCalledWith("Please choose a FarmBot model.");
expect(initSave).not.toHaveBeenCalledTimes(6);
expect(history.push).not.toHaveBeenCalledWith("/app/designer/tools");
expect(initSave).toHaveBeenCalledTimes(expectedAdds);
expect(history.push).toHaveBeenCalledWith("/app/designer/tools");
});
it("adds stock tools", () => {
const wrapper = mount(<AddTool {...fakeProps()} />);
it("doesn't add stock tools twice", () => {
const p = fakeProps();
p.firmwareHardware = "express_k10";
p.existingToolNames = ["Seed Trough 1"];
const wrapper = mount(<AddTool {...p} />);
wrapper.setState({ model: "express" });
wrapper.find("button").last().simulate("click");
expect(initSave).toHaveBeenCalledTimes(2);
expect(initSave).toHaveBeenCalledTimes(1);
expect(history.push).toHaveBeenCalledWith("/app/designer/tools");
});
});

3
frontend/farm_designer/tools/__tests__/edit_tool_slot_test.tsx
View File

@ -28,6 +28,7 @@ describe("<EditToolSlot />", () => {
findTool: jest.fn(),
botPosition: { x: undefined, y: undefined, z: undefined },
dispatch: jest.fn(),
firmwareHardware: undefined,
});
it("redirects", () => {
@ -39,7 +40,7 @@ describe("<EditToolSlot />", () => {
const p = fakeProps();
p.findToolSlot = () => fakeToolSlot();
const wrapper = mount(<EditToolSlot {...p} />);
["edit tool slot", "x (mm)", "y (mm)", "z (mm)", "toolnone",
["edit tool slot", "x (mm)", "y (mm)", "z (mm)", "tool or seed container",
"change slot direction", "use current location", "gantry-mounted"
].map(string => expect(wrapper.text().toLowerCase()).toContain(string));
});

11
frontend/farm_designer/tools/__tests__/index_test.tsx
View File

@ -39,6 +39,7 @@ describe("<Tools />", () => {
bot,
botToMqttStatus: "down",
hoveredToolSlot: undefined,
firmwareHardware: undefined,
});
it("renders with no tools", () => {
@ -64,7 +65,7 @@ describe("<Tools />", () => {
p.toolSlots[1].body.y = 2;
const wrapper = mount(<Tools {...p} />);
[
"foo", "my tool", "unnamed tool", "(1, 0, 0)", "unknown", "(gantry, 2, 0)"
"foo", "my tool", "unnamed", "(1, 0, 0)", "unknown", "(gantry, 2, 0)"
].map(string => expect(wrapper.text().toLowerCase()).toContain(string));
});
@ -158,6 +159,7 @@ describe("<Tools />", () => {
p.bot.hardware.informational_settings.sync_status = "synced";
p.botToMqttStatus = "up";
const wrapper = mount(<Tools {...p} />);
expect(wrapper.text().toLowerCase()).toContain("mounted tool");
wrapper.find(".yellow").first().simulate("click");
expect(mockDevice.readPin).toHaveBeenCalledWith({
label: "pin63", pin_mode: 0, pin_number: 63
@ -173,6 +175,13 @@ describe("<Tools />", () => {
expect(mockDevice.readPin).not.toHaveBeenCalled();
expect(error).toHaveBeenCalledWith(Content.NOT_AVAILABLE_WHEN_OFFLINE);
});
it("doesn't display mounted tool on express models", () => {
const p = fakeProps();
p.firmwareHardware = "express_k10";
const wrapper = mount(<Tools {...p} />);
expect(wrapper.text().toLowerCase()).not.toContain("mounted tool");
});
});
describe("mapStateToProps()", () => {

8
frontend/farm_designer/tools/__tests__/tool_slot_edit_components_test.tsx
View File

@ -136,6 +136,7 @@ describe("<ToolInputRow />", () => {
tools: [],
selectedTool: undefined,
onChange: jest.fn(),
isExpress: false,
});
it("renders", () => {
@ -149,6 +150,13 @@ describe("<ToolInputRow />", () => {
const wrapper = mount(<ToolInputRow {...p} />);
expect(wrapper.text().toLowerCase()).toContain("foo");
});
it("renders for express bots", () => {
const p = fakeProps();
p.isExpress = true;
const wrapper = mount(<ToolInputRow {...p} />);
expect(wrapper.text().toLowerCase()).toContain("seed container");
});
});
describe("<SlotLocationInputRow />", () => {

75
frontend/farm_designer/tools/add_tool.tsx
View File

@ -5,36 +5,37 @@ import {
} from "../designer_panel";
import { Everything } from "../../interfaces";
import { t } from "../../i18next_wrapper";
import { SaveBtn, FBSelect, DropDownItem } from "../../ui";
import { SpecialStatus } from "farmbot";
import { SaveBtn } from "../../ui";
import { SpecialStatus, FirmwareHardware } from "farmbot";
import { initSave } from "../../api/crud";
import { Panel } from "../panel_header";
import { history } from "../../history";
import { error } from "../../toast/toast";
enum Model { genesis14 = "genesis14", genesis15 = "genesis15", express = "express" }
const MODEL_DDI_LOOKUP = (): { [x: string]: DropDownItem } => ({
[Model.genesis14]: { label: t("Genesis v1.2-v1.4"), value: Model.genesis14 },
[Model.genesis15]: { label: t("Genesis v1.5+"), value: Model.genesis15 },
[Model.express]: { label: t("Express"), value: Model.express },
});
import { selectAllTools } from "../../resources/selectors";
import { betterCompact } from "../../util";
import {
isExpressBoard, getFwHardwareValue
} from "../../devices/components/firmware_hardware_support";
import { getFbosConfig } from "../../resources/getters";
export interface AddToolProps {
dispatch: Function;
existingToolNames: string[];
firmwareHardware: FirmwareHardware | undefined;
}
export interface AddToolState {
toolName: string;
model: Model | undefined;
}
export const mapStateToProps = (props: Everything): AddToolProps => ({
dispatch: props.dispatch,
existingToolNames: betterCompact(selectAllTools(props.resources.index)
.map(tool => tool.body.name)),
firmwareHardware: getFwHardwareValue(getFbosConfig(props.resources.index)),
});
export class RawAddTool extends React.Component<AddToolProps, AddToolState> {
state: AddToolState = { toolName: "", model: undefined };
state: AddToolState = { toolName: "" };
newTool = (name: string) => {
this.props.dispatch(initSave("Tool", { name }));
@ -45,9 +46,12 @@ export class RawAddTool extends React.Component<AddToolProps, AddToolState> {
history.push("/app/designer/tools");
}
stockToolNames = (model: Model) => {
switch (model) {
case Model.genesis14:
stockToolNames = () => {
switch (this.props.firmwareHardware) {
case "arduino":
case "farmduino":
case "farmduino_k14":
default:
return [
t("Seeder"),
t("Watering Nozzle"),
@ -56,7 +60,7 @@ export class RawAddTool extends React.Component<AddToolProps, AddToolState> {
t("Seed Bin"),
t("Seed Tray"),
];
case Model.genesis15:
case "farmduino_k15":
return [
t("Seeder"),
t("Watering Nozzle"),
@ -67,7 +71,7 @@ export class RawAddTool extends React.Component<AddToolProps, AddToolState> {
t("Seed Trough 1"),
t("Seed Trough 2"),
];
case Model.express:
case "express_k10":
return [
t("Seed Trough 1"),
t("Seed Trough 2"),
@ -77,31 +81,20 @@ export class RawAddTool extends React.Component<AddToolProps, AddToolState> {
AddStockTools = () =>
<div className="add-stock-tools">
<label>{t("Add stock tools")}</label>
<FBSelect
customNullLabel={t("Choose model")}
list={Object.values(MODEL_DDI_LOOKUP())}
selectedItem={this.state.model
? MODEL_DDI_LOOKUP()[this.state.model]
: undefined}
onChange={ddi => this.setState({ model: ddi.value as Model })}
/>
{this.state.model &&
<ul>
{this.stockToolNames(this.state.model).map(n => <li key={n}>{n}</li>)}
</ul>}
<label>{t("Add stock names")}</label>
<ul>
{this.stockToolNames().map(n => <li key={n}>{n}</li>)}
</ul>
<button
className="fb-button green"
onClick={() => {
if (this.state.model) {
this.stockToolNames(this.state.model).map(n => this.newTool(n));
history.push("/app/designer/tools");
} else {
error(t("Please choose a FarmBot model."));
}
this.stockToolNames()
.filter(n => !this.props.existingToolNames.includes(n))
.map(n => this.newTool(n));
history.push("/app/designer/tools");
}}>
<i className="fa fa-plus" />
{t("Stock Tools")}
{t("Stock names")}
</button>
</div>
@ -110,12 +103,14 @@ export class RawAddTool extends React.Component<AddToolProps, AddToolState> {
return <DesignerPanel panelName={panelName} panel={Panel.Tools}>
<DesignerPanelHeader
panelName={panelName}
title={t("Add new tool")}
title={isExpressBoard(this.props.firmwareHardware)
? t("Add new")
: t("Add new tool")}
backTo={"/app/designer/tools"}
panel={Panel.Tools} />
<DesignerPanelContent panelName={panelName}>
<div className="add-new-tool">
<label>{t("Tool Name")}</label>
<label>{t("Name")}</label>
<input onChange={e =>
this.setState({ toolName: e.currentTarget.value })} />
<SaveBtn onClick={this.save} status={SpecialStatus.DIRTY} />

20
frontend/farm_designer/tools/add_tool_slot.tsx
View File

@ -6,7 +6,9 @@ import {
import { Everything } from "../../interfaces";
import { t } from "../../i18next_wrapper";
import { SaveBtn } from "../../ui";
import { SpecialStatus, TaggedTool, TaggedToolSlotPointer } from "farmbot";
import {
SpecialStatus, TaggedTool, TaggedToolSlotPointer, FirmwareHardware
} from "farmbot";
import { init, save, edit, destroy } from "../../api/crud";
import { Panel } from "../panel_header";
import { ToolPulloutDirection } from "farmbot/dist/resources/api_resources";
@ -18,6 +20,10 @@ import { validBotLocationData } from "../../util";
import { history } from "../../history";
import { SlotEditRows } from "./tool_slot_edit_components";
import { UUID } from "../../resources/interfaces";
import {
isExpressBoard, getFwHardwareValue
} from "../../devices/components/firmware_hardware_support";
import { getFbosConfig } from "../../resources/getters";
export interface AddToolSlotProps {
tools: TaggedTool[];
@ -25,6 +31,7 @@ export interface AddToolSlotProps {
botPosition: BotPosition;
findTool(id: number): TaggedTool | undefined;
findToolSlot(uuid: UUID | undefined): TaggedToolSlotPointer | undefined;
firmwareHardware: FirmwareHardware | undefined;
}
export interface AddToolSlotState {
@ -38,6 +45,7 @@ export const mapStateToProps = (props: Everything): AddToolSlotProps => ({
findTool: (id: number) => maybeFindToolById(props.resources.index, id),
findToolSlot: (uuid: UUID | undefined) =>
maybeGetToolSlot(props.resources.index, uuid),
firmwareHardware: getFwHardwareValue(getFbosConfig(props.resources.index)),
});
export class RawAddToolSlot
@ -48,7 +56,8 @@ export class RawAddToolSlot
const action = init("Point", {
pointer_type: "ToolSlot", name: "Tool Slot", radius: 0, meta: {},
x: 0, y: 0, z: 0, tool_id: undefined,
pullout_direction: ToolPulloutDirection.NONE, gantry_mounted: false
pullout_direction: ToolPulloutDirection.NONE,
gantry_mounted: isExpressBoard(this.props.firmwareHardware) ? true : false,
});
this.setState({ uuid: action.payload.uuid });
this.props.dispatch(action);
@ -57,7 +66,7 @@ export class RawAddToolSlot
componentWillUnmount() {
if (this.state.uuid && this.toolSlot
&& this.toolSlot.specialStatus == SpecialStatus.DIRTY) {
confirm(t("Save new tool?"))
confirm(t("Save new slot?"))
? this.props.dispatch(save(this.state.uuid))
: this.props.dispatch(destroy(this.state.uuid, true));
}
@ -86,12 +95,15 @@ export class RawAddToolSlot
return <DesignerPanel panelName={panelName} panel={Panel.Tools}>
<DesignerPanelHeader
panelName={panelName}
title={t("Add new tool slot")}
title={isExpressBoard(this.props.firmwareHardware)
? t("Add new slot")
: t("Add new tool slot")}
backTo={"/app/designer/tools"}
panel={Panel.Tools} />
<DesignerPanelContent panelName={panelName}>
{this.toolSlot
? <SlotEditRows
isExpress={isExpressBoard(this.props.firmwareHardware)}
toolSlot={this.toolSlot}
tools={this.props.tools}
tool={this.tool}

2
frontend/farm_designer/tools/edit_tool.tsx
View File

@ -51,7 +51,7 @@ export class RawEditTool extends React.Component<EditToolProps, EditToolState> {
backTo={"/app/designer/tools"}
panel={Panel.Tools} />
<DesignerPanelContent panelName={panelName}>
<label>{t("Tool Name")}</label>
<label>{t("Name")}</label>
<input
value={toolName}
onChange={e => this.setState({ toolName: e.currentTarget.value })} />

9
frontend/farm_designer/tools/edit_tool_slot.tsx
View File

@ -6,7 +6,7 @@ import {
import { Everything } from "../../interfaces";
import { t } from "../../i18next_wrapper";
import { getPathArray } from "../../history";
import { TaggedToolSlotPointer, TaggedTool } from "farmbot";
import { TaggedToolSlotPointer, TaggedTool, FirmwareHardware } from "farmbot";
import { edit, save, destroy } from "../../api/crud";
import { history } from "../../history";
import { Panel } from "../panel_header";
@ -17,6 +17,10 @@ import { BotPosition } from "../../devices/interfaces";
import { validBotLocationData } from "../../util";
import { SlotEditRows } from "./tool_slot_edit_components";
import { moveAbs } from "../../devices/actions";
import {
getFwHardwareValue, isExpressBoard
} from "../../devices/components/firmware_hardware_support";
import { getFbosConfig } from "../../resources/getters";
export interface EditToolSlotProps {
findToolSlot(id: string): TaggedToolSlotPointer | undefined;
@ -24,6 +28,7 @@ export interface EditToolSlotProps {
findTool(id: number): TaggedTool | undefined;
dispatch: Function;
botPosition: BotPosition;
firmwareHardware: FirmwareHardware | undefined;
}
export const mapStateToProps = (props: Everything): EditToolSlotProps => ({
@ -33,6 +38,7 @@ export const mapStateToProps = (props: Everything): EditToolSlotProps => ({
findTool: (id: number) => maybeFindToolById(props.resources.index, id),
dispatch: props.dispatch,
botPosition: validBotLocationData(props.bot.hardware.location_data).position,
firmwareHardware: getFwHardwareValue(getFbosConfig(props.resources.index)),
});
export class RawEditToolSlot extends React.Component<EditToolSlotProps> {
@ -64,6 +70,7 @@ export class RawEditToolSlot extends React.Component<EditToolSlotProps> {
panel={Panel.Tools} />
<DesignerPanelContent panelName={panelName}>
<SlotEditRows
isExpress={isExpressBoard(this.props.firmwareHardware)}
toolSlot={toolSlot}
tools={this.props.tools}
tool={this.tool}

55
frontend/farm_designer/tools/index.tsx
View File

@ -11,6 +11,7 @@ import {
import { t } from "../../i18next_wrapper";
import {
TaggedTool, TaggedToolSlotPointer, TaggedDevice, TaggedSensor,
FirmwareHardware,
} from "farmbot";
import {
selectAllTools, selectAllToolSlotPointers, getDeviceAccountSettings,
@ -31,6 +32,10 @@ import { getStatus } from "../../connectivity/reducer_support";
import { setToolHover } from "../map/layers/tool_slots/tool_graphics";
import { ToolSelection } from "./tool_slot_edit_components";
import { error } from "../../toast/toast";
import {
isExpressBoard, getFwHardwareValue
} from "../../devices/components/firmware_hardware_support";
import { getFbosConfig } from "../../resources/getters";
export interface ToolsProps {
tools: TaggedTool[];
@ -42,6 +47,7 @@ export interface ToolsProps {
bot: BotState;
botToMqttStatus: NetworkState;
hoveredToolSlot: string | undefined;
firmwareHardware: FirmwareHardware | undefined;
}
export interface ToolsState {
@ -58,6 +64,7 @@ export const mapStateToProps = (props: Everything): ToolsProps => ({
bot: props.bot,
botToMqttStatus: getStatus(props.bot.connectivity.uptime["bot.mqtt"]),
hoveredToolSlot: props.resources.consumers.farm_designer.hoveredToolSlot,
firmwareHardware: getFwHardwareValue(getFbosConfig(props.resources.index)),
});
const toolStatus = (value: number | undefined): string => {
@ -108,6 +115,8 @@ export class RawTools extends React.Component<ToolsProps, ToolsState> {
this.props.botToMqttStatus);
}
get isExpress() { return isExpressBoard(this.props.firmwareHardware); }
MountedToolInfo = () =>
<div className="mounted-tool">
<div className="mounted-tool-header">
@ -141,10 +150,10 @@ export class RawTools extends React.Component<ToolsProps, ToolsState> {
ToolSlots = () =>
<div className="tool-slots">
<div className="tool-slots-header">
<label>{t("tool slots")}</label>
<label>{this.strings.toolSlots}</label>
<Link to={"/app/designer/tool-slots/add"}>
<div className={`fb-button panel-${TAB_COLOR[Panel.Tools]}`}>
<i className="fa fa-plus" title={t("Add tool slot")} />
<i className="fa fa-plus" title={this.strings.addSlot} />
</div>
</Link>
</div>
@ -162,10 +171,10 @@ export class RawTools extends React.Component<ToolsProps, ToolsState> {
Tools = () =>
<div className="tools">
<div className="tools-header">
<label>{t("tools")}</label>
<label>{this.strings.tools}</label>
<Link to={"/app/designer/tools/add"}>
<div className={`fb-button panel-${TAB_COLOR[Panel.Tools]}`}>
<i className="fa fa-plus" title={t("Add tool")} />
<i className="fa fa-plus" title={this.strings.titleText} />
</div>
</Link>
</div>
@ -176,9 +185,32 @@ export class RawTools extends React.Component<ToolsProps, ToolsState> {
.map(tool =>
<ToolInventoryItem key={tool.uuid}
toolId={tool.body.id}
toolName={tool.body.name || t("Unnamed tool")} />)}
toolName={tool.body.name || t("Unnamed")} />)}
</div>
get strings() {
return {
placeholder: this.isExpress
? t("Search your seed containers...")
: t("Search your tools..."),
titleText: this.isExpress
? t("Add a seed container")
: t("Add a tool or seed container"),
emptyStateText: this.isExpress
? Content.NO_SEED_CONTAINERS
: Content.NO_TOOLS,
tools: this.isExpress
? t("seed containers")
: t("tools and seed containers"),
toolSlots: this.isExpress
? t("seed container slots")
: t("tool slots"),
addSlot: this.isExpress
? t("Add slot")
: t("Add tool slot"),
};
}
render() {
const panelName = "tools";
const hasTools = this.props.tools.length > 0;
@ -187,18 +219,19 @@ export class RawTools extends React.Component<ToolsProps, ToolsState> {
<DesignerPanelTop
panel={Panel.Tools}
linkTo={!hasTools ? "/app/designer/tools/add" : undefined}
title={!hasTools ? t("Add tool") : undefined}>
title={!hasTools ? this.strings.titleText : undefined}>
<input type="text" onChange={this.update}
placeholder={t("Search your tools...")} />
placeholder={this.strings.placeholder} />
</DesignerPanelTop>
<DesignerPanelContent panelName={"tools"}>
<EmptyStateWrapper
notEmpty={hasTools}
graphic={EmptyStateGraphic.tools}
title={t("Add a tool")}
text={Content.NO_TOOLS}
title={this.strings.titleText}
text={this.strings.emptyStateText}
colorScheme={"tools"}>
<this.MountedToolInfo />
{!this.isExpress &&
<this.MountedToolInfo />}
<this.ToolSlots />
<this.Tools />
</EmptyStateWrapper>
@ -223,7 +256,7 @@ const ToolSlotInventoryItem = (props: ToolSlotInventoryItemProps) => {
onMouseLeave={() => props.dispatch(setToolHover(undefined))}>
<Row>
<Col xs={7}>
<p>{props.getToolName(tool_id) || t("No tool")}</p>
<p>{props.getToolName(tool_id) || t("Empty")}</p>
</Col>
<Col xs={5}>
<p className="tool-slot-position">

23
frontend/farm_designer/tools/tool_slot_edit_components.tsx
View File

@ -97,13 +97,18 @@ export interface ToolInputRowProps {
tools: TaggedTool[];
selectedTool: TaggedTool | undefined;
onChange(update: { tool_id: number }): void;
isExpress: boolean;
}
export const ToolInputRow = (props: ToolInputRowProps) =>
<div className="tool-slot-tool-input">
<Row>
<Col xs={12}>
<label>{t("Tool")}</label>
<label>
{props.isExpress
? t("Seed Container")
: t("Tool or Seed Container")}
</label>
<ToolSelection
tools={props.tools}
selectedTool={props.selectedTool}
@ -144,6 +149,7 @@ export interface SlotEditRowsProps {
tool: TaggedTool | undefined;
botPosition: BotPosition;
updateToolSlot(update: Partial<TaggedToolSlotPointer["body"]>): void;
isExpress: boolean;
}
export const SlotEditRows = (props: SlotEditRowsProps) =>
@ -153,16 +159,19 @@ export const SlotEditRows = (props: SlotEditRowsProps) =>
gantryMounted={props.toolSlot.body.gantry_mounted}
onChange={props.updateToolSlot} />
<ToolInputRow
isExpress={props.isExpress}
tools={props.tools}
selectedTool={props.tool}
onChange={props.updateToolSlot} />
<SlotDirectionInputRow
toolPulloutDirection={props.toolSlot.body.pullout_direction}
onChange={props.updateToolSlot} />
{!props.toolSlot.body.gantry_mounted &&
<SlotDirectionInputRow
toolPulloutDirection={props.toolSlot.body.pullout_direction}
onChange={props.updateToolSlot} />}
<UseCurrentLocationInputRow
botPosition={props.botPosition}
onChange={props.updateToolSlot} />
<GantryMountedInput
gantryMounted={props.toolSlot.body.gantry_mounted}
onChange={props.updateToolSlot} />
{!props.isExpress &&
<GantryMountedInput
gantryMounted={props.toolSlot.body.gantry_mounted}
onChange={props.updateToolSlot} />}
</div>;

8
frontend/folders/actions.ts
View File

@ -40,11 +40,11 @@ export const setFolderName = (id: number, name: string) => {
return d(save(folder.uuid)) as Promise<{}>;
};
const DEFAULTS: Folder = {
name: "New Folder",
const DEFAULTS = (): Folder => ({
name: t("New Folder"),
color: "gray",
parent_id: 0,
};
});
export const addNewSequenceToFolder = (folder_id?: number) => {
const uuidMap = store.getState().resources.index.byKind["Sequence"];
@ -67,7 +67,7 @@ export const addNewSequenceToFolder = (folder_id?: number) => {
export const createFolder = (config: DeepPartial<Folder> = {}) => {
const d: Function = store.dispatch;
const folder: Folder = { ...DEFAULTS, ...config };
const folder: Folder = { ...DEFAULTS(), ...config };
const action = initSave("Folder", folder);
// tslint:disable-next-line:no-any
const p: Promise<{}> = d(action);

2
frontend/front_page/laptop_splash.tsx
View File

@ -7,7 +7,7 @@ export const LaptopSplash = ({ className }: { className: string }) =>
<div className="laptop">
<div className="laptop-screen">
<video muted autoPlay loop>
<source src={ExternalUrl.Videos.desktop} type="video/mp4" />
<source src={ExternalUrl.Video.desktop} type="video/mp4" />
</video>
<span className="laptop-shine" />
</div>

2
frontend/help/__tests__/tour_test.tsx
View File

@ -56,7 +56,7 @@ describe("<Tour />", () => {
expect(wrapper.state()).toEqual({
run: true, index: 1, returnPath: "/app/messages"
});
expect(history.push).toHaveBeenCalledWith("/app/tools");
expect(history.push).toHaveBeenCalledWith("/app/designer/tools");
});
it("navigates through tour: other", () => {

56
frontend/help/__tests__/tours_test.ts
View File

@ -1,7 +1,22 @@
jest.mock("../../history", () => ({ history: { push: jest.fn() } }));
import { tourPageNavigation } from "../tours";
let mockDev = false;
jest.mock("../../account/dev/dev_support", () => ({
DevSettings: {
futureFeaturesEnabled: () => mockDev,
}
}));
import { fakeState } from "../../__test_support__/fake_state";
const mockState = fakeState();
jest.mock("../../redux/store", () => ({
store: { getState: () => mockState },
}));
import { tourPageNavigation, TOUR_STEPS, Tours } from "../tours";
import { history } from "../../history";
import { fakeTool, fakeFbosConfig } from "../../__test_support__/fake_state/resources";
import { buildResourceIndex } from "../../__test_support__/resource_index_builder";
describe("tourPageNavigation()", () => {
const testCase = (el: string) => {
@ -20,8 +35,47 @@ describe("tourPageNavigation()", () => {
testCase(".regimen-list-panel");
testCase(".tool-list");
testCase(".toolbay-list");
testCase(".tools");
testCase(".tool-slots");
testCase(".tools-panel");
testCase(".photos");
testCase(".logs-table");
testCase(".app-settings-widget");
});
it("includes steps based on tool count", () => {
const getTargets = () =>
Object.values(TOUR_STEPS()[Tours.gettingStarted]).map(t => t.target);
mockDev = false;
mockState.resources = buildResourceIndex([]);
expect(getTargets()).not.toContain(".tool-slots");
mockState.resources = buildResourceIndex([fakeTool()]);
expect(getTargets()).toContain(".tool-slots");
});
it("has correct content based on board version", () => {
const getTitles = () =>
Object.values(TOUR_STEPS()[Tours.gettingStarted]).map(t => t.title);
mockDev = false;
mockState.resources = buildResourceIndex([]);
expect(getTitles()).toContain("Add tools and tool slots");
expect(getTitles()).not.toContain("Add seed containers");
const fbosConfig = fakeFbosConfig();
fbosConfig.body.firmware_hardware = "express_k10";
mockState.resources = buildResourceIndex([fbosConfig]);
expect(getTitles()).toContain("Add seed containers and slots");
expect(getTitles()).not.toContain("Add seed containers");
mockState.resources = buildResourceIndex([fbosConfig, fakeTool()]);
expect(getTitles()).not.toContain("Add seed containers and slots");
expect(getTitles()).toContain("Add seed containers");
});
it("includes correct tour steps", () => {
mockDev = true;
const targets =
Object.values(TOUR_STEPS()[Tours.gettingStarted]).map(t => t.target);
expect(targets).not.toContain(".tools");
expect(targets).toContain(".tool-list");
expect(targets).toContain(".toolbay-list");
});
});

21
frontend/help/tour.tsx
View File

@ -6,6 +6,7 @@ import { TOUR_STEPS, tourPageNavigation } from "./tours";
import { t } from "../i18next_wrapper";
import { Actions } from "../constants";
import { store } from "../redux/store";
import { ErrorBoundary } from "../error_boundary";
const strings = () => ({
back: t("Back"),
@ -65,15 +66,17 @@ export class Tour extends React.Component<TourProps, TourState> {
return step;
});
return <div className="tour">
<Joyride
steps={steps}
run={this.state.run}
callback={this.callback}
stepIndex={this.state.index}
showSkipButton={true}
continuous={true}
styles={STYLES}
locale={strings()} />
<ErrorBoundary>
<Joyride
steps={steps}
run={this.state.run}
callback={this.callback}
stepIndex={this.state.index}
showSkipButton={true}
continuous={true}
styles={STYLES}
locale={strings()} />
</ErrorBoundary>
</div>;
}
}

80
frontend/help/tours.ts
View File

@ -2,6 +2,13 @@ import { history } from "../history";
import { Step as TourStep } from "react-joyride";
import { TourContent } from "../constants";
import { t } from "../i18next_wrapper";
import { DevSettings } from "../account/dev/dev_support";
import { selectAllTools } from "../resources/selectors";
import { store } from "../redux/store";
import { getFbosConfig } from "../resources/getters";
import {
isExpressBoard, getFwHardwareValue
} from "../devices/components/firmware_hardware_support";
export enum Tours {
gettingStarted = "gettingStarted",
@ -15,70 +22,105 @@ export const tourNames = () => [
{ name: Tours.funStuff, description: t("find new features") },
];
const hasTools = () =>
selectAllTools(store.getState().resources.index).length > 0;
const isExpress = () =>
isExpressBoard(getFwHardwareValue(
getFbosConfig(store.getState().resources.index)));
const toolsStep = () => hasTools()
? [{
target: ".tools",
content: isExpress()
? t(TourContent.ADD_SEED_CONTAINERS)
: t(TourContent.ADD_TOOLS),
title: isExpress()
? t("Add seed containers")
: t("Add tools and seed containers"),
}]
: [{
target: ".tools",
content: isExpress()
? t(TourContent.ADD_SEED_CONTAINERS_AND_SLOTS)
: t(TourContent.ADD_TOOLS_AND_SLOTS),
title: isExpress()
? t("Add seed containers and slots")
: t("Add tools and tool slots"),
}];
const toolSlotsStep = () => hasTools()
? [{
target: ".tool-slots",
content: t(TourContent.ADD_TOOLS_AND_SLOTS),
title: t("Add tool slots"),
}]
: [];
export const TOUR_STEPS = (): { [x: string]: TourStep[] } => ({
[Tours.gettingStarted]: [
{
target: ".plant-inventory-panel",
content: TourContent.ADD_PLANTS,
content: t(TourContent.ADD_PLANTS),
title: t("Add plants"),
},
{
...(DevSettings.futureFeaturesEnabled() ? [{
target: ".tool-list",
content: TourContent.ADD_TOOLS,
title: t("Add tools"),
},
{
content: t(TourContent.ADD_TOOLS),
title: t("Add tools and seed containers"),
}] : toolsStep()),
...(DevSettings.futureFeaturesEnabled() ? [{
target: ".toolbay-list",
content: TourContent.ADD_TOOLS_SLOTS,
content: t(TourContent.ADD_TOOLS_SLOTS),
title: t("Add tools to tool bay"),
},
}] : toolSlotsStep()),
{
target: ".peripherals-widget",
content: TourContent.ADD_PERIPHERALS,
content: t(TourContent.ADD_PERIPHERALS),
title: t("Add peripherals"),
},
{
target: ".sequence-list-panel",
content: TourContent.ADD_SEQUENCES,
content: t(TourContent.ADD_SEQUENCES),
title: t("Create sequences"),
},
{
target: ".regimen-list-panel",
content: TourContent.ADD_REGIMENS,
content: t(TourContent.ADD_REGIMENS),
title: t("Create regimens"),
},
{
target: ".farm-event-panel",
content: TourContent.ADD_FARM_EVENTS,
content: t(TourContent.ADD_FARM_EVENTS),
title: t("Create events"),
},
],
[Tours.monitoring]: [
{
target: ".move-widget",
content: TourContent.LOCATION_GRID,
content: t(TourContent.LOCATION_GRID),
title: t("View current location"),
},
{
target: ".farm-designer",
content: TourContent.VIRTUAL_FARMBOT,
content: t(TourContent.VIRTUAL_FARMBOT),
title: t("View current location"),
},
{
target: ".logs-table",
content: TourContent.LOGS_TABLE,
content: t(TourContent.LOGS_TABLE),
title: t("View log messages"),
},
{
target: ".photos",
content: TourContent.PHOTOS,
content: t(TourContent.PHOTOS),
title: t("Take and view photos"),
},
],
[Tours.funStuff]: [
{
target: ".app-settings-widget",
content: TourContent.APP_SETTINGS,
content: t(TourContent.APP_SETTINGS),
title: t("Customize your web app experience"),
},
],
@ -112,6 +154,10 @@ export const tourPageNavigation = (nextStepTarget: string | HTMLElement) => {
case ".toolbay-list":
history.push("/app/tools");
break;
case ".tools":
case ".tool-slots":
history.push("/app/designer/tools");
break;
case ".photos":
history.push("/app/farmware");
break;

4
frontend/messages/__tests__/alerts_test.tsx
View File

@ -52,8 +52,7 @@ describe("<Alerts />", () => {
const p = fakeProps();
p.alerts = [FIRMWARE_MISSING_ALERT, SEED_DATA_MISSING_ALERT];
const wrapper = mount(<Alerts {...p} />);
expect(wrapper.text()).toContain("2");
expect(wrapper.text()).toContain("Your device has no firmware");
expect(wrapper.text()).not.toContain("Your device has no firmware");
expect(wrapper.text()).toContain("Choose your FarmBot");
});
@ -61,7 +60,6 @@ describe("<Alerts />", () => {
const p = fakeProps();
p.alerts = [FIRMWARE_MISSING_ALERT, UNKNOWN_ALERT];
const wrapper = mount(<Alerts {...p} />);
expect(wrapper.text()).toContain("1");
expect(wrapper.text()).toContain("firmware: alert");
});
});

1
frontend/messages/alerts.tsx
View File

@ -34,6 +34,7 @@ export const Alerts = (props: AlertsProps) =>
<div className="problem-alerts-content">
{sortAlerts(props.alerts)
.filter(filterIncompleteAlerts)
.filter(x => x.problem_tag != "farmbot_os.firmware.missing")
.map(x =>
<AlertCard key={x.slug + x.created_at}
alert={x}

3
frontend/redux/upgrade_reminder.ts
View File

@ -2,6 +2,7 @@ import { info } from "../toast/toast";
import { semverCompare, SemverResult, FbosVersionFallback } from "../util";
import { Content } from "../constants";
import { Dictionary } from "lodash";
import { t } from "../i18next_wrapper";
const IDEAL_VERSION =
globalConfig.FBOS_END_OF_LIFE_VERSION || FbosVersionFallback.NULL;
@ -22,7 +23,7 @@ export function createReminderFn() {
!alreadyChecked[version]
// Is it up to date?
&& semverCompare(version, IDEAL_VERSION) === SemverResult.RIGHT_IS_GREATER
&& info(Content.OLD_FBOS_REC_UPGRADE);
&& info(t(Content.OLD_FBOS_REC_UPGRADE));
alreadyChecked[version] = true; // Turn off checks for this version now.
};

6
frontend/sequences/step_tiles/mark_as/__tests__/unpack_step_test.ts
View File

@ -24,7 +24,7 @@ describe("unpackStep()", () => {
step: resourceUpdate({ label: "mounted_tool_id", value: 0 }),
resourceIndex: fakeResourceIndex()
});
expect(result).toEqual(DISMOUNTED);
expect(result).toEqual(DISMOUNTED());
});
it("unpacks valid tool_ids", () => {
@ -37,7 +37,7 @@ describe("unpackStep()", () => {
resourceIndex
});
const actionLabel = "Mounted to: Generic Tool";
const { label, value } = TOOL_MOUNT;
const { label, value } = TOOL_MOUNT();
assertGoodness(result, actionLabel, "mounted", label, value);
});
@ -47,7 +47,7 @@ describe("unpackStep()", () => {
resourceIndex: fakeResourceIndex()
});
const actionLabel = "Mounted to: an unknown tool";
const { label, value } = TOOL_MOUNT;
const { label, value } = TOOL_MOUNT();
assertGoodness(result, actionLabel, "mounted", label, value);
});

27
frontend/sequences/step_tiles/mark_as/unpack_step.ts
View File

@ -9,15 +9,16 @@ import { GenericPointer } from "farmbot/dist/resources/api_resources";
import { MOUNTED_TO } from "./constants";
import { DropDownPair, StepWithResourceIndex } from "./interfaces";
import { TaggedPoint, TaggedPlantPointer } from "farmbot";
import { t } from "../../../i18next_wrapper";
export const TOOL_MOUNT: DropDownItem = {
label: "Tool Mount", value: "tool_mount"
};
const NOT_IN_USE: DropDownItem = { label: "Not Mounted", value: 0 };
export const DISMOUNTED: DropDownPair = {
leftSide: TOOL_MOUNT,
rightSide: NOT_IN_USE
};
export const TOOL_MOUNT = (): DropDownItem => ({
label: t("Tool Mount"), value: "tool_mount"
});
const NOT_IN_USE = (): DropDownItem => ({ label: t("Not Mounted"), value: 0 });
export const DISMOUNTED = (): DropDownPair => ({
leftSide: TOOL_MOUNT(),
rightSide: NOT_IN_USE()
});
const DEFAULT_TOOL_NAME = "Untitled Tool";
const REMOVED_ACTION = { label: "Removed", value: "removed" };
@ -30,13 +31,13 @@ function mountTool(i: StepWithResourceIndex): DropDownPair {
if (typeof value === "number" && value > 0) {
try { // Good tool id
const tool = findToolById(i.resourceIndex, value as number);
return { leftSide: TOOL_MOUNT, rightSide: mountedTo(tool.body.name) };
return { leftSide: TOOL_MOUNT(), rightSide: mountedTo(tool.body.name) };
} catch { // Bad tool ID or app still loading.
return { leftSide: TOOL_MOUNT, rightSide: mountedTo("an unknown tool") };
return { leftSide: TOOL_MOUNT(), rightSide: mountedTo("an unknown tool") };
}
} else {
// No tool id
return DISMOUNTED;
return DISMOUNTED();
}
}
@ -55,10 +56,10 @@ function unknownOption(i: StepWithResourceIndex): DropDownPair {
/** The user wants to mark a the `discarded_at` attribute of a Point. */
function discardPoint(i: StepWithResourceIndex): DropDownPair {
const { resource_id } = i.step.args;
const t =
const genericPointerBody =
findPointerByTypeAndId(i.resourceIndex, "GenericPointer", resource_id).body;
return {
leftSide: pointer2ddi(t as GenericPointer),
leftSide: pointer2ddi(genericPointerBody as GenericPointer),
rightSide: REMOVED_ACTION
};
}

3
public/app-resources/languages/_helper.js
View File

@ -48,7 +48,7 @@ var HelperNamespace = (function () {
var T_REGEX = /[.{[(\s]t\(["`]([\w\s{}().,:'\-=\\?\/%!]*)["`],*\s*.*\)/g;
// '``'
var C_REGEX = /[`]([\w\s{}().,:'\-=\\?"+!]*)[`].*/g;
var C_REGEX = /[`]([\w\s{}().,:'\-=\/\\?"+!]*)[`].*/g;
/** Some additional phrases the regex can't find. */
var EXTRA_TAGS = [
@ -60,6 +60,7 @@ var HelperNamespace = (function () {
"Else Execute", "Connecting FarmBot to the Internet", "move to home",
"emergency stop", "SYNC ERROR", "inactive", "error", "No messages.",
"back to regimens", "back to sequences", "back to farmware list",
"Verify Password",
];
/**

22
public/app-resources/languages/translation_metrics.md
View File

@ -21,20 +21,20 @@ For example, `sudo docker-compose run web npm run translation-check`._
See the [README](https://github.com/FarmBot/Farmbot-Web-App#translating-the-web-app-into-your-language) for contribution instructions.
Total number of phrases identified by the language helper for translation: __1139__
Total number of phrases identified by the language helper for translation: __1238__
|Language|Percent translated|Translated|Untranslated|Other Translations|
|:---:|---:|---:|---:|---:|
|da|10%|109|1030|44|
|de|36%|413|726|141|
|es|88%|1002|137|173|
|fr|90%|1022|117|198|
|it|8%|91|1048|189|
|nl|7%|79|1060|161|
|pt|6%|71|1068|180|
|ru|52%|596|543|221|
|th|0%|0|1139|0|
|zh|8%|86|1053|161|
|da|8%|105|1133|77|
|de|32%|397|841|168|
|es|78%|965|273|210|
|fr|80%|985|253|242|
|it|7%|87|1151|215|
|nl|6%|75|1163|187|
|pt|5%|66|1172|207|
|ru|46%|575|663|246|
|th|0%|0|1238|0|
|zh|7%|82|1156|187|
**Percent translated** refers to the percent of phrases identified by the
language helper that have been translated. Additional phrases not identified