[UNSTABLE] Stub implementation and type updates for new config value.

webpack/config_storage/actions.ts

@@ -0,0 +1,8 @@
+import { BooleanConfigKey } from "./web_app_configs";
+
+/** Inverts boolean config key in WebAppConfig object, stored in the API. */
+export function toggleWebAppBool(key: BooleanConfigKey) {
+  return function (store, getState) {
+    console.log("TODO!");
+  };
+}

webpack/devices/interfaces.ts

@@ -18,6 +18,7 @@ import { TaggedUser } from "../resources/tagged_resources";
 import { WD_ENV } from "../farmware/weed_detector/remote_env/interfaces";
 import { ConnectionStatus, ConnectionState, NetworkState } from "../connectivity/interfaces";
 import { IntegerSize } from "../util";
+import { WebAppConfig } from "../config_storage/web_app_configs";
 
 export interface Props {
   userToApi: ConnectionStatus | undefined;
@@ -155,6 +156,9 @@ export interface FarmwareProps {
   farmwares: Dictionary<FarmwareManifest | undefined>;
   timeOffset: number;
   syncStatus: SyncStatus | undefined;
+  // Partial because easier testing. Change to normal `WebAppConfig` if it
+  // becomes cumbersome later on.
+  webAppConfig: Partial<WebAppConfig>;
 }
 
 export interface HardwareSettingsProps {

webpack/farmware/__tests__/farmware_panel_test.tsx

@@ -28,10 +28,13 @@ describe("<FarmwarePanel/>: actions", () => {
   });
 
   function fakeProps(): FWProps {
+    let showFirstParty = true;
     return {
       farmwares: {},
       botToMqttStatus: "up",
-      syncStatus: "synced"
+      syncStatus: "synced",
+      onToggle: jest.fn(() => showFirstParty = !showFirstParty),
+      showFirstParty
     };
   }
 
@@ -116,10 +119,13 @@ describe("<FarmwarePanel/>: farmware list", () => {
   });
 
   function fakeProps(): FWProps {
+    let showFirstParty = true;
     return {
       botToMqttStatus: "up",
       farmwares: fakeFarmwares(),
-      syncStatus: "synced"
+      syncStatus: "synced",
+      onToggle: jest.fn(() => showFirstParty = !showFirstParty),
+      showFirstParty
     };
   }
 

webpack/farmware/__tests__/farmware_test.tsx

@@ -24,7 +24,8 @@ describe("<FarmwarePage />", () => {
       currentImage: undefined,
       images: [],
       timeOffset: 0,
-      syncStatus: "synced"
+      syncStatus: "synced",
+      webAppConfig: {}
     };
     const wrapper = mount(<FarmwarePage {...props} />);
     ["Take Photo",

webpack/farmware/farmware_panel.tsx

@@ -45,7 +45,7 @@ export function FarmwareConfigMenu(props: FarmwareConfigMenuProps) {
 export class FarmwarePanel extends React.Component<FWProps, Partial<FWState>> {
   constructor(props: FWProps) {
     super(props);
-    this.state = { showFirstParty: false };
+    this.state = {};
   }
 
   componentDidMount() {
@@ -99,10 +99,6 @@ export class FarmwarePanel extends React.Component<FWProps, Partial<FWState>> {
     this.setState({ firstPartyList });
   }
 
-  toggleFirstPartyDisplay = () => {
-    this.setState({ showFirstParty: !this.state.showFirstParty });
-  }
-
   firstPartyFarmwaresPresent = (firstPartyList: string[] | undefined) => {
     const fws = this.props.farmwares;
     const farmwareList = betterCompact(Object.keys(fws)
@@ -113,8 +109,8 @@ export class FarmwarePanel extends React.Component<FWProps, Partial<FWState>> {
   }
 
   fwList = () => {
-    const { farmwares } = this.props;
-    const { firstPartyList, showFirstParty } = this.state;
+    const { farmwares, showFirstParty } = this.props;
+    const { firstPartyList } = this.state;
     const choices = betterCompact(Object
       .keys(farmwares)
       .map(x => farmwares[x]))
@@ -158,8 +154,8 @@ export class FarmwarePanel extends React.Component<FWProps, Partial<FWState>> {
         <Popover position={Position.BOTTOM_RIGHT}>
           <i className="fa fa-gear" />
           <FarmwareConfigMenu
-            show={this.state.showFirstParty}
-            toggle={this.toggleFirstPartyDisplay}
+            show={this.props.showFirstParty}
+            toggle={() => this.props.onToggle("show_first_party_farmware")}
             firstPartyFwsInstalled={
               this.firstPartyFarmwaresPresent(this.state.firstPartyList)} />
         </Popover>

webpack/farmware/index.tsx

@@ -10,6 +10,7 @@ import { WeedDetector } from "./weed_detector/index";
 import { envGet } from "./weed_detector/remote_env/selectors";
 import { FarmwareForms } from "./farmware_forms";
 import { catchErrors } from "../util";
+import { toggleWebAppBool } from "../config_storage/actions";
 
 @connect(mapStateToProps)
 export class FarmwarePage extends React.Component<FarmwareProps, {}> {
@@ -27,6 +28,8 @@ export class FarmwarePage extends React.Component<FarmwareProps, {}> {
         </Col>
         <Col xs={12} sm={5}>
           <FarmwarePanel
+            showFirstParty={!!this.props.webAppConfig.show_first_party_farmware}
+            onToggle={(key) => this.props.dispatch(toggleWebAppBool(key))}
             syncStatus={this.props.syncStatus}
             botToMqttStatus={this.props.botToMqttStatus}
             farmwares={this.props.farmwares} />

webpack/farmware/interfaces.ts

@@ -1,17 +1,19 @@
 import { Dictionary, FarmwareManifest, SyncStatus } from "farmbot/dist";
 import { NetworkState } from "../connectivity/interfaces";
+import { BooleanConfigKey } from "../config_storage/web_app_configs";
 
 export interface FWState {
   selectedFarmware: string | undefined;
   packageUrl: string | undefined;
   firstPartyList: string[];
-  showFirstParty: boolean;
 }
 
 export interface FWProps {
   botToMqttStatus: NetworkState;
   syncStatus: SyncStatus | undefined;
   farmwares: Dictionary<FarmwareManifest | undefined>;
+  showFirstParty: boolean;
+  onToggle(key: BooleanConfigKey): void;
 }
 
 export interface FarmwareState {

webpack/farmware/state_to_props.ts

@@ -1,5 +1,5 @@
 import { Everything } from "../interfaces";
-import { selectAllImages, maybeGetTimeOffset } from "../resources/selectors";
+import { selectAllImages, maybeGetTimeOffset, getWebAppConfig } from "../resources/selectors";
 import { FarmwareProps } from "../devices/interfaces";
 import { prepopulateEnv } from "./weed_detector/remote_env/selectors";
 import * as _ from "lodash";
@@ -24,6 +24,7 @@ export function mapStateToProps(props: Everything): FarmwareProps {
     dispatch: props.dispatch,
     currentImage,
     images,
-    syncStatus: "synced"
+    syncStatus: "synced",
+    webAppConfig: getWebAppConfig(props.resources.index) || {}
   };
 }

webpack/farmware/weed_detector/__tests__/weed_detector_test.tsx

@@ -27,7 +27,8 @@ describe("<WeedDetector />", () => {
     dispatch: jest.fn(),
     currentImage: undefined,
     images: [],
-    syncStatus: "synced"
+    syncStatus: "synced",
+    webAppConfig: {}
   };
 
   it("renders", () => {