// import _ from "lodash";
import React, { Component } from "react";
import { triggerHook } from "@sc/plugins";
import ItemDrawerTabContent from "@sc/modules/campaign/AdvancedBuilder/ItemDrawerTabContent";

export default class DestinationNodesDrawer extends Component {
  constructor(props) {
    super(props);

    this.state = {
      activeTab: "Common",
      objects: [],
    };

    this.setActiveTab = this.setActiveTab.bind(this);
  }

  getObjects(activeTab) {
    return triggerHook("onListItems", {
      id: "DestinationObjects",
      activeTab,
    });
  }

  componentDidMount() {
    this.setState({
      objects: this.getObjects("Common"),
    });
  }

  setActiveTab(activeTab) {
    this.setState(
      {
        objects: [],
      },
      () => {
        this.setState({
          activeTab,
          objects: this.getObjects(activeTab),
        });
      }
    );
  }

  render() {
    const { activeTab, objects } = this.state;

    return (
      <ItemDrawerTabContent
        {...this.props}
        title="Destinations"
        objects={objects}
        hint="Click on a destination<br/>and drag it to the canvas"
        tabs={[
          "Common",
          ...triggerHook("onListItems", { id: "DestinationNodesDrawerTabs" }),
        ]}
        setActiveTab={this.setActiveTab}
        activeTab={activeTab}
      />
    );
  }
}