close plant info on grid click
parent
3d158de77d
commit
27da925655
|
@ -38,6 +38,10 @@
|
|||
overflow: visible;
|
||||
}
|
||||
|
||||
.drop-area-background a {
|
||||
cursor: default !important;
|
||||
}
|
||||
|
||||
.crop-drag-info-image {
|
||||
width: 100%;
|
||||
background-color: $translucent;
|
||||
|
|
|
@ -1,14 +1,31 @@
|
|||
const mockHistory = jest.fn();
|
||||
jest.mock("../../../history", () => ({
|
||||
history: {
|
||||
push: mockHistory,
|
||||
getCurrentLocation: jest.fn()
|
||||
.mockImplementationOnce(() => { return { pathname: "//app/plants" } })
|
||||
.mockImplementationOnce(() => { return { pathname: "//app/plants/1/edit" } })
|
||||
.mockImplementationOnce(() => { return { pathname: "//app/plants/1" } })
|
||||
}
|
||||
}));
|
||||
|
||||
|
||||
import * as React from "react";
|
||||
import { Grid } from "../grid";
|
||||
import { shallow } from "enzyme";
|
||||
import { GridProps } from "../interfaces";
|
||||
|
||||
describe("<Grid/>", () => {
|
||||
beforeEach(function () {
|
||||
jest.clearAllMocks();
|
||||
});
|
||||
|
||||
function fakeProps(): GridProps {
|
||||
return {
|
||||
mapTransformProps: {
|
||||
quadrant: 2, gridSize: { x: 3000, y: 1500 }
|
||||
}
|
||||
},
|
||||
dispatch: jest.fn()
|
||||
};
|
||||
}
|
||||
|
||||
|
@ -21,4 +38,21 @@ describe("<Grid/>", () => {
|
|||
expect(wrapper.find("#axis-values").find("text").length).toEqual(43);
|
||||
});
|
||||
|
||||
it("closes plant info", () => {
|
||||
const p = fakeProps();
|
||||
const wrapper = shallow(<Grid {...p } />);
|
||||
const gridArea = wrapper.find("g").first();
|
||||
gridArea.simulate("click") // no plant info open
|
||||
expect(mockHistory).not.toHaveBeenCalled();
|
||||
expect(p.dispatch).not.toHaveBeenCalled();
|
||||
gridArea.simulate("click") // plant edit open
|
||||
expect(mockHistory).not.toHaveBeenCalled();
|
||||
expect(p.dispatch).not.toHaveBeenCalled();
|
||||
gridArea.simulate("click") // plant info open
|
||||
expect(mockHistory).toHaveBeenCalledWith("/app/designer/plants");
|
||||
expect(p.dispatch).toHaveBeenCalledWith({
|
||||
payload: undefined, type: "SELECT_PLANT"
|
||||
});
|
||||
});
|
||||
|
||||
});
|
||||
|
|
|
@ -247,7 +247,8 @@ export class GardenMap extends
|
|||
onMouseMove={this.drag}
|
||||
onClick={this.click}>
|
||||
<Grid
|
||||
mapTransformProps={mapTransformProps} />
|
||||
mapTransformProps={mapTransformProps}
|
||||
dispatch={this.props.dispatch} />
|
||||
<SpreadLayer
|
||||
mapTransformProps={mapTransformProps}
|
||||
plants={this.props.plants}
|
||||
|
|
|
@ -2,14 +2,24 @@ import * as React from "react";
|
|||
import { GridProps } from "./interfaces";
|
||||
import { getXYFromQuadrant } from "./util";
|
||||
import * as _ from "lodash";
|
||||
import { history } from "../../history";
|
||||
|
||||
export function Grid(props: GridProps) {
|
||||
function closePlantInfo() {
|
||||
const currentPath = history.getCurrentLocation().pathname;
|
||||
if (!isNaN(parseInt(currentPath.split("/").slice(-1)[0]))) {
|
||||
// A plant is selected and plant info is open. Unselect and close it.
|
||||
props.dispatch({ type: "SELECT_PLANT", payload: undefined });
|
||||
history.push("/app/designer/plants")
|
||||
}
|
||||
}
|
||||
|
||||
const { quadrant, gridSize } = props.mapTransformProps;
|
||||
const origin = getXYFromQuadrant(0, 0, quadrant, gridSize);
|
||||
const arrowEnd = getXYFromQuadrant(25, 25, quadrant, gridSize);
|
||||
const xLabel = getXYFromQuadrant(15, -10, quadrant, gridSize);
|
||||
const yLabel = getXYFromQuadrant(-11, 18, quadrant, gridSize);
|
||||
return <g id="drop-area-background">
|
||||
return <g className="drop-area-background" onClick={closePlantInfo}>
|
||||
<defs>
|
||||
<pattern id="minor_grid" width={10} height={10} patternUnits="userSpaceOnUse">
|
||||
<path d="M10,0 L0,0 L0,10" strokeWidth={1}
|
||||
|
|
|
@ -87,6 +87,7 @@ export interface MapBackgroundProps {
|
|||
|
||||
export interface GridProps {
|
||||
mapTransformProps: MapTransformProps;
|
||||
dispatch: Function;
|
||||
}
|
||||
|
||||
export interface VirtualFarmBotProps {
|
||||
|
|
Loading…
Reference in New Issue