@bigbinary/neeto-molecules 3.0.3 → 3.1.0

package/dist/cjs/index-39618d80.js

@@ -0,0 +1,628 @@
+'use strict';
+
+var React = require('react');
+var reactUtils = require('@bigbinary/neeto-commons-frontend/react-utils');
+var Alert = require('@bigbinary/neetoui/Alert');
+var reactI18next = require('react-i18next');
+var Pane = require('@bigbinary/neetoui/Pane');
+var neetoCist = require('@bigbinary/neeto-cist');
+var Typography = require('@bigbinary/neetoui/Typography');
+var ActionBlock = require('@bigbinary/neetoui/formik/ActionBlock');
+var Input = require('@bigbinary/neetoui/formik/Input');
+var Form = require('@bigbinary/neetoui/formik/Form');
+var i18next = require('i18next');
+var yup = require('yup');
+var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var reactQuery = require('@tanstack/react-query');
+var useMutationWithInvalidation = require('@bigbinary/neeto-commons-frontend/react-utils/useMutationWithInvalidation');
+var axios = require('axios');
+var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
+var Table = require('@bigbinary/neetoui/Table');
+var Button = require('@bigbinary/neetoui/Button');
+var Checkbox = require('@bigbinary/neetoui/Checkbox');
+var Callout = require('@bigbinary/neetoui/Callout');
+var TableWrapper = require('./TableWrapper.js');
+var Input$1 = require('@bigbinary/neetoui/Input');
+var Stepper = require('@bigbinary/neetoui/Stepper');
+var Tag = require('@bigbinary/neetoui/Tag');
+var CopyToClipboardButton = require('./CopyToClipboardButton.js');
+var Toastr = require('@bigbinary/neetoui/Toastr');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var Alert__default = /*#__PURE__*/_interopDefaultLegacy(Alert);
+var Pane__default = /*#__PURE__*/_interopDefaultLegacy(Pane);
+var Typography__default = /*#__PURE__*/_interopDefaultLegacy(Typography);
+var ActionBlock__default = /*#__PURE__*/_interopDefaultLegacy(ActionBlock);
+var Input__default = /*#__PURE__*/_interopDefaultLegacy(Input);
+var Form__default = /*#__PURE__*/_interopDefaultLegacy(Form);
+var yup__namespace = /*#__PURE__*/_interopNamespace(yup);
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var useMutationWithInvalidation__default = /*#__PURE__*/_interopDefaultLegacy(useMutationWithInvalidation);
+var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
+var _slicedToArray__default = /*#__PURE__*/_interopDefaultLegacy(_slicedToArray);
+var Table__default = /*#__PURE__*/_interopDefaultLegacy(Table);
+var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
+var Checkbox__default = /*#__PURE__*/_interopDefaultLegacy(Checkbox);
+var Callout__default = /*#__PURE__*/_interopDefaultLegacy(Callout);
+var Input__default$1 = /*#__PURE__*/_interopDefaultLegacy(Input$1);
+var Stepper__default = /*#__PURE__*/_interopDefaultLegacy(Stepper);
+var Tag__default = /*#__PURE__*/_interopDefaultLegacy(Tag);
+var Toastr__default = /*#__PURE__*/_interopDefaultLegacy(Toastr);
+
+var DeleteAlert = reactUtils.withT(function (_ref) {
+  var t = _ref.t,
+    onClose = _ref.onClose,
+    onSubmit = _ref.onSubmit,
+    isOpen = _ref.isOpen,
+    isSubmitting = _ref.isSubmitting,
+    hostname = _ref.hostname;
+  return /*#__PURE__*/React__default["default"].createElement(Alert__default["default"], {
+    isOpen: isOpen,
+    isSubmitting: isSubmitting,
+    onClose: onClose,
+    onSubmit: onSubmit,
+    cancelButtonLabel: t("neetoMolecules.common.actions.cancel"),
+    submitButtonLabel: t("neetoMolecules.common.actions.delete"),
+    title: t("neetoMolecules.customDomain.delete"),
+    message: /*#__PURE__*/React__default["default"].createElement(reactI18next.Trans, {
+      i18nKey: "neetoMolecules.customDomain.alertMessage",
+      values: {
+        hostname: hostname
+      }
+    })
+  });
+});
+
+var HOSTNAME_REGEX = /^(https?:\/\/)?([a-zA-Z0-9][a-zA-Z0-9-]*\.)+[a-zA-Z]{2,}(\/\S*)?$/;
+var INITIAL_VALUES = {
+  hostname: ""
+};
+var STATUS_INDEX = ["pending_domain_validation", "pending_cname_validation", "active"];
+var DOMAIN_VALIDATION_STATUS = "pending_domain_validation";
+var STEPS = [{
+  id: 1,
+  label: "Domain validation"
+}, {
+  id: 2,
+  label: "Domain redirection"
+}];
+
+var getCustomDomainValidationSchema = function getCustomDomainValidationSchema() {
+  return yup__namespace.object().shape({
+    hostname: yup__namespace.string().required(i18next.t("neetoMolecules.customDomain.formikValidation.required")).matches(HOSTNAME_REGEX, i18next.t("neetoMolecules.customDomain.formikValidation.valid"))
+  });
+};
+
+var getUrlwithId = function getUrlwithId(url, id) {
+  return id ? "".concat(url, "/").concat(id) : url;
+};
+var fetchCustomDomains = function fetchCustomDomains(_ref) {
+  var url = _ref.url,
+    params = _ref.params;
+  return axios__default["default"].get(url, {
+    params: params
+  });
+};
+var updateCustomDomain = function updateCustomDomain(url, id) {
+  return axios__default["default"].patch(getUrlwithId(url, id));
+};
+var createCustomDomain = function createCustomDomain(url, payload) {
+  return axios__default["default"].post(url, payload);
+};
+var deleteCustomDomain = function deleteCustomDomain(url, id) {
+  return axios__default["default"]["delete"](getUrlwithId(url, id));
+};
+var validateDomain = function validateDomain(url, id) {
+  return axios__default["default"].patch("".concat(getUrlwithId(url, id), "/validate_domain"), undefined, {
+    showToastr: false
+  });
+};
+var validateCname = function validateCname(url, id) {
+  return axios__default["default"].patch("".concat(getUrlwithId(url, id), "/validate_cname"));
+};
+var customDomainApi = {
+  createCustomDomain: createCustomDomain,
+  deleteCustomDomain: deleteCustomDomain,
+  validateDomain: validateDomain,
+  fetchCustomDomains: fetchCustomDomains,
+  validateCname: validateCname,
+  updateCustomDomain: updateCustomDomain
+};
+
+var DOMAIN_QUERY_KEY = "custom-domain";
+var HELP_DOC_URL = "https://help.".concat(globalProps.appName.toLowerCase(), ".com/articles/custom-domains");
+
+function ownKeys$1(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread$1(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys$1(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var useCreateCustomDomain = function useCreateCustomDomain(url) {
+  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return useMutationWithInvalidation__default["default"](function (payload) {
+    return customDomainApi.createCustomDomain(url, payload);
+  }, _objectSpread$1({
+    keysToInvalidate: [[DOMAIN_QUERY_KEY]]
+  }, options));
+};
+var useDeleteCustomDomain = function useDeleteCustomDomain(url) {
+  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return useMutationWithInvalidation__default["default"](function (id) {
+    return customDomainApi.deleteCustomDomain(url, id);
+  }, _objectSpread$1({
+    keysToInvalidate: [[DOMAIN_QUERY_KEY]]
+  }, options));
+};
+var useFetchCustomDomains = function useFetchCustomDomains(params) {
+  return reactQuery.useQuery({
+    queryKey: [DOMAIN_QUERY_KEY, _objectSpread$1({}, params)],
+    queryFn: function queryFn() {
+      return customDomainApi.fetchCustomDomains(params);
+    }
+  });
+};
+var useValidateDomain = function useValidateDomain(url) {
+  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return useMutationWithInvalidation__default["default"](function (id) {
+    return customDomainApi.validateDomain(url, id);
+  }, _objectSpread$1({
+    keysToInvalidate: [[DOMAIN_QUERY_KEY]]
+  }, options));
+};
+var useUpdateCustomDomain = function useUpdateCustomDomain(url) {
+  var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return useMutationWithInvalidation__default["default"](function (id) {
+    return customDomainApi.updateCustomDomain(url, id);
+  }, _objectSpread$1({
+    keysToInvalidate: [[DOMAIN_QUERY_KEY]]
+  }, options));
+};
+
+var DomainField = function DomainField(_ref) {
+  var customDomain = _ref.customDomain,
+    onCreate = _ref.onCreate,
+    url = _ref.url,
+    setCustomDomain = _ref.setCustomDomain,
+    onClose = _ref.onClose;
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var _useCreateCustomDomai = useCreateCustomDomain(url),
+    createCustomDomain = _useCreateCustomDomai.mutate,
+    isCreating = _useCreateCustomDomai.isPending;
+  var getHostname = function getHostname(url) {
+    try {
+      var parsedUrl = new URL(url);
+      return parsedUrl.hostname;
+    } catch (_unused) {
+      return url;
+    }
+  };
+  var handleSubmit = function handleSubmit(_ref2) {
+    var hostname = _ref2.hostname;
+    var parsedHostname = getHostname(hostname);
+    var payload = {
+      hostname: parsedHostname
+    };
+    createCustomDomain(payload, {
+      onSuccess: function onSuccess(values) {
+        setCustomDomain(values);
+        onCreate === null || onCreate === void 0 ? void 0 : onCreate(values);
+      }
+    });
+  };
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Pane__default["default"].Header, null, /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
+    style: "h2"
+  }, t("neetoMolecules.customDomain.addNew"))), /*#__PURE__*/React__default["default"].createElement(Form__default["default"], {
+    className: "flex-col space-y-6",
+    formikProps: {
+      enableReinitialize: true,
+      initialValues: customDomain || INITIAL_VALUES,
+      validationSchema: getCustomDomainValidationSchema(),
+      onSubmit: handleSubmit
+    }
+  }, function (_ref3) {
+    var dirty = _ref3.dirty;
+    return /*#__PURE__*/React__default["default"].createElement("div", {
+      className: "w-full"
+    }, /*#__PURE__*/React__default["default"].createElement(Pane__default["default"].Body, null, /*#__PURE__*/React__default["default"].createElement(Input__default["default"], {
+      required: true,
+      className: "w-full",
+      "data-cy": "custom-domain-input-field",
+      disabled: neetoCist.isNotEmpty(customDomain),
+      label: t("neetoMolecules.customDomain.label"),
+      name: "hostname",
+      placeholder: t("neetoMolecules.customDomain.placeholder")
+    })), /*#__PURE__*/React__default["default"].createElement(Pane__default["default"].Footer, null, /*#__PURE__*/React__default["default"].createElement(ActionBlock__default["default"], {
+      cancelButtonProps: {
+        onClick: onClose
+      },
+      isSubmitting: isCreating,
+      submitButtonProps: {
+        label: t("neetoMolecules.common.actions.continue"),
+        "data-cy": "submit-custom-domain-button",
+        "data-testid": "submit-custom-domain-button",
+        disabled: !dirty || isCreating
+      }
+    })));
+  }));
+};
+
+var Common = reactUtils.withT(function (_ref) {
+  var t = _ref.t,
+    currentStep = _ref.currentStep,
+    handleStepChange = _ref.handleStepChange,
+    hostname = _ref.hostname;
+  return /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "mb-6 w-full space-y-6"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "-ml-2"
+  }, /*#__PURE__*/React__default["default"].createElement(Stepper__default["default"], {
+    activeIndex: currentStep,
+    setActiveIndex: handleStepChange,
+    steps: STEPS
+  })), /*#__PURE__*/React__default["default"].createElement(Input__default$1["default"], {
+    disabled: true,
+    className: "w-full",
+    label: t("neetoMolecules.customDomain.yourDomain"),
+    unlimitedChars: false,
+    value: hostname
+  }));
+});
+
+var columnData = function columnData() {
+  return [{
+    title: i18next.t("neetoMolecules.common.record"),
+    key: "record",
+    dataIndex: "record",
+    width: 100,
+    render: function render() {
+      return /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
+        style: "body2"
+      }, i18next.t("neetoMolecules.customDomain.cname"));
+    }
+  }, {
+    title: i18next.t("neetoMolecules.common.name"),
+    dataIndex: "name",
+    key: "name",
+    width: 200,
+    render: function render(name, _) {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "flex items-center justify-between"
+      }, /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
+        style: "body2"
+      }, neetoCist.truncate(name, 15)), /*#__PURE__*/React__default["default"].createElement(CopyToClipboardButton, {
+        className: "flex-shrink-0",
+        size: "small",
+        style: "secondary",
+        value: name
+      }));
+    }
+  }, {
+    title: i18next.t("neetoMolecules.common.value"),
+    dataIndex: "value",
+    key: "value",
+    width: 200,
+    render: function render(value, _) {
+      return /*#__PURE__*/React__default["default"].createElement("div", {
+        className: "flex items-center justify-between"
+      }, /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
+        style: "body2"
+      }, neetoCist.truncate(value, 15)), /*#__PURE__*/React__default["default"].createElement(CopyToClipboardButton, {
+        value: value,
+        className: "flex-shrink-0",
+        size: "small",
+        style: "secondary"
+      }));
+    }
+  }, {
+    title: i18next.t("neetoMolecules.common.status"),
+    dataIndex: "status",
+    key: "status",
+    width: 130,
+    render: function render(status) {
+      return /*#__PURE__*/React__default["default"].createElement(Tag__default["default"], {
+        label: i18next.t("neetoMolecules.common.".concat(status)),
+        style: status === "success" ? "success" : "warning"
+      });
+    }
+  }];
+};
+
+var Redirection = function Redirection(_ref) {
+  var customDomain = _ref.customDomain,
+    onClose = _ref.onClose,
+    setCustomDomain = _ref.setCustomDomain,
+    url = _ref.url,
+    currentStep = _ref.currentStep,
+    handleStepChange = _ref.handleStepChange,
+    incrementStep = _ref.incrementStep,
+    hasOne = _ref.hasOne;
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var id = customDomain.id,
+    hostname = customDomain.hostname,
+    dnsTarget = customDomain.dnsTarget,
+    addedCnameAt = customDomain.addedCnameAt,
+    status = customDomain.status;
+  var cnameAdded = neetoCist.isPresent(addedCnameAt);
+  var customDomainId = hasOne ? null : id;
+  var _useState = React.useState(cnameAdded),
+    _useState2 = _slicedToArray__default["default"](_useState, 2),
+    addedRedirectionCname = _useState2[0],
+    setAddedRedirectionCname = _useState2[1];
+  var _useUpdateCustomDomai = useUpdateCustomDomain(url),
+    updateCustomDomain = _useUpdateCustomDomai.mutate,
+    isUpdating = _useUpdateCustomDomai.isPending;
+  var handleUpdateCname = function handleUpdateCname() {
+    addedRedirectionCname && updateCustomDomain(customDomainId, {
+      onSuccess: function onSuccess(data) {
+        incrementStep();
+        setCustomDomain(data);
+      }
+    });
+  };
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Pane__default["default"].Body, null, /*#__PURE__*/React__default["default"].createElement(Common, {
+    currentStep: currentStep,
+    handleStepChange: handleStepChange,
+    hostname: hostname
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "mb-6 w-full space-y-6"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "space-y-1"
+  }, /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
+    style: "h4"
+  }, t("neetoMolecules.customDomain.domainRedirection")), /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
+    style: "body2"
+  }, /*#__PURE__*/React__default["default"].createElement(reactI18next.Trans, {
+    i18nKey: "neetoMolecules.customDomain.cnameRecordInfo",
+    components: {
+      Link: /*#__PURE__*/React__default["default"].createElement("a", {
+        className: "neeto-ui-text-primary-800",
+        href: HELP_DOC_URL,
+        rel: "noreferrer",
+        target: "_blank"
+      })
+    }
+  }))), /*#__PURE__*/React__default["default"].createElement(TableWrapper, {
+    className: "pb-0"
+  }, /*#__PURE__*/React__default["default"].createElement(Table__default["default"], {
+    allowRowClick: false,
+    bordered: false,
+    columnData: columnData(),
+    rowSelection: false,
+    rowData: [{
+      name: hostname,
+      value: dnsTarget,
+      status: status === "active" ? "success" : "pending"
+    }]
+  })), /*#__PURE__*/React__default["default"].createElement(Checkbox__default["default"], {
+    checked: addedRedirectionCname,
+    "data-testid": "cname-added-custom-domain-checkbox",
+    disabled: cnameAdded,
+    label: t("neetoMolecules.customDomain.cnameAdded"),
+    onChange: function onChange() {
+      return setAddedRedirectionCname(function (value) {
+        return !value;
+      });
+    }
+  })), cnameAdded && /*#__PURE__*/React__default["default"].createElement(Callout__default["default"], {
+    style: "warning"
+  }, /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
+    style: "body2"
+  }, /*#__PURE__*/React__default["default"].createElement(reactI18next.Trans, {
+    i18nKey: "neetoMolecules.customDomain.domainRedirectionInfo",
+    values: {
+      hostname: hostname
+    },
+    components: {
+      Link: /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
+        href: HELP_DOC_URL,
+        rel: "noreferrer",
+        style: "link",
+        target: "_blank"
+      })
+    }
+  })))), /*#__PURE__*/React__default["default"].createElement(Pane__default["default"].Footer, null, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "flex items-center gap-2"
+  }, status !== "active" ? /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
+    disabled: isUpdating || !addedRedirectionCname,
+    label: t("neetoMolecules.common.actions.continue"),
+    loading: isUpdating,
+    onClick: handleUpdateCname
+  }) : /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
+    label: t("neetoMolecules.common.actions.done"),
+    onClick: onClose
+  }), /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
+    label: t("neetoMolecules.common.actions.cancel"),
+    style: "text",
+    onClick: onClose
+  }))));
+};
+
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty__default["default"](e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+var Validation = function Validation(_ref) {
+  var customDomain = _ref.customDomain,
+    onClose = _ref.onClose,
+    setCustomDomain = _ref.setCustomDomain,
+    url = _ref.url,
+    currentStep = _ref.currentStep,
+    handleStepChange = _ref.handleStepChange,
+    incrementStep = _ref.incrementStep,
+    hasOne = _ref.hasOne;
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var id = customDomain.id,
+    hostname = customDomain.hostname,
+    cnameValidationParams = customDomain.cnameValidationParams,
+    status = customDomain.status;
+  var isDomainValidated = status !== "pending_domain_validation";
+  var customDomainId = hasOne ? null : id;
+  var _useState = React.useState(false),
+    _useState2 = _slicedToArray__default["default"](_useState, 2),
+    showValidationWarning = _useState2[0],
+    setShowValidationWarning = _useState2[1];
+  var _useValidateDomain = useValidateDomain(url),
+    validateDomain = _useValidateDomain.mutate,
+    isValidating = _useValidateDomain.isPending;
+  var handleValidateDomain = function handleValidateDomain() {
+    return validateDomain(customDomainId, {
+      onError: function onError() {
+        setShowValidationWarning(true);
+      },
+      onSuccess: function onSuccess(values) {
+        Toastr__default["default"].success(t("neetoMolecules.customDomain.validation.successMessage"));
+        incrementStep();
+        setCustomDomain(values);
+      }
+    });
+  };
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Pane__default["default"].Body, null, /*#__PURE__*/React__default["default"].createElement(Common, {
+    currentStep: currentStep,
+    handleStepChange: handleStepChange,
+    hostname: hostname
+  }), /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "mb-6 w-full space-y-6"
+  }, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "space-y-1"
+  }, /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
+    style: "h4"
+  }, t("neetoMolecules.customDomain.domainValidation")), /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
+    style: "body2"
+  }, /*#__PURE__*/React__default["default"].createElement(reactI18next.Trans, {
+    i18nKey: "neetoMolecules.customDomain.cnameRecordInfo",
+    components: {
+      Link: /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
+        href: HELP_DOC_URL,
+        rel: "noreferrer",
+        style: "link",
+        target: "_blank"
+      })
+    },
+    values: {
+      proxyMessage: t("neetoMolecules.customDomain.proxyMessage")
+    }
+  }))), /*#__PURE__*/React__default["default"].createElement(TableWrapper, {
+    className: "pb-0"
+  }, /*#__PURE__*/React__default["default"].createElement(Table__default["default"], {
+    allowRowClick: false,
+    bordered: false,
+    columnData: columnData(),
+    rowSelection: false,
+    rowData: [_objectSpread(_objectSpread({}, cnameValidationParams), {}, {
+      status: isDomainValidated ? "success" : "pending"
+    })]
+  }))), showValidationWarning && /*#__PURE__*/React__default["default"].createElement(Callout__default["default"], {
+    style: "warning"
+  }, /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
+    style: "body2"
+  }, /*#__PURE__*/React__default["default"].createElement(reactI18next.Trans, {
+    i18nKey: "neetoMolecules.customDomain.domainValidationInfo",
+    components: {
+      Link: /*#__PURE__*/React__default["default"].createElement("a", {
+        className: "neeto-ui-text-primary-800",
+        href: HELP_DOC_URL,
+        rel: "noreferrer",
+        target: "_blank"
+      })
+    }
+  })))), /*#__PURE__*/React__default["default"].createElement(Pane__default["default"].Footer, null, /*#__PURE__*/React__default["default"].createElement("div", {
+    className: "flex items-center gap-2"
+  }, /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
+    disabled: isValidating,
+    loading: isValidating,
+    label: isDomainValidated ? t("neetoMolecules.common.actions.continue") : t("neetoMolecules.customDomain.validation.buttonLabel.domain"),
+    onClick: isDomainValidated ? incrementStep : handleValidateDomain
+  }), /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
+    label: t("neetoMolecules.common.actions.cancel"),
+    style: "text",
+    onClick: onClose
+  }))));
+};
+
+var Settings = function Settings(_ref) {
+  var customDomain = _ref.customDomain,
+    url = _ref.url,
+    onClose = _ref.onClose,
+    setCustomDomain = _ref.setCustomDomain,
+    hasOne = _ref.hasOne;
+  var _useTranslation = reactI18next.useTranslation(),
+    t = _useTranslation.t;
+  var status = customDomain.status;
+  var _useState = React.useState(STATUS_INDEX.indexOf(status)),
+    _useState2 = _slicedToArray__default["default"](_useState, 2),
+    currentStep = _useState2[0],
+    setCurrentStep = _useState2[1];
+  var isNotValidationStep = STATUS_INDEX[currentStep] !== DOMAIN_VALIDATION_STATUS;
+  var handleStepChange = function handleStepChange(index) {
+    status !== DOMAIN_VALIDATION_STATUS && setCurrentStep(index);
+  };
+  var incrementStep = function incrementStep() {
+    return setCurrentStep(function (step) {
+      return step + 1;
+    });
+  };
+  var recordProps = {
+    currentStep: currentStep,
+    customDomain: customDomain,
+    handleStepChange: handleStepChange,
+    onClose: onClose,
+    setCustomDomain: setCustomDomain,
+    url: url,
+    incrementStep: incrementStep,
+    hasOne: hasOne
+  };
+  return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Pane__default["default"].Header, null, /*#__PURE__*/React__default["default"].createElement(Typography__default["default"], {
+    style: "h2"
+  }, t("neetoMolecules.customDomain.settings"))), isNotValidationStep ? /*#__PURE__*/React__default["default"].createElement(Redirection, recordProps) : /*#__PURE__*/React__default["default"].createElement(Validation, recordProps));
+};
+
+var Manage = function Manage(_ref) {
+  var isOpen = _ref.isOpen,
+    onClose = _ref.onClose,
+    customDomain = _ref.customDomain,
+    setCustomDomain = _ref.setCustomDomain,
+    url = _ref.url,
+    hasOne = _ref.hasOne,
+    onCreate = _ref.onCreate;
+  return /*#__PURE__*/React__default["default"].createElement(Pane__default["default"], {
+    isOpen: isOpen,
+    onClose: onClose,
+    size: "large"
+  }, customDomain !== null && customDomain !== void 0 && customDomain.id ? /*#__PURE__*/React__default["default"].createElement(Settings, {
+    customDomain: customDomain,
+    hasOne: hasOne,
+    onClose: onClose,
+    setCustomDomain: setCustomDomain,
+    url: url
+  }) : /*#__PURE__*/React__default["default"].createElement(DomainField, {
+    customDomain: customDomain,
+    onClose: onClose,
+    onCreate: onCreate,
+    setCustomDomain: setCustomDomain,
+    url: url
+  }));
+};
+
+exports.DeleteAlert = DeleteAlert;
+exports.Manage = Manage;
+exports.useDeleteCustomDomain = useDeleteCustomDomain;
+exports.useFetchCustomDomains = useFetchCustomDomains;
+//# sourceMappingURL=index-39618d80.js.map