Client: Components: Dialogs: init avatar editor dialog

packages/client/src/components/dialogs/AvatarEditorDialog/index.js

@@ -0,0 +1,31 @@
+import React from "react";
+import styled from "styled-components";
+
+import ModalDialog from "@docspace/components/modal-dialog";
+import Text from "@docspace/components/text";
+
+const StyledModalDialog = styled(ModalDialog)``;
+
+const AvatarEditorDialog = (props) => {
+  const { t, visible, onClose } = props;
+
+  return (
+    <StyledModalDialog
+      displayType="aside"
+      withBodyScroll
+      visible={visible}
+      onClose={onClose}
+      withFooterBorder
+    >
+      <ModalDialog.Header>
+        <Text fontSize="21px" fontWeight={700}>
+          {t("EditPhoto")}
+        </Text>
+      </ModalDialog.Header>
+      <ModalDialog.Body></ModalDialog.Body>
+      <ModalDialog.Footer></ModalDialog.Footer>
+    </StyledModalDialog>
+  );
+};
+
+export default AvatarEditorDialog;

packages/client/src/components/dialogs/index.js

@@ -23,6 +23,7 @@ import BackupCodesDialog from "./BackupCodesDialog";
 import CreateRoomDialog from "./CreateEditRoomDialog/CreateRoomDialog";
 import EditRoomDialog from "./CreateEditRoomDialog/EditRoomDialog";
 import ChangeNameDialog from "./ChangeNameDialog";
+import AvatarEditorDialog from "./AvatarEditorDialog";
 
 export {
   EmptyTrashDialog,
@@ -50,4 +51,5 @@ export {
   CreateRoomDialog,
   EditRoomDialog,
   ChangeNameDialog,
+  AvatarEditorDialog,
 };