import React from 'react';
import styled from 'styled-components';
import {
  TextButton,
  SettingsTabButton,
} from '../../../components/common/buttons/PrimaryBtn';
export const ModalTabs = ({ active, setActiveTab }) => {
  return /*#__PURE__*/ React.createElement(
    TabWrapper,
    {
      className: 'd-flx-alc px-4',
    },
    /*#__PURE__*/ React.createElement(SettingsTabButton, {
      title: 'General',
      onclick: () => setActiveTab('general'),
      className: active === 'general' ? 'active' : '',
    }),
    /*#__PURE__*/ React.createElement(SettingsTabButton, {
      title: 'Notification',
      onclick: () => setActiveTab('notification'),
      className: active === 'notification' ? 'active' : '',
    }),
    /*#__PURE__*/ React.createElement(SettingsTabButton, {
      title: 'Responses',
      onclick: () => setActiveTab('responses'),
      className: active === 'responses' ? 'active' : '',
    })
  );
};
export const AgentsTabs = ({ actions, agentTabControl }) => {
  return /*#__PURE__*/ React.createElement(
    TabWrapper,
    {
      className: 'd-flx-alc alt',
    },
    /*#__PURE__*/ React.createElement(TextButton, {
      title: 'Agent list',
      className: agentTabControl ? 'active' : '',
      onclick: actions,
    }),
    /*#__PURE__*/ React.createElement(TextButton, {
      title: 'Agent groups',
      className: !agentTabControl ? 'active' : '',
      onclick: actions,
    })
  );
};
export const AgentsModalTabs = ({ actions, agentTabControl }) => {
  return /*#__PURE__*/ React.createElement(
    TabWrapper,
    {
      className: 'd-flx-alc alt',
    },
    /*#__PURE__*/ React.createElement(TextButton, {
      title: 'All Agent',
      className: agentTabControl ? 'active' : '',
      onclick: actions,
    }),
    /*#__PURE__*/ React.createElement(TextButton, {
      title: 'Agent groups',
      className: !agentTabControl ? 'active' : '',
      onclick: actions,
    })
  );
};
const TabWrapper = styled.div`
  border: 1px solid #e8edff;
  &.alt {
    border: none;
  }
`;
