v15.20.0

frontend/__test_support__/three_d_mocks.tsx

@@ -10,7 +10,9 @@ import * as THREE from "three";
 import React, { ReactNode } from "react";
 import { TransitionFn, UseSpringProps } from "@react-spring/three";
 import { ThreeElements, ThreeEvent } from "@react-three/fiber";
-import { Cloud, Clouds, Image, Plane, Trail, Tube } from "@react-three/drei";
+import {
+  Cloud, Clouds, Image, Instance, Instances, Plane, Trail, Tube,
+} from "@react-three/drei";
 
 const GroupForTests = (props: ThreeElements["group"]) =>
   // @ts-expect-error Property does not exist on type JSX.IntrinsicElements
@@ -47,6 +49,13 @@ jest.mock("../three_d_garden/components", () => ({
     props.visible === false
       ? <></>
       : <GroupForTests {...props} />,
+  MeshBasicMaterial: (props: THREE.MeshBasicMaterial) => {
+    // eslint-disable-next-line max-len
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-explicit-any
+    props.onBeforeCompile?.({} as any, {} as any);
+    // @ts-expect-error Property does not exist on type JSX.IntrinsicElements
+    return <div {...props} />;
+  },
 }));
 
 jest.mock("three/examples/jsm/Addons.js", () => ({
@@ -64,6 +73,7 @@ jest.mock("@react-three/fiber", () => ({
     pointer: { x: 0, y: 0 },
     camera: new THREE.PerspectiveCamera(),
   })),
+  extend: jest.fn(),
 }));
 
 jest.mock("@react-spring/three", () => ({
@@ -559,6 +569,11 @@ jest.mock("@react-three/drei", () => {
   return {
     ...jest.requireActual("@react-three/drei"),
     useGLTF,
+    shaderMaterial: jest.fn(),
+    Instances: (props: React.ComponentProps<typeof Instances>) =>
+      <div className={"instances"}>{props.children}</div>,
+    Instance: (props: React.ComponentProps<typeof Instance>) =>
+      <div className={"instance"}>{props.name}</div>,
     RoundedBox: ({ name }: { name: string }) =>
       <div className={"cylinder"}>{name}</div>,
     Plane: (props: React.ComponentProps<typeof Plane>) =>

frontend/api/__tests__/api_test.ts

@@ -10,7 +10,7 @@ describe("API", () => {
     [
       [API.current.pointSearchPath, BASE + "/api/points/search"],
       [API.current.allPointsPath, BASE + "/api/points/?filter=all"],
-      [API.current.sensorReadingPath, BASE + "/api/sensor_readings"],
+      [API.current.sensorReadingPath, BASE + "/api/sensor_readings/"],
       [API.current.farmwareEnvPath, BASE + "/api/farmware_envs/"],
       [API.current.plantTemplatePath, BASE + "/api/plant_templates/"],
       [API.current.farmwareInstallationPath, BASE + "/api/farmware_installations/"],

frontend/api/api.ts

@@ -139,7 +139,7 @@ export class API {
   /** /api/firmware_config */
   get firmwareConfigPath() { return `${this.baseUrl}/api/firmware_config/`; }
   /** /api/sensor_readings */
-  get sensorReadingPath() { return `${this.baseUrl}/api/sensor_readings`; }
+  get sensorReadingPath() { return `${this.baseUrl}/api/sensor_readings/`; }
   /** /api/sensors/ */
   get sensorPath() { return `${this.baseUrl}/api/sensors/`; }
   /** /api/farmware_envs/:id */

frontend/css/panels/sensors.scss

@@ -20,18 +20,37 @@
   font-size: 1.2rem;
   background: $translucent1_white;
   border-radius: 0.5rem;
+  max-height: 50rem;
+  overflow: scroll;
   th,
   td {
     width: 1%;
+    padding: 0.25rem;
+    &:first-of-type {
+      padding-left: 0.5rem;
+    }
+    &:last-of-type {
+      padding: 0;
+    }
   }
   tr {
+    height: 3rem;
     &.previous {
       color: $medium_gray;
     }
     &.selected {
       background: $translucent1_white;
     }
   }
+  label {
+    font-size: 1.1rem;
+  }
+  .fa-trash {
+    color: $transparent;
+    &:hover {
+      color: unset; // sass-lint:disable-line variable-for-property
+    }
+  }
   .sensor-history-table-contents {
     max-height: 20rem;
     overflow-y: auto;

frontend/demo/lua_runner/__tests__/calculate_move_test.ts

@@ -420,7 +420,7 @@ describe("calculateMove()", () => {
   });
 
   it("handles soil height z axis overwrite: triangle data", () => {
-    sessionStorage.setItem("triangles", "[\"foo\"]");
+    sessionStorage.setItem("soilSurfaceTriangles", "[\"foo\"]");
     const command: Move = {
       kind: "move",
       args: {},

frontend/demo/lua_runner/__tests__/index_test.ts

@@ -1410,6 +1410,15 @@ describe("runDemoLuaCode()", () => {
     expect(error).not.toHaveBeenCalled();
     expect(console.log).toHaveBeenCalledWith("0");
     expect(info).not.toHaveBeenCalled();
+    expect(initSave).toHaveBeenCalledWith("SensorReading", {
+      pin: 5,
+      mode: 1,
+      x: 1,
+      y: 2,
+      z: 0,
+      value: 0,
+      read_at: expect.any(String),
+    });
   });
 
   it("runs move_relative", () => {

frontend/demo/lua_runner/actions.ts

@@ -235,6 +235,18 @@ export const expandActions = (
           setCurrent(homeTarget);
         });
         break;
+      case "read_pin":
+        const pin = action.args[0] as number;
+        expanded.push({
+          type: "sensor_reading",
+          args: [
+            pin,
+            current.x,
+            current.y,
+            current.z,
+          ],
+        });
+        break;
       default:
         expanded.push(action);
         break;
@@ -361,6 +373,18 @@ export const runActions = (
               payload: action.args[0] as number,
             });
           };
+        case "sensor_reading":
+          return () => {
+            store.dispatch(initSave("SensorReading", {
+              pin: action.args[0] as number,
+              mode: 1,
+              x: action.args[1] as number,
+              y: action.args[2] as number,
+              z: action.args[3] as number,
+              value: random(0, 1024),
+              read_at: (new Date()).toISOString(),
+            }) as unknown as UnknownAction);
+          };
         case "write_pin":
           const pin = action.args[0] as number;
           const mode = action.args[1] as string;

frontend/demo/lua_runner/interfaces.ts

@@ -8,6 +8,8 @@ export interface Action {
     | "move"
     | "_move"
     | "toggle_pin"
+    | "read_pin"
+    | "sensor_reading"
     | "emergency_lock"
     | "emergency_unlock"
     | "find_home"

frontend/demo/lua_runner/run.ts

@@ -536,6 +536,7 @@ export const runLua =
         jsToLua(L, toolMounted ? 0 : 1);
         return 1;
       }
+      actions.push({ type: "read_pin", args: [pin] });
       jsToLua(L, 0);
       return 1;
     });

frontend/demo/lua_runner/stubs.ts

@@ -59,7 +59,7 @@ export const getSafeZ = (): number => {
 
 export const getSoilHeight = (x: number, y: number): number => {
   const triangles = JSON.parse(
-    sessionStorage.getItem("triangles") || "[]") as TriangleData[];
+    sessionStorage.getItem("soilSurfaceTriangles") || "[]") as TriangleData[];
   const getZ = getZFunc(triangles, -500);
   return getZ(x, y);
 };

frontend/devices/__tests__/actions_test.ts

@@ -610,13 +610,24 @@ describe("pinToggle()", () => {
 });
 
 describe("readPin()", () => {
+  afterEach(() => {
+    localStorage.removeItem("myBotIs");
+  });
+
   it("calls readPin", async () => {
     await actions.readPin(1, "label", 0);
     expect(mockDevice.current.readPin).toHaveBeenCalledWith({
       pin_number: 1, label: "label", pin_mode: 0,
     });
     expect(success).not.toHaveBeenCalled();
   });
+
+  it("reads demo account pin", async () => {
+    localStorage.setItem("myBotIs", "online");
+    await actions.readPin(1, "label", 0);
+    expect(mockDevice.current.readPin).not.toHaveBeenCalled();
+    expect(runDemoLuaCode).toHaveBeenCalledWith("read_pin(1)");
+  });
 });
 
 describe("writePin()", () => {

frontend/devices/actions.ts

@@ -447,7 +447,10 @@ export function readPin(
   pin_number: number, label: string, pin_mode: ALLOWED_PIN_MODES,
 ) {
   const noun = t("Read pin");
-  maybeNoop();
+  if (forceOnline()) {
+    runDemoLuaCode(`read_pin(${pin_number})`);
+    return;
+  }
   return getDevice()
     .readPin({ pin_number, label, pin_mode })
     .then(maybeNoop, commandErr(noun));

frontend/farm_designer/__tests__/three_d_garden_map_test.tsx

@@ -20,7 +20,7 @@ import { fakePlant } from "../../__test_support__/fake_state/resources";
 import { render } from "@testing-library/react";
 import { ThreeDGarden } from "../../three_d_garden";
 import { clone } from "lodash";
-import { INITIAL } from "../../three_d_garden/config";
+import { INITIAL, SurfaceDebugOption } from "../../three_d_garden/config";
 import { FirmwareHardware } from "farmbot";
 import { CROPS } from "../../crops/constants";
 import { fakeDevice } from "../../__test_support__/resource_index_builder";
@@ -32,6 +32,8 @@ const EMPTY_PROPS = {
   allPoints: [],
   groups: [],
   images: [],
+  sensors: [],
+  sensorReadings: [],
 };
 
 describe("<ThreeDGardenMap />", () => {
@@ -56,7 +58,10 @@ describe("<ThreeDGardenMap />", () => {
     allPoints: [],
     groups: [],
     images: [],
+    sensors: [],
+    sensorReadings: [],
     cameraCalibrationData: fakeCameraCalibrationData(),
+    farmwareEnvs: [],
   });
 
   it("converts props", () => {
@@ -97,7 +102,8 @@ describe("<ThreeDGardenMap />", () => {
     expectedConfig.cableDebug = true;
     expectedConfig.eventDebug = true;
     expectedConfig.lightsDebug = true;
-    expectedConfig.surfaceDebug = true;
+    expectedConfig.moistureDebug = true;
+    expectedConfig.surfaceDebug = SurfaceDebugOption.normals;
     expectedConfig.lowDetail = true;
     expectedConfig.solar = true;
     expectedConfig.stats = true;

frontend/farm_designer/index.tsx

@@ -188,7 +188,6 @@ export class RawFarmDesigner
         showZones={show_zones}
         showSensorReadings={show_sensor_readings}
         showMoistureInterpolationMap={show_moisture_interpolation_map}
-        hasSensorReadings={this.props.sensorReadings.length > 0}
         dispatch={this.props.dispatch}
         timeSettings={this.props.timeSettings}
         getConfigValue={this.props.getConfigValue}
@@ -236,6 +235,9 @@ export class RawFarmDesigner
           allPoints={this.props.allPoints}
           groups={this.props.groups}
           images={this.props.latestImages}
+          sensorReadings={this.props.sensorReadings}
+          sensors={this.props.sensors}
+          farmwareEnvs={this.props.farmwareEnvs}
           cameraCalibrationData={this.props.cameraCalibrationData}
           getWebAppConfigValue={this.props.getConfigValue} />
         : <div

frontend/farm_designer/location_info.tsx

@@ -38,7 +38,7 @@ import { TableRow } from "../sensors/sensor_readings/table";
 import { unselectPlant } from "./map/actions";
 import { EmptyStateGraphic, EmptyStateWrapper, ExpandableHeader } from "../ui";
 import {
-  fetchInterpolationOptions, interpolatedZ,
+  fetchInterpolationOptions, GetColor, interpolatedZ,
 } from "./map/layers/points/interpolation_map";
 import { Collapse } from "@blueprintjs/core";
 import { ImageFlipper } from "../photos/images/image_flipper";
@@ -250,7 +250,7 @@ interface ItemListWrapperProps {
   items: Item[];
   dispatch: Function;
   title: string;
-  getColorOverride(z: number): string;
+  getColorOverride: GetColor;
   showZ?: boolean;
   timeSettings: TimeSettings;
   sensorNameByPinLookup: Record<number, string>,
@@ -397,6 +397,7 @@ const ReadingsListItem = (props: ReadingsListItemProps) =>
             const sensorName = `${props.sensorNameByPinLookup[pin]} (pin ${pin})`;
             return <TableRow
               key={item.uuid}
+              dispatch={props.dispatch}
               sensorName={sensorName}
               sensorReading={item}
               timeSettings={props.timeSettings}

frontend/farm_designer/map/interfaces.ts

@@ -17,6 +17,7 @@ import { GetWebAppConfigValue } from "../../config_storage/actions";
 import { TimeSettings } from "../../interfaces";
 import { UUID } from "../../resources/interfaces";
 import { PeripheralValues } from "./layers/farmbot/bot_trail";
+import { GetColor } from "./layers/points/interpolation_map";
 
 export type TaggedPlant = TaggedPlantPointer | TaggedPlantTemplate;
 
@@ -52,7 +53,6 @@ export interface GardenMapLegendProps {
   showZones: boolean;
   showSensorReadings: boolean;
   showMoistureInterpolationMap: boolean;
-  hasSensorReadings: boolean;
   dispatch: Function;
   timeSettings: TimeSettings;
   getConfigValue: GetWebAppConfigValue;
@@ -67,8 +67,8 @@ export interface GardenMapLegendProps {
 }
 
 export type MapTransformProps = {
-  quadrant: BotOriginQuadrant,
-  gridSize: AxisNumberProperty
+  quadrant: BotOriginQuadrant;
+  gridSize: AxisNumberProperty;
   xySwap: boolean;
 };
 
@@ -103,7 +103,7 @@ export interface GardenPointProps {
   hovered: boolean;
   dispatch: Function;
   soilHeightLabels: boolean;
-  getSoilHeightColor(z: number): string;
+  getSoilHeightColor: GetColor;
   animate: boolean;
 }
 

frontend/farm_designer/map/layers/points/__tests__/garden_point_test.tsx

@@ -28,7 +28,7 @@ describe("<GardenPoint/>", () => {
     cropPhotos: false,
     showUncroppedArea: false,
     soilHeightLabels: false,
-    getSoilHeightColor: () => "rgb(128, 128, 128)",
+    getSoilHeightColor: () => ({ rgb: "rgb(128, 128, 128)", a: 1 }),
     current: false,
     animate: false,
   });
@@ -125,7 +125,7 @@ describe("<GardenPoint/>", () => {
     const wrapper = svgMount(<GardenPoint {...p} />);
     expect(wrapper.text()).toContain("-100");
     expect(wrapper.find("text").first().props().fill)
-      .toEqual(p.getSoilHeightColor(-100));
+      .toEqual(p.getSoilHeightColor(-100).rgb);
     expect(wrapper.find("text").first().props().stroke).toEqual(Color.black);
   });
 

frontend/farm_designer/map/layers/points/garden_point.tsx

@@ -46,7 +46,7 @@ export const GardenPoint = (props: GardenPointProps) => {
     {props.soilHeightLabels && soilHeightPoint(point) &&
       <text x={qx} y={qy}
         fontSize={40} fontWeight={"bold"}
-        fill={props.getSoilHeightColor(z)} fillOpacity={1}
+        fill={props.getSoilHeightColor(z).rgb} fillOpacity={1}
         stroke={hovered ? Color.orange : Color.black}
         strokeOpacity={1}
         strokeWidth={hovered ? 10 : 4}