Web: Management: moved the domain change dialog to the new client

2023-07-27 19:05:57 +05:00 · 2023-07-27 19:05:57 +05:00 · 720ebdfc96
commit 720ebdfc96
parent f77b8f2d84
1 changed files with 108 additions and 0 deletions
--- a/packages/management/src/categories/spaces/sub-components/dialogs/ChangeDomainDialog/index.tsx
+++ b/packages/management/src/categories/spaces/sub-components/dialogs/ChangeDomainDialog/index.tsx
@ -0,0 +1,108 @@
+import React, { useEffect } from "react";
+import styled from "styled-components";
+import ModalDialogContainer from "@docspace/client/src/components/dialogs/ModalDialogContainer";
+import Text from "@docspace/components/text";
+import Button from "@docspace/components/button";
+import ModalDialog from "@docspace/components/modal-dialog";
+import { useTranslation } from "react-i18next";
+import { observer } from "mobx-react";
+import { TextInput, Checkbox } from "@docspace/components";
+import { parseAddress } from "@docspace/components/utils/email";
+import { useStore } from "SRC_DIR/store";
+
+const StyledModal = styled(ModalDialogContainer)`
+  .create-docspace-input-block {
+    padding-top: 16px;
+  }
+  .create-docspace-input {
+    width: 100%;
+  }
+`;
+
+const ChangeDomainDialogComponent = () => {
+  const { t } = useTranslation(["Common"]);
+  const { spacesStore } = useStore();
+
+  const {
+    setPortalSettings,
+    getAllPortals,
+    getPortalDomain,
+    setChangeDomainDialogVisible,
+    domainDialogVisible: visible,
+  } = spacesStore;
+
+  const [domain, setDomain] = React.useState("");
+
+  const onHandleDomain = (e) => {
+    setDomain(e.target.value);
+  };
+
+  const onClose = () => {
+    setChangeDomainDialogVisible(false);
+  };
+
+  const onClickDomainChange = async () => {
+    await setPortalSettings(domain);
+    await getAllPortals();
+    await getPortalDomain();
+    onClose();
+  };
+
+  let parsed = parseAddress("test@" + domain);
+  const isDomainError = domain.length > 0 && !parsed.isValid();
+  return (
+    <StyledModal
+      //    isLoading={!tReady}
+      visible={visible}
+      isLarge
+      onClose={onClose}
+      displayType="modal"
+    >
+      <ModalDialog.Header>Domain settings</ModalDialog.Header>
+      <ModalDialog.Body>
+        <Text noSelect={true} fontSize="13px">
+          Changing the domain name may cause some systems failure. After
+          changing the domain name you will need to reconfigure the following
+          settings: mail, account, jabber parameters.
+        </Text>
+        <div className="create-docspace-input-block">
+          <Text
+            color="#333"
+            fontSize="13px"
+            fontWeight="600"
+            style={{ paddingBottom: "5px" }}
+          >
+            Domain name
+          </Text>
+          <TextInput
+            hasError={isDomainError}
+            onChange={onHandleDomain}
+            value={domain}
+            placeholder="Enter domain"
+            className="create-docspace-input"
+          />
+        </div>
+      </ModalDialog.Body>
+      <ModalDialog.Footer>
+        <Button
+          key="CreateButton"
+          label={t("Common:ChangeButton")}
+          isDisabled={isDomainError || domain.length === 0}
+          onClick={onClickDomainChange}
+          size="normal"
+          primary
+          scale={true}
+        />
+        <Button
+          key="CancelButton"
+          label={t("Common:CancelButton")}
+          size="normal"
+          onClick={onClose}
+          scale={true}
+        />
+      </ModalDialog.Footer>
+    </StyledModal>
+  );
+};
+
+export default observer(ChangeDomainDialogComponent);