108 lines
3.6 KiB
TypeScript
108 lines
3.6 KiB
TypeScript
import React from "react";
|
|
import { connect } from "react-redux";
|
|
import {
|
|
DesignerPanel, DesignerPanelContent, DesignerPanelHeader
|
|
} from "../designer_panel";
|
|
import { Everything } from "../../interfaces";
|
|
import { t } from "../../i18next_wrapper";
|
|
import { SaveBtn } from "../../ui";
|
|
import { SpecialStatus, TaggedTool, TaggedToolSlotPointer } from "farmbot";
|
|
import { init, save, edit, destroy } from "../../api/crud";
|
|
import { Panel } from "../panel_header";
|
|
import { ToolPulloutDirection } from "farmbot/dist/resources/api_resources";
|
|
import {
|
|
selectAllTools, maybeFindToolById, maybeGetToolSlot
|
|
} from "../../resources/selectors";
|
|
import { BotPosition } from "../../devices/interfaces";
|
|
import { validBotLocationData } from "../../util";
|
|
import { history } from "../../history";
|
|
import { SlotEditRows } from "./tool_slot_edit_components";
|
|
import { UUID } from "../../resources/interfaces";
|
|
|
|
export interface AddToolSlotProps {
|
|
tools: TaggedTool[];
|
|
dispatch: Function;
|
|
botPosition: BotPosition;
|
|
findTool(id: number): TaggedTool | undefined;
|
|
findToolSlot(uuid: UUID | undefined): TaggedToolSlotPointer | undefined;
|
|
}
|
|
|
|
export interface AddToolSlotState {
|
|
uuid: UUID | undefined;
|
|
}
|
|
|
|
export const mapStateToProps = (props: Everything): AddToolSlotProps => ({
|
|
tools: selectAllTools(props.resources.index),
|
|
dispatch: props.dispatch,
|
|
botPosition: validBotLocationData(props.bot.hardware.location_data).position,
|
|
findTool: (id: number) => maybeFindToolById(props.resources.index, id),
|
|
findToolSlot: (uuid: UUID | undefined) =>
|
|
maybeGetToolSlot(props.resources.index, uuid),
|
|
});
|
|
|
|
export class RawAddToolSlot
|
|
extends React.Component<AddToolSlotProps, AddToolSlotState> {
|
|
state: AddToolSlotState = { uuid: undefined };
|
|
|
|
componentDidMount() {
|
|
const action = init("Point", {
|
|
pointer_type: "ToolSlot", name: "Tool Slot", radius: 0, meta: {},
|
|
x: 0, y: 0, z: 0, tool_id: undefined,
|
|
pullout_direction: ToolPulloutDirection.NONE, gantry_mounted: false
|
|
});
|
|
this.setState({ uuid: action.payload.uuid });
|
|
this.props.dispatch(action);
|
|
}
|
|
|
|
componentWillUnmount() {
|
|
if (this.state.uuid && this.toolSlot
|
|
&& this.toolSlot.specialStatus == SpecialStatus.DIRTY) {
|
|
confirm(t("Save new tool?"))
|
|
? this.props.dispatch(save(this.state.uuid))
|
|
: this.props.dispatch(destroy(this.state.uuid, true));
|
|
}
|
|
}
|
|
|
|
get toolSlot() {
|
|
return this.props.findToolSlot(this.state.uuid);
|
|
}
|
|
|
|
get tool() {
|
|
return this.toolSlot ?
|
|
this.props.findTool(this.toolSlot.body.tool_id || 0) : undefined;
|
|
}
|
|
|
|
updateSlot = (toolSlot: TaggedToolSlotPointer) =>
|
|
(update: Partial<TaggedToolSlotPointer["body"]>) =>
|
|
this.props.dispatch(edit(toolSlot, update));
|
|
|
|
save = () => {
|
|
this.state.uuid && this.props.dispatch(save(this.state.uuid));
|
|
history.push("/app/designer/tools");
|
|
}
|
|
|
|
render() {
|
|
const panelName = "add-tool-slot";
|
|
return <DesignerPanel panelName={panelName} panel={Panel.Tools}>
|
|
<DesignerPanelHeader
|
|
panelName={panelName}
|
|
title={t("Add new tool slot")}
|
|
backTo={"/app/designer/tools"}
|
|
panel={Panel.Tools} />
|
|
<DesignerPanelContent panelName={panelName}>
|
|
{this.toolSlot
|
|
? <SlotEditRows
|
|
toolSlot={this.toolSlot}
|
|
tools={this.props.tools}
|
|
tool={this.tool}
|
|
botPosition={this.props.botPosition}
|
|
updateToolSlot={this.updateSlot(this.toolSlot)} />
|
|
: "initializing"}
|
|
<SaveBtn onClick={this.save} status={SpecialStatus.DIRTY} />
|
|
</DesignerPanelContent>
|
|
</DesignerPanel>;
|
|
}
|
|
}
|
|
|
|
export const AddToolSlot = connect(mapStateToProps)(RawAddToolSlot);
|