@bigbinary/neeto-custom-domains-frontend 3.3.3 → 3.3.5

package/dist/v2/CustomDomain.js

@@ -1,15 +1,15 @@
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import { createElement, useState, useEffect, memo } from 'react';
-import { isPresent, truncate, isNotEmpty, noop } from '@bigbinary/neeto-cist';
+import { isPresent, truncate, isNotEmpty } from '@bigbinary/neeto-cist';
 import { withT, useQueryParams } from '@bigbinary/neeto-commons-frontend/v2/react-utils';
 import { Alert, Typography, Button, Tooltip, Badge, Sheet, Callout, DataTable, Toastr, Stepper, Spinner } from '@bigbinary/neeto-atoms';
 import { Trans, useTranslation } from 'react-i18next';
-import { p as parse, u as useCreateCustomDomain, i as img, a as useValidateDomain, D as DOMAIN_QUERY_KEY, b as useFetchCustomDomain, c as useDeleteCustomDomain } from '../application-kZuSmUKo.js';
+import { p as parse, u as useCreateCustomDomain, i as img, a as useValidateDomain, D as DOMAIN_QUERY_KEY, b as useFetchCustomDomain, c as useDeleteCustomDomain } from '../application-CK-Outm_.js';
 import Container from '@bigbinary/neeto-molecules/v2/Container';
 import CheckCircle from '@bigbinary/neeto-icons/CheckCircle';
 import Warning2 from '@bigbinary/neeto-icons/Warning2';
 import CloseCircle from '@bigbinary/neeto-icons/CloseCircle';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import classNames from 'classnames';
 import { SINGULAR } from '@bigbinary/neeto-commons-frontend/v2/constants';
 import CustomDomain$1 from '@bigbinary/neeto-icons/CustomDomain';
@@ -112,14 +112,14 @@ var Domain = function Domain(_ref) {
       })
     }),
     children: /*#__PURE__*/jsx("div", {
-      className: "flex flex-col gap-y-6 divide-y divide-gray-200",
+      className: "divide-border flex flex-col gap-y-6 divide-y",
       children: customDomains === null || customDomains === void 0 ? void 0 : customDomains.map(function (customDomain, index) {
         var _customDomain$redirec;
         return /*#__PURE__*/jsxs("div", {
-          className: "flex items-center gap-x-3 pb-6 last:pb-0",
+          className: "flex items-start gap-x-3 pb-6 last:pb-0",
           "data-testid": "custom-domain-item",
           children: [/*#__PURE__*/jsx("div", {
-            className: classNames("rounded-lg flex items-center justify-center p-2", {
+            className: classNames("flex items-center justify-center rounded-lg p-2", {
               "bg-success": (customDomain === null || customDomain === void 0 ? void 0 : customDomain.status) === "active",
               "bg-warning": (customDomain === null || customDomain === void 0 ? void 0 : customDomain.status) === "pending",
               "bg-error": (customDomain === null || customDomain === void 0 ? void 0 : customDomain.status) === "failed"
@@ -206,8 +206,8 @@ var Domain = function Domain(_ref) {
                     Link: /*#__PURE__*/jsx(Button, {
                       href: helpDocUrl,
                       rel: "noreferrer",
-                      variant: "link",
-                      target: "_blank"
+                      target: "_blank",
+                      variant: "link"
                     })
                   }
                 })
@@ -226,39 +226,38 @@ var Domain = function Domain(_ref) {
       onClick: openPane
     }),
     children: /*#__PURE__*/jsxs("div", {
-      className: "flex h-full w-full items-center gap-x-3",
+      className: "flex h-full w-full items-start gap-x-3",
       children: [/*#__PURE__*/jsx("div", {
-        className: "bg-muted rounded-lg flex items-center justify-center p-2",
+        className: "bg-muted flex items-start justify-center rounded-lg p-2",
         children: /*#__PURE__*/jsx(CustomDomain$1, {
           className: "text-muted-foreground",
           size: 32
         })
       }), /*#__PURE__*/jsxs("div", {
-        className: "flex flex-col gap-y-1",
+        className: "flex flex-col",
         children: [/*#__PURE__*/jsx(Typography, {
+          className: "mb-3",
           variant: "h4",
           weight: "medium",
           children: t("neetoCustomDomains.noData.title")
-        }), /*#__PURE__*/jsxs("div", {
-          children: [/*#__PURE__*/jsx(Typography, {
-            className: "text-muted-foreground",
-            variant: "body2",
-            children: disconnectedIntegrationCardDescription || t("neetoCustomDomains.noData.helpTextDefault")
-          }), /*#__PURE__*/jsx(Typography, {
-            className: "text-muted-foreground mt-2",
-            variant: "body2",
-            children: /*#__PURE__*/jsx(Trans, {
-              i18nKey: "neetoCustomDomains.noData.helpTextDisconnected",
-              components: {
-                Link: /*#__PURE__*/jsx(Button, {
-                  href: helpDocUrl,
-                  rel: "noreferrer",
-                  variant: "link",
-                  target: "_blank"
-                })
-              }
-            })
-          })]
+        }), /*#__PURE__*/jsx(Typography, {
+          className: "text-muted-foreground",
+          variant: "body2",
+          children: disconnectedIntegrationCardDescription || t("neetoCustomDomains.noData.helpTextDefault")
+        }), /*#__PURE__*/jsx(Typography, {
+          className: "text-muted-foreground mt-2",
+          variant: "body2",
+          children: /*#__PURE__*/jsx(Trans, {
+            i18nKey: "neetoCustomDomains.noData.helpTextDisconnected",
+            components: {
+              Link: /*#__PURE__*/jsx(Button, {
+                href: helpDocUrl,
+                rel: "noreferrer",
+                target: "_blank",
+                variant: "link"
+              })
+            }
+          })
         })]
       })]
     })
@@ -331,6 +330,7 @@ var Strategy = withT(function (_ref) {
     setPrimaryDomain = _ref.setPrimaryDomain,
     onClose = _ref.onClose;
   return /*#__PURE__*/jsxs(Form, {
+    className: "flex min-h-0 grow flex-col",
     formikProps: {
       initialValues: STRATEGY_INITIAL_VALUES,
       validationSchema: strategyValidationSchema,
@@ -345,8 +345,8 @@ var Strategy = withT(function (_ref) {
       children: /*#__PURE__*/jsxs("div", {
         className: "space-y-4",
         children: [/*#__PURE__*/jsx(RadioGroup, {
-          stacked: true,
           name: "strategy",
+          orientation: "vertical",
           children: strategyOptions.map(function (_ref2, index) {
             var value = _ref2.value,
               label = _ref2.label,
@@ -381,8 +381,8 @@ var Strategy = withT(function (_ref) {
                 Link: /*#__PURE__*/jsx(Button, {
                   href: errorData === null || errorData === void 0 ? void 0 : errorData.pageUrl,
                   rel: "noreferrer",
-                  variant: "link",
-                  target: "_blank"
+                  target: "_blank",
+                  variant: "link"
                 })
               }
             })
@@ -496,7 +496,7 @@ var DomainField = function DomainField(_ref) {
     });
   }
   return /*#__PURE__*/jsx(Form, {
-    className: "flex-col space-y-6",
+    className: "flex min-h-0 grow flex-col",
     formikProps: {
       initialValues: INITIAL_VALUES,
       validationSchema: getCustomDomainValidationSchema(),
@@ -504,14 +504,13 @@ var DomainField = function DomainField(_ref) {
     },
     children: function children(_ref5) {
       var dirty = _ref5.dirty;
-      return /*#__PURE__*/jsxs("div", {
-        className: "w-full",
+      return /*#__PURE__*/jsxs(Fragment, {
         children: [/*#__PURE__*/jsx(Sheet.Body, {
           children: /*#__PURE__*/jsxs("div", {
             className: "w-full space-y-4",
             children: [/*#__PURE__*/jsx(Input, {
               required: true,
-              className: "w-full",
+              className: "w-[480px] max-w-full",
               "data-testid": "custom-domain-input-field",
               label: t("neetoCustomDomains.label"),
               name: "hostname",
@@ -625,6 +624,7 @@ var columnData = function columnData(dnsProvider) {
       return /*#__PURE__*/jsx("div", {
         className: "flex items-center justify-between gap-1",
         children: /*#__PURE__*/jsx("img", {
+          className: "max-h-[30px] w-auto",
           src: img
         })
       });
@@ -1082,7 +1082,7 @@ var Validation = function Validation(_ref) {
     Link: /*#__PURE__*/jsx(HelpUrlLink, {}),
     br: /*#__PURE__*/jsx("br", {})
   };
-  return /*#__PURE__*/jsxs("div", {
+  return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsxs(Sheet.Body, {
       className: "space-y-4",
       children: [/*#__PURE__*/jsxs("div", {
@@ -1105,10 +1105,10 @@ var Validation = function Validation(_ref) {
           })
         })]
       }), /*#__PURE__*/jsx("div", {
-        className: "space-y-1",
+        className: "w-full space-y-1",
         children: /*#__PURE__*/jsx(DataTable, {
           allowRowClick: false,
-          columnDefs: columnData(dnsProvider),
+          columns: columnData(dnsProvider),
           data: customDomains.map(function (_ref5) {
             var hostname = _ref5.hostname,
               dnsTarget = _ref5.dnsTarget,
@@ -1117,6 +1117,7 @@ var Validation = function Validation(_ref) {
           }).flat()
         })
       }), status === "failed" && /*#__PURE__*/jsx(Callout, {
+        className: "w-full",
         variant: STATUS_TAG_STYLES[status],
         children: /*#__PURE__*/jsx(Typography, {
           variant: "body2",
@@ -1135,6 +1136,7 @@ var Validation = function Validation(_ref) {
           })
         })
       }), isNotEmpty(errorKey) && status === "pending" && /*#__PURE__*/jsx(Callout, {
+        className: "w-full",
         variant: STATUS_TAG_STYLES[status],
         children: /*#__PURE__*/jsx(Typography, {
           variant: "body2",
@@ -1201,20 +1203,15 @@ var DomainPane = function DomainPane(_ref) {
   return /*#__PURE__*/jsxs(Sheet, {
     isOpen: isOpen,
     onClose: onClose,
-    className: "flex flex-col",
-    size: "large",
+    className: "neeto_custom_domain_pane flex flex-col data-[side=right]:sm:max-w-[1200px]",
     children: [/*#__PURE__*/jsxs(Sheet.Header, {
       className: "space-y-2",
       children: [/*#__PURE__*/jsx(Sheet.Title, {
-        children: /*#__PURE__*/jsx(Typography, {
-          variant: "h2",
-          children: t("neetoCustomDomains.addNew")
-        })
+        children: t("neetoCustomDomains.addNew")
       }), /*#__PURE__*/jsx("div", {
-        className: "neeto_custom_domain_stepper -ml-2",
+        className: "neeto_custom_domain_stepper mt-2 px-1",
         children: /*#__PURE__*/jsx(Stepper, {
           activeIndex: CURRENT_STEP[getCurrentStep(primaryDomain)],
-          setActiveIndex: noop,
           steps: STEPS
         })
       })]