FarmBot/Farmbot-Web-App

File index.tsx has 280 lines of code (exceeds 250 allowed). Consider refactoring.

Open

import React from "react";
import { connect } from "react-redux";
import {
  DesignerPanel, DesignerPanelTop, DesignerPanelContent,
} from "../farm_designer/designer_panel";

Function render has 53 lines of code (exceeds 25 allowed). Consider refactoring.

Open

  render() {
    const panelName = "tools";
    const hasTools = this.props.tools.length > 0;
    const toolSlotGroups = pointGroupSubset(this.props.groups, "ToolSlot");
    const filteredGroups = toolSlotGroups

Function ToolSlotInventoryItem has 51 lines of code (exceeds 25 allowed). Consider refactoring.

Open

export const ToolSlotInventoryItem = (props: ToolSlotInventoryItemProps) => {
  const { x, y, z, id, tool_id, gantry_mounted } = props.toolSlot.body;
  const toolName = props.tools
    .filter(tool => tool.body.id == tool_id)[0]?.body.name;
  return <div

Similar blocks of code found in 2 locations. Consider refactoring.

Open

      <div className="tools-header">
        <label>{this.strings.tools}</label>
        <Link to={Path.tools("add")}>
          <div className={`fb-button panel-${TAB_COLOR[Panel.Tools]} add-tool-btn`}>
            <i className="fa fa-plus" title={this.strings.titleText} />

• Read up
  Read up

Similar blocks of code found in 2 locations. Consider refactoring.

Open

      <div className="tool-slots-header">
        <label>{this.strings.toolSlots}</label>
        <Link to={Path.toolSlots("add")}>
          <div className={`fb-button panel-${TAB_COLOR[Panel.Tools]}`}>
            <i className="fa fa-plus" title={this.strings.addSlot} />

• Read up
  Read up

Similar blocks of code found in 2 locations. Consider refactoring.

Open

            <PanelSection isOpen={this.state.groups} panel={Panel.Tools}
              toggleOpen={this.toggleOpen("groups")}
              itemCount={toolSlotGroups.length}
              addNew={() => this.props.dispatch(createGroup({
                criteria: {

• Read up
  Read up

Similar blocks of code found in 2 locations. Consider refactoring.

Open

        onChange={({ tool_id }) => {
          this.props.dispatch(edit(this.props.device,
            { mounted_tool_id: tool_id }));
          this.props.dispatch(save(this.props.device.uuid));
        }}

• Read up
  Read up

Similar blocks of code found in 6 locations. Consider refactoring.

Open

    const filteredGroups = toolSlotGroups
      .filter(p => p.body.name.toLowerCase()
        .includes(this.state.searchTerm.toLowerCase()));

• Read up
  Read up

Similar blocks of code found in 5 locations. Consider refactoring.

Open

  toggleOpen = (category: keyof ToolsState) => () =>
    this.setState({ ...this.state, [category]: !this.state[category] });

• Read up
  Read up

Similar blocks of code found in 2 locations. Consider refactoring.

Open

              addNew={() => this.props.dispatch(createGroup({
                criteria: {
                  ...DEFAULT_CRITERIA,
                  string_eq: { pointer_type: ["ToolSlot"] },
                },

• Read up
  Read up