🎉 🎉 🎉 App loads under parcel. Thanks, @mischnic !!

config/application.rb

@@ -72,7 +72,7 @@ module FarmBot
         "#{ENV.fetch("API_HOST")}:3000",
         "#{ENV.fetch("API_HOST")}:3808",
       ]
-      config.csp                               = {
+      config.csp = {
         default_src: %w(https: 'self'),
         base_uri: %w('self'),
         block_all_mixed_content: false, # :( Some webcam feeds use http://

frontend/api/crud.ts

@@ -15,7 +15,7 @@ import { defensiveClone, unpackUUID } from "../util";
 import { EditResourceParams } from "./interfaces";
 import { ResourceIndex } from "../resources/interfaces";
 import { SequenceBodyItem } from "farmbot/dist";
-import * as _ from "lodash";
+import _ from "lodash";
 import { Actions } from "../constants";
 import { maybeStartTracking } from "./maybe_start_tracking";
 import { t } from "i18next";

frontend/app.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { t } from "i18next";
 import { connect } from "react-redux";
-import * as _ from "lodash";
+import _ from "lodash";
 import { init, error } from "farmbot-toastr";
 import { NavBar } from "./nav";
 import { Everything } from "./interfaces";

frontend/connectivity/log_handlers.ts

@@ -8,7 +8,7 @@ import {
 import { GetState } from "../redux/interfaces";
 import { dispatchNetworkDown } from ".";
 import { Log } from "farmbot/dist/resources/api_resources";
-import * as _ from "lodash";
+import _ from "lodash";
 import { globalQueue } from "./batch_queue";
 
 const LEGACY_META_KEY_NAMES: (keyof Log)[] = [

frontend/controls/axis_input_box_group.tsx

@@ -7,7 +7,7 @@ import {
   AxisInputBoxGroupState,
   Vector
 } from "./interfaces";
-import * as _ from "lodash";
+import _ from "lodash";
 
 /** Coordinate input and GO button for Move widget. */
 export class AxisInputBoxGroup extends

frontend/controls/move/motor_position_plot.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import * as _ from "lodash";
+import _ from "lodash";
 import { Xyz, LocationName, Dictionary } from "farmbot";
 import moment from "moment";
 import { BotLocationData, BotPosition } from "../../devices/interfaces";

frontend/controls/move/step_size_selector.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { Component } from "react";
 import { StepSizeSelectorProps } from "./interfaces";
-import * as _ from "lodash";
+import _ from "lodash";
 
 export class StepSizeSelector extends Component<StepSizeSelectorProps, {}> {
   cssForIndex(num: number) {

frontend/controls/state_to_props.ts

@@ -9,7 +9,7 @@ import {
 } from "../resources/selectors";
 import { Props } from "./interfaces";
 import { maybeFetchUser } from "../resources/selectors";
-import * as _ from "lodash";
+import _ from "lodash";
 import {
   validFwConfig, shouldDisplay, determineInstalledOsVersion
 } from "../util";

frontend/controls/webcam/edit.tsx

@@ -5,7 +5,7 @@ import { ToolTips } from "../../constants";
 import { WebcamPanelProps } from "./interfaces";
 import { KeyValEditRow } from "../key_val_edit_row";
 import { SpecialStatus, TaggedWebcamFeed } from "farmbot";
-import * as _ from "lodash";
+import _ from "lodash";
 
 export function sortedFeeds(feeds: TaggedWebcamFeed[]): TaggedWebcamFeed[] {
   return _.sortBy(feeds, (f) => { return f.body.id || Infinity; });

frontend/devices/actions.ts

@@ -1,6 +1,6 @@
 import { t } from "i18next";
 import axios from "axios";
-import * as _ from "lodash";
+import _ from "lodash";
 import { success, warning, info, error } from "farmbot-toastr";
 import { getDevice } from "../device";
 import { Everything } from "../interfaces";

frontend/devices/components/bot_config_input_box.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import * as _ from "lodash";
+import _ from "lodash";
 import { BlurableInput } from "../../ui/index";
 import { SourceFbosConfig } from "../interfaces";
 import { ConfigurationName } from "farmbot/dist";

frontend/devices/components/mcu_input_box.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import * as _ from "lodash";
+import _ from "lodash";
 import { warning } from "farmbot-toastr";
 import { McuInputBoxProps } from "../interfaces";
 import { updateMCU } from "../actions";

frontend/devices/pin_bindings/rpi_gpio_diagram.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { Color } from "../../ui/colors";
-import * as _ from "lodash";
+import _ from "lodash";
 import { reservedPiGPIO } from "./list_and_label_support";
 
 export interface RpiGpioDiagramProps {

frontend/devices/timezones/guess_timezone.ts

@@ -1,5 +1,5 @@
 import { t } from "i18next";
-import * as _ from "lodash";
+import _ from "lodash";
 import { Content } from "../../constants";
 
 /** Used for every new account the first time the Device page is loaded. */

frontend/devices/timezones/timezone_selector.tsx

@@ -2,7 +2,7 @@ import * as React from "react";
 import { FBSelect, DropDownItem } from "../../ui/index";
 import { list } from "./tz_list";
 import { inferTimezone } from "./guess_timezone";
-import * as _ from "lodash";
+import _ from "lodash";
 
 const CHOICES: DropDownItem[] = list.map(x => ({ label: x, value: x }));
 

frontend/farm_designer/actions.ts

@@ -1,7 +1,7 @@
 import { MovePlantProps, DraggableEvent } from "./interfaces";
 import { defensiveClone } from "../util";
 import { edit } from "../api/crud";
-import * as _ from "lodash";
+import _ from "lodash";
 import { history, getPathArray } from "../history";
 import { Actions } from "../constants";
 import { svgToUrl, DEFAULT_ICON } from "../open_farm/icons";

frontend/farm_designer/farm_events/calendar/index.ts

@@ -1,7 +1,7 @@
 import { Dictionary } from "farmbot/dist";
 import { CalendarOccurrence, CalendarDay } from "../../interfaces";
 import moment from "moment";
-import * as _ from "lodash";
+import _ from "lodash";
 
 export class Calendar {
   /** We sort by this attribute. Left as const so that the compiler can catch

frontend/farm_designer/farm_events/farm_events.tsx

@@ -6,7 +6,7 @@ import { mapStateToProps } from "./map_state_to_props";
 import {
   FarmEventProps, CalendarOccurrence, FarmEventState
 } from "../interfaces";
-import * as _ from "lodash";
+import _ from "lodash";
 import moment from "moment";
 import { Content } from "../../constants";
 import { DesignerNavTabs } from "../panel_header";

frontend/farm_designer/map/active_plant/hovered_plant.tsx

@@ -4,7 +4,7 @@ import { transformXY, round } from "../util";
 import { MapTransformProps, TaggedPlant } from "../interfaces";
 import { SpreadCircle } from "../layers/spread/spread_layer";
 import { Circle } from "../layers/plants/circle";
-import * as _ from "lodash";
+import _ from "lodash";
 
 /**
  * For showing the map plant hovered in the plant panel.

frontend/farm_designer/map/background/grid.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { GridProps } from "../interfaces";
 import { transformXY, transformForQuadrant } from "../util";
-import * as _ from "lodash";
+import _ from "lodash";
 import { Color } from "../../../ui/index";
 
 export function Grid(props: GridProps) {

frontend/farm_designer/map/layers/farmbot/bot_peripherals.tsx

@@ -2,7 +2,7 @@ import * as React from "react";
 import { AxisNumberProperty, MapTransformProps } from "../../interfaces";
 import { getMapSize, transformXY } from "../../util";
 import { BotPosition } from "../../../../devices/interfaces";
-import * as _ from "lodash";
+import _ from "lodash";
 import { trim } from "../../../../util";
 import { GetWebAppConfigValue } from "../../../../config_storage/actions";
 import { BooleanSetting } from "../../../../session_keys";

frontend/farm_designer/map/layers/farmbot/bot_trail.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import * as _ from "lodash";
+import _ from "lodash";
 import { MapTransformProps } from "../../interfaces";
 import { transformXY } from "../../util";
 import { BotPosition } from "../../../../devices/interfaces";

frontend/farm_designer/map/layers/plants/plant_layer.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import * as _ from "lodash";
+import _ from "lodash";
 import { GardenPlant } from "./garden_plant";
 import { PlantLayerProps } from "../../interfaces";
 import { unpackUUID } from "../../../../util";

frontend/farm_designer/map/layers/tool_slots/tool_slot_point.tsx

@@ -2,7 +2,7 @@ import * as React from "react";
 import { SlotWithTool } from "../../../../resources/interfaces";
 import { transformXY } from "../../util";
 import { MapTransformProps } from "../../interfaces";
-import * as _ from "lodash";
+import _ from "lodash";
 import { ToolbaySlot, ToolNames, Tool } from "./tool_graphics";
 import { ToolLabel } from "./tool_label";
 

frontend/farm_designer/plants/crop_info.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { t } from "i18next";
-import * as _ from "lodash";
+import _ from "lodash";
 import { svgToUrl } from "../../open_farm/icons";
 import {
   CropInfoProps, CropLiveSearchResult, OpenfarmSearch

frontend/farm_designer/plants/map_state_to_props.tsx

@@ -6,7 +6,7 @@ import {
 } from "../../resources/selectors";
 import { history } from "../../history";
 import { PlantStage } from "farmbot";
-import * as _ from "lodash";
+import _ from "lodash";
 import { TaggedPlant } from "../map/interfaces";
 
 export function mapStateToProps(props: Everything): EditPlantInfoProps {

frontend/farm_designer/plants/plant_panel.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import * as _ from "lodash";
+import _ from "lodash";
 import { t } from "i18next";
 import { FormattedPlantInfo } from "./map_state_to_props";
 import { round } from "../map/util";

frontend/farm_designer/search_selectors.ts

@@ -1,4 +1,4 @@
-import * as _ from "lodash";
+import _ from "lodash";
 import { CropLiveSearchResult } from "./interfaces";
 import { t } from "i18next";
 import { DEFAULT_ICON } from "../open_farm/icons";

frontend/farm_designer/state_to_props.ts

@@ -12,7 +12,7 @@ import {
   selectAllSensors,
   maybeGetDevice
 } from "../resources/selectors";
-import * as _ from "lodash";
+import _ from "lodash";
 import {
   validBotLocationData, validFwConfig, unpackUUID,
   shouldDisplay as shouldDisplayFunc,

frontend/farm_designer/util.ts

@@ -1,5 +1,5 @@
 import axios, { AxiosPromise } from "axios";
-import * as _ from "lodash";
+import _ from "lodash";
 import { OpenFarm, CropSearchResult } from "./openfarm";
 import { DEFAULT_ICON } from "../open_farm/icons";
 import { Actions } from "../constants";

frontend/farmware/farmware_forms.tsx

@@ -3,7 +3,7 @@ import { Col, BlurableInput } from "../ui/index";
 import { t } from "i18next";
 import { FarmwareManifest, Pair, FarmwareConfig } from "farmbot";
 import { getDevice } from "../device";
-import * as _ from "lodash";
+import _ from "lodash";
 import {
   ShouldDisplay, Feature, SaveFarmwareEnv, UserEnv
 } from "../devices/interfaces";

frontend/farmware/images/photos.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import * as _ from "lodash";
+import _ from "lodash";
 import moment from "moment";
 import { t } from "i18next";
 import { success, error } from "farmbot-toastr";

frontend/farmware/state_to_props.ts

@@ -6,7 +6,7 @@ import {
   FarmwareProps, Feature, SaveFarmwareEnv, UserEnv
 } from "../devices/interfaces";
 import { prepopulateEnv } from "./weed_detector/remote_env/selectors";
-import * as _ from "lodash";
+import _ from "lodash";
 import {
   selectAllFarmwareEnvs, selectAllFarmwareInstallations
 } from "../resources/selectors_by_kind";

frontend/farmware/weed_detector/actions.tsx

@@ -1,4 +1,4 @@
-import * as _ from "lodash";
+import _ from "lodash";
 import axios from "axios";
 import { t } from "i18next";
 import { success, error } from "farmbot-toastr";

frontend/farmware/weed_detector/config.tsx

@@ -6,7 +6,7 @@ import {
   FBSelect, NULL_CHOICE, DropDownItem
 } from "../../ui/index";
 import { SettingsMenuProps } from "./interfaces";
-import * as _ from "lodash";
+import _ from "lodash";
 import {
   SPECIAL_VALUE_DDI, CALIBRATION_DROPDOWNS, ORIGIN_DROPDOWNS
 } from "./constants";

frontend/farmware/weed_detector/farmbot_picker.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import { Hue, Saturation } from "react-color/lib/components/common";
 import { FarmbotPickerProps } from "./interfaces";
-import * as _ from "lodash";
+import _ from "lodash";
 import { Color } from "../../ui/index";
 
 /** Wrapper class around `react-color`'s `<Saturation />` and `<Hue />`.

frontend/farmware/weed_detector/remote_env/constants.ts

@@ -1,5 +1,5 @@
 import { box } from "boxed_value";
-import * as _ from "lodash";
+import _ from "lodash";
 import { WDENVKey, Translation, FormatTranslationMap } from "./interfaces";
 
 /** I would rather not deal with all the weird edge cases that come with

frontend/farmware/weed_detector/remote_env/selectors.ts

@@ -2,7 +2,7 @@
 import { WDENVKey, WD_ENV } from "./interfaces";
 import { WD_KEY_DEFAULTS, EVERY_WD_KEY } from "./constants";
 import { defensiveClone, betterParseNum } from "../../../util";
-import * as _ from "lodash";
+import _ from "lodash";
 import { parseEnvKey } from "./translators";
 import { isNumber } from "lodash";
 import { UserEnv } from "../../../devices/interfaces";

frontend/front_page/front_page.tsx

@@ -1,7 +1,7 @@
 import * as React from "react";
 import axios from "axios";
 import { t } from "i18next";
-import * as _ from "lodash";
+import _ from "lodash";
 import { error as log, success, init as logInit } from "farmbot-toastr";
 import { AuthState } from "../auth/interfaces";
 import { prettyPrintApiErrors, attachToRoot } from "../util";

frontend/hotkeys.tsx

@@ -1,5 +1,5 @@
 import * as React from "react";
-import * as _ from "lodash";
+import _ from "lodash";
 import { t } from "i18next";
 import { links } from "./nav/nav_links";
 import { sync } from "./devices/actions";

frontend/interceptor_support.ts

@@ -1,6 +1,6 @@
 import { DataChangeType, Dictionary } from "farmbot/dist";
 import { box } from "boxed_value";
-import * as _ from "lodash";
+import _ from "lodash";
 
 export let METHOD_MAP: Dictionary<DataChangeType> = {
   "post": "add",

frontend/interceptors.ts

@@ -6,7 +6,7 @@ import {
 } from "./interceptor_support";
 import { API } from "./api/index";
 import { AuthState } from "./auth/interfaces";
-import * as _ from "lodash";
+import _ from "lodash";
 import { AxiosRequestConfig, AxiosResponse } from "axios";
 import { Content } from "./constants";
 import { dispatchNetworkUp, dispatchNetworkDown } from "./connectivity/index";

frontend/logs/components/filter_menu.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { LogsFilterMenuProps } from "../interfaces";
-import * as _ from "lodash";
+import _ from "lodash";
 import { Slider } from "@blueprintjs/core";
 import { t } from "i18next";
 import { Filters } from "../interfaces";

frontend/logs/state_to_props.ts

@@ -1,6 +1,6 @@
 import { Everything } from "../interfaces";
 import { selectAllLogs, maybeGetTimeOffset } from "../resources/selectors";
-import * as _ from "lodash";
+import _ from "lodash";
 import { LogsProps } from "./interfaces";
 import {
   sourceFbosConfigValue

frontend/regimens/bulk_scheduler/utils.ts

@@ -1,5 +1,5 @@
 import moment from "moment";
-import * as _ from "lodash";
+import _ from "lodash";
 
 export function msToTime(ms: number) {
   if (_.isNumber(ms)) {

frontend/regimens/reducer.ts

@@ -1,4 +1,4 @@
-import * as _ from "lodash";
+import _ from "lodash";
 import { Dictionary, TaggedResource } from "farmbot";
 import { Week, DAYS } from "./bulk_scheduler/interfaces";
 import { generateReducer } from "../redux/generate_reducer";

frontend/regimens/state_to_props.ts

@@ -20,7 +20,7 @@ import {
   randomColor, determineInstalledOsVersion,
   shouldDisplay as shouldDisplayFunc
 } from "../util";
-import * as _ from "lodash";
+import _ from "lodash";
 import { resourceUsageList } from "../resources/in_use";
 
 export function mapStateToProps(props: Everything): Props {

frontend/resources/selectors.ts

@@ -1,4 +1,4 @@
-import * as _ from "lodash";
+import _ from "lodash";
 import { ResourceIndex } from "./interfaces";
 import {
   ResourceName,

frontend/resources/selectors_by_id.ts

@@ -17,7 +17,7 @@ import {
 } from "farmbot";
 import { ResourceIndex } from "./interfaces";
 import { isNumber } from "lodash";
-import * as _ from "lodash";
+import _ from "lodash";
 import { joinKindAndId } from "./reducer_support";
 import { findAll } from "./find_all";
 

frontend/resources/tagged_resources.ts

@@ -1,6 +1,5 @@
-import { isObject, isString, get } from "lodash";
+import { isObject, isString, get, chain } from "lodash";
 import { betterCompact } from "../util";
-import * as _ from "lodash";
 import { assertUuid } from "./util";
 import {
   TaggedResource,
@@ -33,7 +32,7 @@ export interface TaggedResourceBase {
 /** Given an array of TaggedResources, returns the most "important" special status.
  * the hierarchy is SAVED => DIRTY => SAVING  */
 export function getArrayStatus(i: TaggedResource[]): SpecialStatus {
-  const r = betterCompact(_(i).map(x => x.specialStatus).uniq().value());
+  const r = betterCompact(chain(i).map(x => x.specialStatus).uniq().value());
   if (r.length) {
     return (r.includes(SpecialStatus.SAVING)) ?
       SpecialStatus.SAVING : SpecialStatus.DIRTY;

frontend/resources/util.ts

@@ -1,7 +1,7 @@
 import { ResourceName } from "farmbot";
 import { Dictionary } from "farmbot/dist";
 import { betterCompact } from "../util";
-import * as _ from "lodash";
+import _ from "lodash";
 import { ResourceIndex } from "./interfaces";
 import { joinKindAndId } from "./reducer_support";
 

frontend/sequences/locals_list/location_form_list.ts

@@ -7,7 +7,7 @@ import { betterCompact } from "../../util";
 import { TaggedTool, TaggedPoint } from "farmbot";
 import { DropDownItem } from "../../ui";
 import { Vector3 } from "farmbot/dist";
-import * as _ from "lodash";
+import _ from "lodash";
 import { t } from "i18next";
 import { capitalize } from "lodash";
 import { joinKindAndId } from "../../resources/reducer_support";

frontend/sequences/step_tiles/index.tsx

@@ -16,7 +16,7 @@ import { TileSendMessage } from "./tile_send_message";
 import { TileWritePin } from "./tile_write_pin";
 import { TileExecuteScript } from "./tile_execute_script";
 import { TileTakePhoto } from "./tile_take_photo";
-import * as _ from "lodash";
+import _ from "lodash";
 import { overwrite } from "../../api/crud";
 import { TileFindHome } from "./tile_find_home";
 import { t } from "i18next";

frontend/sequences/step_tiles/tile_execute.tsx

@@ -1,4 +1,4 @@
-import * as _ from "lodash";
+import _ from "lodash";
 import * as React from "react";
 import { StepParams } from "../interfaces";
 import { t } from "i18next";

frontend/sequences/step_tiles/tile_if/if.tsx

@@ -1,4 +1,4 @@
-import * as _ from "lodash";
+import _ from "lodash";
 import * as React from "react";
 import { IfParams, LHSOptions, operatorOptions } from "./index";
 import { t } from "i18next";

frontend/sequences/step_tiles/tile_if/index.tsx

@@ -1,4 +1,4 @@
-import * as _ from "lodash";
+import _ from "lodash";
 import * as React from "react";
 import { t } from "i18next";
 import { DropDownItem, NULL_CHOICE } from "../../../ui/index";

frontend/sequences/step_tiles/tile_move_absolute.tsx

@@ -1,4 +1,4 @@
-import * as _ from "lodash";
+import _ from "lodash";
 import * as React from "react";
 import { t } from "i18next";
 import { Component } from "react";

frontend/sequences/step_tiles/tile_pin_support.tsx

@@ -1,6 +1,6 @@
 import { t } from "i18next";
 import { editStep } from "../../api/crud";
-import * as _ from "lodash";
+import _ from "lodash";
 import { WritePin, SequenceBodyItem } from "farmbot";
 import { DropDownItem } from "../../ui/index";
 import { StepParams } from "../interfaces";

frontend/sequences/step_tiles/tile_send_message.tsx

@@ -3,7 +3,7 @@ import { FBSelect, DropDownItem, Row, Col } from "../../ui/index";
 import { t } from "i18next";
 import { StepInputBox } from "../inputs/step_input_box";
 import { SendMessage, TaggedSequence } from "farmbot";
-import * as _ from "lodash";
+import _ from "lodash";
 import { StepParams, ChannelName } from "../interfaces";
 import { ResourceIndex } from "../../resources/interfaces";
 import { editStep } from "../../api/crud";

frontend/sync/actions.ts

@@ -36,10 +36,11 @@ export const newTaggedResource = <T extends TR>(kind: T["kind"],
   });
 };
 
-console.log("TADA!");
+console.log("Yes, HMR works on refresh");
 
 function fail(e: Error) {
-  // Session.clear();
+  console.log("WEE OOO");
+  Session.clear();
   throw e;
 }
 

frontend/tools/state_to_props.ts

@@ -1,6 +1,6 @@
 import { Everything } from "../interfaces";
 import { Props } from "./interfaces";
-import * as _ from "lodash";
+import _ from "lodash";
 import {
   selectAllToolSlotPointers,
   selectAllTools,

frontend/util/errors.ts

@@ -1,6 +1,6 @@
 import { Dictionary } from "farmbot";
 import { t } from "i18next";
-import * as _ from "lodash";
+import _ from "lodash";
 import { Content } from "../constants";
 
 export interface AxiosErrorResponse {

frontend/util/integer_clamp.ts

@@ -1,4 +1,4 @@
-import * as _ from "lodash";
+import _ from "lodash";
 import { parseIntInput } from "./util";
 
 /** The firmware will have an integer overflow if you don't check this one. */

frontend/util/util.ts

@@ -1,5 +1,5 @@
 import { t } from "i18next";
-import * as _ from "lodash";
+import _ from "lodash";
 import { ResourceColor } from "../interfaces";
 import { box } from "boxed_value";
 import {

lib/tasks/api.rake

@@ -66,9 +66,9 @@ namespace :api do
       assets,
       "--out-dir public/dist",
       "--public-url /dist",
-      "--no-hmr",
-      # "--hmr-hostname #{ENV.fetch("API_HOST")}",
-      # "--hmr-port 3808",
+      # "--no-hmr",
+      "--hmr-hostname #{ENV.fetch("API_HOST")}",
+      "--hmr-port 3808",
       # https://github.com/parcel-bundler/parcel/issues/2599#issuecomment-459131481
       # https://github.com/parcel-bundler/parcel/issues/2607
       "--no-source-maps",