import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";

var _templateObject;

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

import _regeneratorRuntime from "@babel/runtime/regenerator";
import React, { useState } from "react";
import Checkbox from "../next/Checkbox";
import styled from "../styles/styled";

function SubAccount(_ref) {
  var subAccount = _ref.subAccount,
      parentId = _ref.parentId,
      onLink = _ref.onLink,
      onSelect = _ref.onSelect,
      channel = _ref.channel;
  var name = subAccount.name,
      switchActive = subAccount.switchActive;

  var _useState = useState(false),
      _useState2 = _slicedToArray(_useState, 2),
      isLoading = _useState2[0],
      setIsLoading = _useState2[1];

  var handleClick = /*#__PURE__*/function () {
    var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
      return _regeneratorRuntime.wrap(function _callee$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              setIsLoading(true);
              _context.prev = 1;
              _context.next = 4;
              return onLink(subAccount);

            case 4:
              _context.prev = 4;
              setIsLoading(false);
              return _context.finish(4);

            case 7:
            case "end":
              return _context.stop();
          }
        }
      }, _callee, null, [[1,, 4, 7]]);
    }));

    return function handleClick() {
      return _ref2.apply(this, arguments);
    };
  }();

  return /*#__PURE__*/React.createElement(Root, null, /*#__PURE__*/React.createElement(StyledCheckbox, {
    checked: switchActive,
    onChange: function onChange() {
      return onSelect(_objectSpread(_objectSpread({}, subAccount), {}, {
        active: !switchActive,
        parentId: parentId,
        channel: channel
      }));
    }
  }, name));
}

var Root = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: grid;\n  align-items: center;\n  margin-left: ", ";\n  gap: 8px;\n"])), function (props) {
  return props.theme.spaces["3xl"];
});
var StyledCheckbox = styled(Checkbox)(function (_ref3) {
  var theme = _ref3.theme;
  return _objectSpread(_objectSpread({}, theme.typography.variants.inputText), {}, {
    overflow: "hidden",
    color: theme.colors.neutral[500],
    "&:has(input:checked)": {
      color: theme.colors.neutral[800]
    },
    "& > span:last-child": {
      whiteSpace: "nowrap",
      overflow: "hidden",
      textOverflow: "ellipsis"
    }
  });
});
export default SubAccount;