diff --git a/webpack/farm_designer/plants/__tests__/plant_panel_test.tsx b/webpack/farm_designer/plants/__tests__/plant_panel_test.tsx index 502049c1d..e57d73baa 100644 --- a/webpack/farm_designer/plants/__tests__/plant_panel_test.tsx +++ b/webpack/farm_designer/plants/__tests__/plant_panel_test.tsx @@ -4,7 +4,7 @@ import * as React from "react"; import { PlantPanel, PlantPanelProps, EditPlantStatus, EditPlantStatusProps } from "../plant_panel"; -import { shallow } from "enzyme"; +import { shallow, mount } from "enzyme"; import { FormattedPlantInfo } from "../map_state_to_props"; import { Actions } from "../../../constants"; import { clickButton } from "../../../__test_support__/helpers"; @@ -34,7 +34,7 @@ describe("", () => { it("renders: editing", () => { const p = fakeProps(); - const wrapper = shallow(); + const wrapper = mount(); const txt = wrapper.text().toLowerCase(); expect(txt).toContain("1 days old"); expect(txt).toContain("(10, 30)"); @@ -48,7 +48,7 @@ describe("", () => { }); it("renders", () => { - const wrapper = shallow(); + const wrapper = mount(); const txt = wrapper.text().toLowerCase(); expect(txt).toContain("1 days old"); expect(txt).toContain("(12, 34)"); diff --git a/webpack/farm_designer/plants/plant_panel.tsx b/webpack/farm_designer/plants/plant_panel.tsx index 6e2c5f818..09320082c 100644 --- a/webpack/farm_designer/plants/plant_panel.tsx +++ b/webpack/farm_designer/plants/plant_panel.tsx @@ -64,6 +64,16 @@ export function EditPlantStatus(props: EditPlantStatusProps) { }} />; } +const ListItem = (props: { name: string, children: React.ReactChild }) => +
  • + + {props.name}:  + + + {props.children} + +
  • ; + export function PlantPanel(props: PlantPanelProps) { const { info, onDestroy, updatePlant, dispatch } = props; const { name, slug, plantedAt, daysOld, uuid, plantStatus } = info; @@ -75,62 +85,32 @@ export function PlantPanel(props: PlantPanelProps) { {t("Plant Info")}
      -
    • - - {t("Full Name")}:  - - - {_.startCase(name)} - -
    • -
    • - - {t("Plant Type")}:  - - - - {_.startCase(slug)} - - -
    • -
    • - - {t("Started")}:  - - - {plantedAt} - -
    • -
    • - - {t("Age")}:  - - - {daysOld} {t("days old")} - -
    • -
    • - - {t("Location")}:  - - - ({x}, {y}) - -
    • -
    • - - {t("Status")}:  - - - {updatePlant - ? - : plantStatus} - -
    • + + {_.startCase(name)} + + + + {_.startCase(slug)} + + + + {plantedAt} + + + {`${daysOld} ${t("days old")}`} + + + {`(${x}, ${y})`} + + + {updatePlant + ? + : plantStatus} +