feature/IO-3713-Esign-Modal-UI - Fix

client/src/App/App.styles.scss

@@ -512,7 +512,52 @@
 
 
 .esignature-embed {
-width: 100%;
-height: 100%;
-border-width: 0;
-}
+  display: block;
+  width: 100%;
+  height: 100%;
+  border-width: 0;
+}
+
+.esignature-modal {
+  .ant-modal {
+    top: 16px;
+    max-width: calc(100vw - 32px);
+    padding-bottom: 0;
+  }
+
+  .ant-modal-content {
+    display: flex;
+    flex-direction: column;
+    max-height: calc(100vh - 32px);
+  }
+
+  .ant-modal-body {
+    flex: 1 1 auto;
+    min-height: 0;
+  }
+}
+
+.esignature-modal-frame {
+  width: 100%;
+  height: calc(100vh - 150px);
+  min-height: 320px;
+  overflow: hidden;
+}
+
+@media (max-width: 768px), (max-height: 560px) {
+  .esignature-modal {
+    .ant-modal {
+      top: 8px;
+      max-width: calc(100vw - 16px);
+    }
+
+    .ant-modal-content {
+      max-height: calc(100vh - 16px);
+    }
+  }
+
+  .esignature-modal-frame {
+    height: calc(100vh - 132px);
+    min-height: 0;
+  }
+}

client/src/components/esignature-modal/esignature-modal.container.jsx

@@ -76,9 +76,11 @@ export function EsignatureModalContainer({ esignatureModal, toggleModalVisible,
       okButtonProps={{ loading: distributing }}
       okText={t("esignature.actions.distribute")}
       destroyOnHidden
-      width={"80%"}
+      width="calc(100vw - 32px)"
+      wrapClassName="esignature-modal"
+      styles={{ body: { overflow: "hidden", padding: 0 } }}
     >
-      <div style={{ height: "80vh", width: "100%" }}>
+      <div className="esignature-modal-frame">
         {token ? (
           <EmbedUpdateDocumentV1
             presignToken={token}

client/src/redux/user/user.sagas.js

@@ -1,5 +1,4 @@
 import FingerprintJS from "@fingerprintjs/fingerprintjs";
-//import { setUserId, setUserProperties } from "@firebase/analytics";
 import {
   checkActionCode,
   confirmPasswordReset,
@@ -9,11 +8,9 @@ import {
 } from "@firebase/auth";
 import { arrayUnion, doc, getDoc, setDoc, updateDoc } from "@firebase/firestore";
 import { getToken } from "@firebase/messaging";
-// import * as Sentry from "@sentry/react";
 import { notification } from "antd";
 import axios from "axios";
 import i18next from "i18next";
-//import LogRocket from "logrocket";
 import { all, call, delay, put, select, takeLatest } from "redux-saga/effects";
 import {
   auth,
@@ -48,9 +45,13 @@ import {
   validatePasswordResetSuccess
 } from "./user.actions";
 import UserActionTypes from "./user.types";
-//import posthog from "posthog-js";
 import { bodyshopHasDmsKey, determineDMSTypeByBodyshop, DMS_MAP } from "../../utils/dmsUtils";
 
+//import { setUserId, setUserProperties } from "@firebase/analytics";
+//import * as Sentry from "@sentry/react";
+//import LogRocket from "logrocket";
+//import posthog from "posthog-js";
+
 const fpPromise = FingerprintJS.load();
 
 export function* onEmailSignInStart() {

client/vite.config.js

@@ -237,9 +237,9 @@ export default defineConfig(({ command, mode }) => {
             lodash: ["lodash"],
             "@sentry/react": ["@sentry/react"],
             "@splitsoftware/splitio-react": ["@splitsoftware/splitio-react"],
-            logrocket: ["logrocket"],
+            // logrocket: ["logrocket"],
             firebase: [
-              "@firebase/analytics",
+              // "@firebase/analytics",
               "@firebase/app",
               "@firebase/firestore",
               "@firebase/auth",