@zohodesk/dot/es/v1/list/DepartmentDropDown/DepartmentDropDown.js

In this Library, we Provide Some Basic Components to Build Your Application

import React from 'react';
import { defaultProps } from "./props/defaultProps";
import { propTypes } from "./props/propTypes";
import ToggleDropDown from "../../dropdown/ToggleDropDown/ToggleDropDown";
import { DepartmentText } from "../SecondaryText";
import style from "../../../list/DepartmentDropDown/DepartmentDropDown.module.css";

function DepartmentDropDown(props) {
  let {
    departmentName,
    departmentList = [],
    onSelectLabel,
    isEditable,
    dataId,
    isFetching,
    isPopupActive,
    getNextOptions,
    isNextOptions,
    onSearch,
    needSearchFetching,
    searchStr,
    i18nKeys,
    onMoveDepartment,
    getDepartment
  } = props;
  let {
    title = 'Move Department',
    searchEmptyText = 'No results found',
    searchErrorText = 'No results',
    placeholder = 'Search Department'
  } = i18nKeys;

  function onClick(e) {
    if (getDepartment) {
      getDepartment(e);
    }

    onSearch('');
  }

  function handleMoveDepartment(deptId) {
    onSearch('');
    onMoveDepartment(deptId);
  }

  return /*#__PURE__*/React.createElement(ToggleDropDown, {
    title: title,
    options: departmentList,
    value: /*#__PURE__*/React.createElement(DepartmentText, {
      text: departmentName,
      dataTitle: departmentName
    }),
    keyName: "name",
    idName: "id",
    onClick: handleMoveDepartment,
    isArrow: false,
    isEditable: isEditable,
    onSelectLabel: onSelectLabel,
    isPopupActive: isPopupActive,
    needExternalPopupState: true,
    isSearch: departmentList.length > 5 || searchStr.length !== 0,
    boxSize: "small",
    dataId: dataId,
    isDataLoaded: !isFetching,
    isPadding: false,
    searchErrorText: searchErrorText,
    searchEmptyHint: searchEmptyText,
    isNeedEffect: false,
    className: style.departmentBox,
    placeHolderText: placeholder,
    getNextOptions: getNextOptions,
    isNextOptions: isNextOptions,
    onSearch: onSearch,
    needSearchFetching: needSearchFetching
  });
}

DepartmentDropDown.defaultProps = defaultProps;
DepartmentDropDown.propTypes = propTypes;
export default DepartmentDropDown; // if (__DOCS__) {
//   DepartmentDropDown.docs = {
//     folderName: 'List',
//     componentGroup: 'DepartmentDropDown'
//   };
// }