import React from 'react';
import { Button } from '@pisell/materials';
import { ArrowLeftOutlined } from '@ant-design/icons';
var ConnectDeviceModalHeader = function ConnectDeviceModalHeader(_ref) {
  var mode = _ref.mode,
    step = _ref.step,
    currentDevice = _ref.currentDevice,
    currentIsSmart = _ref.currentIsSmart,
    isBuildIn = _ref.isBuildIn,
    getText = _ref.getText,
    translation = _ref.translation,
    onBack = _ref.onBack;
  var deviceName = translation(currentDevice.name) || String(currentDevice.id);
  var title = mode === 'edit' ? getText('pisell2.saas.device-planning.connect.edit-title').replace('{DeviceName}', deviceName) : mode === 'new' ? getText(isBuildIn ? 'pisell2.saas.device-planning.connect.add-new-build-in-title' : 'pisell2.saas.device-planning.connect.add-new-title').replace('{DeviceName}', deviceName) : currentIsSmart ? getText('pisell2.saas.device-planning.connect.existing-peripheral-title').replace('{DeviceName}', deviceName) : getText('pisell2.saas.device-planning.connect.existing-smart-title').replace('{DeviceName}', deviceName);
  return /*#__PURE__*/React.createElement("div", {
    className: "device-detail-drawer__connect-modal-title"
  }, step === 'config' && mode !== 'edit' ? /*#__PURE__*/React.createElement(Button, {
    type: "text",
    icon: /*#__PURE__*/React.createElement(ArrowLeftOutlined, null),
    onClick: onBack
  }) : null, /*#__PURE__*/React.createElement("span", null, title));
};
export default ConnectDeviceModalHeader;