Merge pull request #224 from prafull-opensignlabs/auth_user

chore:code refactor

.all-contributorsrc

@@ -151,6 +151,33 @@
       "contributions": [
         "code"
       ]
+    },
+    {
+      "login": "rishabjasrotia",
+      "name": "Rishab",
+      "avatar_url": "https://avatars.githubusercontent.com/u/33950743?v=4",
+      "profile": "https://github.com/rishabjasrotia",
+      "contributions": [
+        "code"
+      ]
+    },
+    {
+      "login": "maoo",
+      "name": "Maurizio Pillitu",
+      "avatar_url": "https://avatars.githubusercontent.com/u/327285?v=4",
+      "profile": "https://session.it",
+      "contributions": [
+        "bug"
+      ]
+    },
+    {
+      "login": "lsprr",
+      "name": "Luis Parra",
+      "avatar_url": "https://avatars.githubusercontent.com/u/16653744?v=4",
+      "profile": "https://luisparra.dev",
+      "contributions": [
+        "a11y"
+      ]
     }
   ]
 }

.env.example

@@ -47,3 +47,6 @@ MAILGUN_SENDER=postmaster@mail.yourdomain.com
 
 # Base64 encoded PFX or p12 document signing certificate file *********************************************************************************************************************
 PFX_BASE64=
+
+# Provide Pass pharse of above PFX or p12 document
+PASS_PHRASE= 

.env.local_dev

@@ -0,0 +1,109 @@
+# Clone the repo and rename this file to .env if you want to run the frontend react app locally for some quick contributions to the project.
+# When used as it is, this env config will connect to our hosted UAT backend
+# Note that any data in staging will get cleared from time to time and you may have to sign up again and again
+
+# Set CI to false while running the app locally
+CI=false
+# Set it to the URL form where the app home page will be accessed
+PUBLIC_URL=http://localhost:3000
+# Set it to true if you want to generate the Sourcemap for debugging
+GENERATE_SOURCEMAP=false
+# Set it to the URL from where APIs will be accessible, for local development it should be localhost:3000/api/app (use your local port number instead)
+REACT_APP_SERVERURL=http://localhost:8080/app
+# A 12 character long random app identifier. The value of this should be same as APP_ID which is a variable used by backend API.
+REACT_APP_APPID=opensignstgn
+
+
+# Backend ExpressJS config ****************************************************************************************************************************************************************************************
+# A 12 character long random app identifier. The value of this should be same as REACT_APP_APPID which is a variable used by Frontend React App.
+APP_ID=opensignstgn
+# Name of the app. It will be visible in the verification emails sent out.
+appName=open_sign_server
+# A 12 character long random secret key that allows access to all the data. It is used in Parse dashboard config to view all the data in the database.
+MASTER_KEY=XnAadwKxxByMr
+# Mongodb URI to connect to
+MONGODB_URI=mongodb://host.docker.internal:27017/OpenSignDB
+# Path on which APIs should be mounted. Do not change this. This variable shall be removed & value hardcoded in the source code in coming versions.
+PARSE_MOUNT=/app
+# Set it to the URL from where APIs will be accessible to the NodeJS functions, for local development it should be localhost:3000/api/app (use your local port number instead)
+SERVER_URL=http://127.0.0.1:8080/app
+
+# Storage config ************************************************************************************************************************************************************************************************
+# Digital ocean space name or AWS S3 bucket name for uploading documents
+DO_SPACE=DOSPACENAME
+# Digital ocean spaces endpoint or AWS S3 endpoint for uploading documents
+DO_ENDPOINT=ams3.digitaloceanspaces.com
+# Digital ocean baseurl or AWS S3 base URL
+DO_BASEURL=https://DOSPACENAME.ams3.digitaloceanspaces.com
+# Digital ocean spaces access key ID or AWS s3 Access key ID for uploading the docs
+DO_ACCESS_KEY_ID=
+# Digital ocean spaces secret access key or AWS s3 secret access key for uploading the docs
+DO_SECRET_ACCESS_KEY=
+# Digital ocean spaces region or AWS s3 region
+DO_REGION=us-west
+# local storage
+USE_LOCAL=TRUE
+
+# Email mailgun config (The app will not initialize if any of these 3 variables are not set) *********************************************************************************************************************
+MAILGUN_API_KEY=XXXXX
+MAILGUN_DOMAIN=mail.yourdomain.com
+MAILGUN_SENDER=postmaster@mail.yourdomain.com
+
+# Base64 encoded PFX or p12 document signing certificate file *********************************************************************************************************************
+PFX_BASE64='MIIKCQIBAzCCCc8GCSqGSIb3DQEHAaCCCcAEggm8MIIJuDCCBG8GCSqGSIb3DQEH
+BqCCBGAwggRcAgEAMIIEVQYJKoZIhvcNAQcBMBwGCiqGSIb3DQEMAQYwDgQIpumu
+bFabBWACAggAgIIEKDqHS7Icd5MzIBk1dBokGK2s+5a2fA4308WA1QzEWmczqVYI
+z6lYmW8qsiZIw4PFkRzdIx1+zCmP8jgWiiqh5RKnbHYmh1JPNyx9SqmUDILDXmjg
+KxO9agRw9LXge4hgRL7YW0TxYZYw4EeXV9Yr7kcOq9DoO2MoRikJ+2Tuvvq/hfuV
+9zFHsz4jpf7W95k1IeH6bZ92klz5R1e/EK8JuHy592i/u+BxxW1vTkiPpTaHD6s9
+1lDSkT1j0LIDU6l9gVvJvFBV8j88vet/Z4QkTbHPMYvBnKNRstKuOvDasEJE4RkA
+PV4TfBwFF6uvREZI1vBboM/18pzeyjoRX+mlJNfcH3kh1tkck+Jg+M2bLXAH1EdD
+GRwENvnTNW1CFIn37VVja7SFBQNXA+E6rejmqtUmZ5XktSINDBUyjow9XuYTUtI/
+sgcRSC0aB0EKKpphbFPp1niKCLm1ef33e+bWyWbtR2L2Kc3ETmhjNADpyapAGmzc
+LP2BafGaKj18KiLAG4GL6+kXk0GUz7Fw5q8H8RY1T33o+xjWvC0+aJgvr65qWdKw
++ug6wuu4Cr2kFEuXxPKsnYqmE5NT/x+lfunlZ5iEQN3w2XO5J2u2eMXVRUsPH2T6
+0sJKomjY0RB1JsqZBnyleWm+tYo0RpVAyJ3NGBp9dVb7a3Qw6jNZBG/xMW+gvtUJ
+q6hfK/cD3cagD0NQFVD5STMOuGOSqq/bbwAKjZ/lrPmCCYATKwkjAFybYfHJVrrW
+Y2tQgCQ/zrZLIxQjp7F17hU0+gT54x0MpF6AoqIM/qqNnHrQ0fi50ECmLvx3SqYa
+nvjvt/HZhMZfqRXiXjeicIwpnNoG7+uQknySk+7cc9GNhHZR7cfPfkTpgvuuebrQ
+l5YW+k9tG+xrX8g72nvtFMnammlBixlFwECJaEszEQk5tc2ti8uG2z+kGnFoDoBV
+M6ZVMpKDJzXPxLdzT6ChIPyatjIkqOKe6vDpnmzcoEhbBhmtkVjWFA2dfX846ugV
+y1QiecWgk8pMNWhh3IDd05v/wzbFwNcq+Gi+1dZsPmFH+egIcrQKZu2r3jCJtGHh
+DNG/nyf/anqvKXF90bi4hRT3vdDXXuWgY7EUwfn9h5jYabCO6HsQxQOBjFYNmBrh
+MfaiBZe72E8fzNAfIlwDcJ4AWY1SOM7hi8bqfRWw1NtNxuMUiRFoR31O6XkQauye
+9hAmpdlZHZXtJ6LM0QaWkPJmG3058GMtIn/qS60V9nINh+zXhwza/1pnFB+e9MWc
+hAPgo0nn55FusM//g1nM31PKe+nOm3Jyp0nEQ4m8aDtJS63o2fvp3e2KJbPWQMHE
+a83W975diWg4NTdevV9lFpNllHclVoPoavUHIzHd7HF9TcPpjbXJSUZ7cITHHefr
+kQTa/2G9cWuRhN9GKIHBdr13nfEvMIIFQQYJKoZIhvcNAQcBoIIFMgSCBS4wggUq
+MIIFJgYLKoZIhvcNAQwKAQKgggTuMIIE6jAcBgoqhkiG9w0BDAEDMA4ECDgnjfOf
+AjArAgIIAASCBMgkbVuptroBdyMY5gl/eBQj5+iAV02YSaF969ihStLSWI4x5FAf
+HuDgqCyEMSl4RHG8ZvNaO9JoNfIpMK/TPQBoQRCzE2Vjf66VTERaQtU6h7tZrbQt
+K96n9eqvohm/vXbXe08fsodYp2s79kAvKgpuGG5iX77qYVzJHBPed87cvczo4ToP
+CpurDpByt8fGEmjtcikal8o+H9uoHjcFwqMigX1Q7IEjuKXrb5e6wTvxMRob8yfv
+LVl6ahteKSkWCMb6rLZ5f12jDoCGX/YXRrSsU9t/lXe0Nxv5i7c8flb2EsNtwygD
+fexVvn5u6ble6RDYNpuQkPgF41HyZh+JvGAF6i1r4tJPL9Pf4HnjEB8Y8IHgon+w
+T5I+8LTgcrWyhptzblXMjKySTEp9OEa2cCVwZkl4z43PWJ5oIAQ2IDTOQ603/5o/
+d9KA76/zMPQ5O0gv17OA7kwFv98v6sTcR4vgkQZqnyDpJSEPHyNxhw2MSBqS3jq3
+YPhRz+3Ei1oFp9uYFhzn39f9gzNi++X9pOjSrDb8v3mcDXZKNrxQLuoRMSf0eQNI
+dgJRqj/fuqNZ5ac3kd4P5BALCsnA1tM27zYrgUdpOnrc2D9FBthEjpRlQKMMzhQf
+cNMFWmoNjakDilvvLcsQeQ3P6cXbN1ODoNnjgK3VzcmeKyzW2PrTXEPHARUM3j4V
+sZzGaUOVKLqaaDrXWQKC0vrTvxP2WMfjQ1dTdXQP/kSZTXRC5rtB9tky38flBor0
+N9rhUDIGMs5qBvyrkV2hKXiW39G69p1KWY+Cw28AzY+CNSjePRi60TsnUxgcOS7i
+0AT25Gx3A4YqxmTY38MPB4wPcBPcw4hjNoQamaC9mqs+KVHcP5YHUlqykMeH0YVi
+J+ehytJE9xuDcfBOjxjadxp3/q/Lku4rky89gdJGFQWuuz75VulDywPRZRwmQTel
+sjEGMHR1zTOlPJdTDWhqaKmWvL4GhbCgEPIKwmqd1QKRTl/3Baa1nYllJeYVwiTT
+qLCkbA6qXrLGj1ENZxrKn9yqr8HwOoApjwhARu4LF/BRMgdkzelK2kOXHnZ26sZ2
+NY/MMtVmq4c59y6iQwmsbHr9tWGz3ahyXcZZufjNXU/AVnO1c92g7umAWZF4RohL
+gMmh57cAhN9PEbEv6j/6BT3XXp8jB0ywcRriYxfxwidviCKH/76Q4sytYJQaDFI1
+fnzmv0aDotbG2BdpWSiYPDOPm+3cmfjlULsn1FYWL4NDCX1f+C4lNtKVX9LU8c5M
+m8dA1DUlDfnuNO5/BShuoGXG2z4O/XwxIaRFizMxWS2sWurbAEFJ6oNw3kC7WSah
+NIe8aUC1umpc1Gk3X2f4Ytzj9OEqn0y55qoqLINJuejXMffF/gjopxHWadLVaVaj
+Q1SewrECuEXdSbBR/a10po24wmRtkmlvRJXJl7sG95xE5ZCqp+m6sRPWGdf1yKbV
+vyWNUe4Qvkxe4a0VAJpTyIGr980CKz/jkvtNQMobGl7AfhxKJ450wg454WcexMct
+BYXvZMSdUDCgMLlh0nHJHl5btrFWqE0Z/fqWmIknZL2jZ4J+2hdVl/xB/sUt6kcu
+txw+RfL+vNE8PxhTNaOdJFwD8yeN1mJ3yMUA8HHYpw9yljgxJTAjBgkqhkiG9w0B
+CRUxFgQUDYlgGVxSxuOknhQc256x3++7BDwwMTAhMAkGBSsOAwIaBQAEFFjASdYl
+3pXAXxZuvVvv9tsb4bdrBAhyb+KCIjp/gAICCAA='
+
+# Provide Pass pharse of above PFX or p12 document
+PASS_PHRASE=opensign 

.gitignore

@@ -22,3 +22,6 @@
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+apps/OpenSign/public/mfbuild/*
+microfrontends/SignDocuments/build/*
+apps/OpenSignServer/files/files/*

.husky/pre-commit

@@ -1,5 +1,4 @@
-#!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
 
-npx eslint '**/*.{js,jsx}'
-npx pretty-quick --staged '**/*.{js,jsx}'
+npm run lint-staged-changes

.lintstagedrc.json

@@ -0,0 +1,3 @@
+{
+  "*.js": "prettier --write"
+}

INSTALLATION.md

@@ -7,6 +7,7 @@ or follow below instructions to install it on your own infrastructure.
 
 - Localhost(Frontend only)
 - Digital Ocean
+- Localhost(Docker)
 
 ## Localhost(Frontend only)
 
@@ -83,3 +84,67 @@ You can install all 3 components on digital ocean using the button below -
 
  Visit below link if you face any issues while following the above instructions -
   - https://repost.aws/knowledge-center/create-access-key
+
+
+## Localhost(Docker)
+
+For local Setup we need to need following prerequisite:
+
+Environment Varaibles:
+
+| Environment Varibale  | Value | Description |
+| ------------- | ------------- | ------------- |
+| CI  | false  | Set CI to false while running the app locally |
+| PUBLIC_URL  | http://localhost:3000  | Set it to the URL form where the app home page will be accessed |
+| GENERATE_SOURCEMAP  | false | Set it to true if you want to generate the Sourcemap for debugging |
+| REACT_APP_SERVERURL  | http://localhost:8080/app  | Set it to the URL from where APIs will be accessible, for local development it should be localhost:3000/api/app (use your local port number instead) |
+| REACT_APP_APPID  | http://localhost:3000  | Set it to the URL form where the app home page will be accessed |
+| PUBLIC_URL  | opensignstgn  | A 12 character long random app identifier. The value of this should be same as APP_ID which is a variable used by backend API. |
+| APP_ID  | opensignstgn  | A 12 character long random app identifier. The value of this should be same as REACT_APP_APPID which is a variable used by Frontend React App. |
+| appName  | open_sign_server  | Name of the app. It will be visible in the verification emails sent out. |
+| MASTER_KEY  | XnAadwKxxByMr  | A 12 character long random secret key that allows access to all the data. It is used in Parse dashboard config to view all the data in the database. |
+| MONGODB_URI  | mongodb://host.docker.internal:27017/OpenSignDB  | Mongodb URI to connect to |
+| PARSE_MOUNT  |/app  | Path on which APIs should be mounted. Do not change this. This variable shall be removed & value hardcoded in the source code in coming versions. |
+| SERVER_URL  | http://127.0.0.1:8080/app  | Set it to the URL from where APIs will be accessible to the NodeJS functions, for local development it should be localhost:3000/api/app (use your local port number instead) |
+| DO_SPACE  | DOSPACENAME  | Digital ocean space name or AWS S3 bucket name for uploading documents |
+| DO_ENDPOINT  | ams3.digitaloceanspaces.com  | Digital ocean spaces endpoint or AWS S3 endpoint for uploading documents |
+| DO_BASEURL  |https://DOSPACENAME.ams3.digitaloceanspaces.com  | Digital ocean baseurl or AWS S3 base URL |
+| DO_ACCESS_KEY_ID  | YOUR_S3_ACCESS_ID  | Digital ocean spaces access key ID or AWS s3 Access key ID for uploading the docs |
+| DO_SECRET_ACCESS_KEY  | YOUR_S3_ACCESS_KEY  | Digital ocean spaces secret access key or AWS s3 secret access key for uploading the docs |
+| DO_REGION  | YOUR_S3_REGION  | Digital ocean spaces region or AWS s3 region |
+| USE_LOCAL  | FALSE  | To use local file storage to save file |
+| MAILGUN_API_KEY  | YOUR_MAILGUNAPI_KEY  | Mailgun API Key |
+| MAILGUN_DOMAIN  | YOUR_MAILGUNAPI_DOMAIN | Mailgun API Domain |
+| MAILGUN_SENDER  | - | Mailgun Sender Mail ID |
+| PFX_BASE64  | - | Base64 encoded PFX or p12 document signing certificate file. You can generate base64 encoded self sign certificate using the passphrase `emudhra` |
+
+# Steps to Generate Self Sign Certificate
+```
+# execute below command and use passphrase emudhra
+openssl genrsa -des3 -out ./cert/local_dev.key 2048
+openssl req -key ./cert/local_dev.key -new -x509 -days 365 -out ./cert/local_dev.crt
+openssl pkcs12 -inkey ./cert/local_dev.key -in ./cert/local_dev.crt -export -out ./cert/local_dev.pfx
+openssl base64 -in ./cert/local_dev.pfx -out ./cert/base64_pfx
+```
+
+# CORS Configuration
+
+As document storage is delegated to S3-compatible services that reside in a different host than the OpenSign one, document operations (loading, storing, deleting) are subject to [Cross-Origin Resource Sharing](https://en.wikipedia.org/wiki/Cross-origin_resource_sharing) restriction policies; as a consequence, OpenSign app may fail with (browser console) errors like the following:
+```
+Access to fetch at 'https://foo.nyc3.digitaloceanspaces.com/exported_file_4627_0000-00-00T00%3A45%3A43.344Z.pdf'
+from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header
+is present on the requested resource. If an opaque response serves your needs, set the request's mode to
+'no-cors' to fetch the resource with CORS disabled.
+```
+
+In order to address this, your document storage system must be instructed to accept requests from other hosts; below the relevant documentation links:
+- [How to Configure CORS on DigitalOcean Spaces](https://docs.digitalocean.com/products/spaces/how-to/configure-cors/)
+- [Configuring cross-origin resource sharing on AWS S3](https://docs.aws.amazon.com/AmazonS3/latest/userguide/enabling-cors-examples.html)
+
+# Build Local Environment
+
+Command to build project -
+- Execute `make build`
+
+Command to run project -
+- Execute `make run`

Makefile

@@ -0,0 +1,9 @@
+build:
+	cp .env.local_dev .env
+	rm -rf apps/OpenSign/public/mfbuild
+	cd microfrontends/SignDocuments && npm install && npm run build
+	docker compose up --build --force-recreate
+
+run:
+	cp .env.local_dev .env
+	docker compose up -d

README.md

@@ -1,8 +1,7 @@
-<h1 align="center"><a href='https://www.opensignlabs.com'>OpenSign™</a></h1>
-                    
-<div align="center">
+<h1 align="center"><a href='https://www.opensignlabs.com'><img src=https://github.com/OpenSignLabs/OpenSign/assets/5486116/e518cc9c-5de3-47da-950b-f93336b9f14e></a>
+</h1><div align="center">
 
-The free open source alternative to DocuSign | PandaDoc | SignNow | Adobe Sign | Smartwaiver | SignRequest | HelloSign | Zoho sign.
+[The free and open source alternative to DocuSign](https://www.opensignlabs.com)
 
 [![Average time to resolve an issue](http://isitmaintained.com/badge/resolution/opensignlabs/opensign.svg)](http://isitmaintained.com/project/opensignlabs/opensign "Average time to resolve an issue")
 [![All Contributors](https://img.shields.io/github/all-contributors/opensignlabs/opensign?color=ee8449&style=flat-square)](#contributors)
@@ -23,7 +22,7 @@ The free open source alternative to DocuSign | PandaDoc | SignNow | Adobe Sign |
   <a href="https://www.linkedin.com/company/opensign%E2%84%A2/about/">LinkedIn</a>
 
 
-## An Open-Source Alternative to DocuSign, PandaDoc, SignNow, Adobe Sign, Smartwaiver, SignRequest, and HelloSign
+## The open-source document e-signing solution
 
 ---
 </div>
@@ -48,14 +47,18 @@ Welcome to OpenSign, an open-source document e-signing solution designed to prov
 
 ### Features
 
-- **Secure Signing**: Utilizes state-of-the-art cryptographic algorithms to ensure the security & integrity of your documents.
-- **User-Friendly Interface**: Designed with usability in mind, making it easy for both technical and non-technical users.
-- **Multi-Platform Support**: Compatible with various browsers and devices.
-- **Invite & collaborate users**: Bring multiple people from your team into the signing process, all within your own infrastructure.
-- **Secure**: Allows for the easy, secure and seamless organization of your documents using 'OpenSigDrive'.
-- **Audit Trails**: Keeps a detailed log of all activities related to the document signing process including IP addresses and access timings.
-- **Completion Certificate**: Generate secure completion certificate as soon as a document is signed by all participants.
-- **API Support**: Provides a robust API for integration into other software and services.
+- **Secure PDF E-Signing:** With the help of Robust encryption algorithms, OpenSign™ ensures maximum security, privacy & compatibility.
+- **Annotate Documents:** OpenSign™ allows you to annotate PDF documents with an advanced signing pad that comes with hand drawn signatures support as well as uploaded images & saved signatures for the simplest signing experience.
+- **User-Friendly Interface:** OpenSign™ was built while keeping Intuitive design in mind for ease of use. Features like "Sign yourself", "One click signatures" and "OpenSign Drive" makes it stand out of the crowd and even makes it better than a lot of so-called industry leaders.
+- **Multi-signer Support:** OpenSign's ability to invite multiple signers for signing along with the ability to invite witnesses & being able to enforce signing in a sequence makes it the only open source solution that is fully loaded and allows it to compete head-to-head with established players.
+- **Email Unique Code(OTP) verification support for guest signers:** With OpenSign™, your documents are fully secure even when being signed by guest users. Guest signers can only sign the document after entering a unique code sent to their email address. 
+- **"Expiring Docs" & "Rejection":** You can set documents to expire after certain number of days after which nobody will be able to sign it. Not just this, OpenSign also allows signers to reject signing a document.
+- **Beautiful email templates:** All document signing invitations, completion notifications & reminders are formatted using great looking email templates.
+- **PDF Template Creation(coming soon):** OpenSign™ allows you to create and store PDF document templates for repeated use thereby saving you a lot of time.
+- **OpenSign™ Drive:** It is a centralised secure vault for your signed documents that makes storing, signing, organizing, sharing & achieving your docs a breeze.
+- **Audit Trails & completion certificate:** Being a security focused solution, OpenSign™ makes it a top priority to save detailed logs for tracking document activities along with time-stamps, IP addresses, email IDs & phone numbers. A completion certificate is generated as soon as document is completed which contains all the document related logs for added safety.
+- **API Support(coming soon):** OpenSign™ API allows seamless integration into existing systems and software. APIs will soon be available as a cloud hosted solution.
+- **Integrations:** Seamless integrations with various Cloud storage systems, CRMs & enterprise platforms is coming soon.
 
 <img src=https://github.com/OpenSignLabs/OpenSign/assets/5486116/b37ff443-7099-4273-9aeb-21c46d7154cf height='200'>
 <img src=https://github.com/OpenSignLabs/OpenSign/assets/5486116/86db91b7-6c2f-4885-a33c-58f4fd35ec89 height='200'>
@@ -122,6 +125,9 @@ We would like to thank all our contributors and users for their support and feed
     <tr>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/VishakhaSainani"><img src="https://avatars.githubusercontent.com/u/113436770?v=4?s=100" width="100px;" alt="VishakhaSainani"/><br /><sub><b>VishakhaSainani</b></sub></a><br /><a href="#code-VishakhaSainani" title="Code">💻</a></td>
       <td align="center" valign="top" width="14.28%"><a href="https://github.com/andrew-opensignlabs"><img src="https://avatars.githubusercontent.com/u/148278535?v=4?s=100" width="100px;" alt="Andrew"/><br /><sub><b>Andrew</b></sub></a><br /><a href="#code-andrew-opensignlabs" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://github.com/rishabjasrotia"><img src="https://avatars.githubusercontent.com/u/33950743?v=4?s=100" width="100px;" alt="Rishab"/><br /><sub><b>Rishab</b></sub></a><br /><a href="#code-rishabjasrotia" title="Code">💻</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://session.it"><img src="https://avatars.githubusercontent.com/u/327285?v=4?s=100" width="100px;" alt="Maurizio Pillitu"/><br /><sub><b>Maurizio Pillitu</b></sub></a><br /><a href="#bug-maoo" title="Bug reports">🐛</a></td>
+      <td align="center" valign="top" width="14.28%"><a href="https://luisparra.dev"><img src="https://avatars.githubusercontent.com/u/16653744?v=4?s=100" width="100px;" alt="Luis Parra"/><br /><sub><b>Luis Parra</b></sub></a><br /><a href="#a11y-lsprr" title="Accessibility">️️️️♿️</a></td>
     </tr>
   </tbody>
 </table>

apps/OpenSign/.gitignore

@@ -10,6 +10,7 @@
 
 # production
 /build
+/mfbuild
 
 # misc
 .env

apps/OpenSign/Dockerfile

@@ -5,14 +5,14 @@ FROM node:16
 WORKDIR /usr/src/app
 
 # Copy package.json and package-lock.json first to leverage Docker cache
-COPY apps/OpenSign/package*.json ./
+COPY ./package*.json ./
 
 # Install application dependencies
 RUN npm install
 
 # Copy the current directory contents into the container
-COPY apps/OpenSign/ .
-COPY apps/OpenSign/.husky .
+COPY ./ .
+COPY ./.husky .
 
 # Make port 3000 available to the world outside this container
 EXPOSE 3000
@@ -21,5 +21,5 @@ EXPOSE 3000
 # ENV NODE_ENV production
 
 # Run the application
-CMD ["npm", "start"]
+ENTRYPOINT npm run start-dev
 

apps/OpenSign/package.json

@@ -40,8 +40,9 @@
     "web-vitals": "^2.1.4"
   },
   "scripts": {
-    "start": "mf-cra start",
-    "build": "npm run micro && CI=false && mf-cra build",
+    "start": "serve -s build",
+    "start-dev": "mf-cra start",
+    "build": "rm -rf public/mfbuild && npm run micro && CI=false && mf-cra build",
     "micro": "cd ../../microfrontends/SignDocuments && npm install && npm run build",
     "test": "react-scripts test",
     "eject": "react-scripts eject",
@@ -84,4 +85,4 @@
     "pretty-quick": "^3.1.3",
     "tailwindcss": "^3.3.3"
   }
-}
+}

apps/OpenSign/src/App.js

@@ -14,6 +14,7 @@ import PageNotFound from "./routes/PageNotFound";
 import ForgetPassword from "./routes/ForgetPassword";
 import ChangePassword from "./routes/ChangePassword";
 import ReportMicroapp from "./components/ReportMicroapp";
+import LoadMf from "./routes/LoadMf";
 
 function App() {
   const [isloading, setIsLoading] = useState(true);
@@ -59,6 +60,7 @@ function App() {
           <Routes>
             <Route exact path="/" element={<Login />} />
             <Route exact path="/signup" element={<Signup />} />
+            <Route exact path="/loadmf/:remoteApp/*" element={<LoadMf />} />
             <Route exact path="/forgetpassword" element={<ForgetPassword />} />
             {process.env.REACT_APP_ENABLE_SUBSCRIPTION && (
               <>

apps/OpenSign/src/components/AppendFormInForm.js

@@ -241,26 +241,6 @@ const AppendFormInForm = (props) => {
               className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
             />
           </div>
-
-          <div className="mb-3">
-            <label
-              htmlFor="phone"
-              className="block text-xs text-gray-700 font-semibold"
-            >
-              Phone
-              <span style={{ color: "red", fontSize: 13 }}> *</span>
-            </label>
-            <input
-              type="text"
-              id="phone"
-              value={phone}
-              onChange={(e) => setPhone(e.target.value)}
-              required
-              disabled={addYourself}
-              className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
-            />
-          </div>
-
           <div className="mb-3">
             <label
               htmlFor="email"
@@ -279,6 +259,24 @@ const AppendFormInForm = (props) => {
               className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
             />
           </div>
+          <div className="mb-3">
+            <label
+              htmlFor="phone"
+              className="block text-xs text-gray-700 font-semibold"
+            >
+              Phone
+              <span style={{ color: "red", fontSize: 13 }}> *</span>
+            </label>
+            <input
+              type="text"
+              id="phone"
+              value={phone}
+              onChange={(e) => setPhone(e.target.value)}
+              required
+              disabled={addYourself}
+              className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
+            />
+          </div>
 
           <div className="mt-4 flex justify-start">
             <button

apps/OpenSign/src/components/LoginFacebook.js

@@ -27,14 +27,14 @@ const LoginFacebook = ({
       setThirdpartyLoader(true);
       const details = {
         Email: response.email,
-        Name: response.name,
+        Name: response.name
       };
       setUserDetails({ ...userDetails, ...details });
       const fDetails = {
         Id: response.userID,
         AccessToken: response.accessToken,
         Name: response.name,
-        Email: response.email,
+        Email: response.email
       };
       setFBDetails({ ...fBDetails, ...fDetails });
       const res = await checkExtUser(fDetails);
@@ -42,9 +42,11 @@ const LoginFacebook = ({
   };
 
   const checkExtUser = async (details) => {
-    const extUser = new Parse.Query("contracts_Users");
-    extUser.equalTo("Email", details.Email);
-    const extRes = await extUser.first();
+    // const extUser = new Parse.Query("contracts_Users");
+    // extUser.equalTo("Email", details.Email);
+    // const extRes = await extUser.first();
+    const params = { email: details.Email };
+    const extRes = await Parse.Cloud.run("getUserDetails", params);
     // console.log("extRes ", extRes);
     if (extRes) {
       const params = { ...details, Phone: extRes.get("Phone") };
@@ -209,18 +211,19 @@ const LoginFacebook = ({
                   <div>
                     <button
                       type="button"
-                      className="btn btn-secondary"
-                      onClick={() => setIsModal(false)}
-                      style={{ marginRight: 10, width: 90 }}
+                      onClick={() => handleSubmitbtn()}
+                      className="btn btn-info"
+                      style={{ marginRight: 10 }}
                     >
-                      Cancel
+                      Sign up
                     </button>
                     <button
                       type="button"
-                      onClick={() => handleSubmitbtn()}
-                      className="btn btn-info"
+                      className="btn btn-secondary"
+                      onClick={() => setIsModal(false)}
+                      style={{ width: 90 }}
                     >
-                      Sign up
+                      Cancel
                     </button>
                   </div>
                 </form>

apps/OpenSign/src/components/LoginGoogle.js

@@ -42,7 +42,42 @@ const GoogleSignInBtn = ({
       width: "187px"
     });
   });
+  const clearStorage = async () => {
+    await Parse.User.logOut();
+
+    let baseUrl = localStorage.getItem("BaseUrl12");
+    let appid = localStorage.getItem("AppID12");
+    let applogo = localStorage.getItem("appLogo");
+    let domain = localStorage.getItem("domain");
+    let appversion = localStorage.getItem("appVersion");
+    let appTitle = localStorage.getItem("appTitle");
+    let defaultmenuid = localStorage.getItem("defaultmenuid");
+    let PageLanding = localStorage.getItem("PageLanding");
+    let _appName = localStorage.getItem("_appName");
+    let _app_objectId = localStorage.getItem("_app_objectId");
+    let appName = localStorage.getItem("appName");
+    let userSettings = localStorage.getItem("userSettings");
+
+    localStorage.clear();
+
+    localStorage.setItem("BaseUrl12", baseUrl);
+    localStorage.setItem("AppID12", appid);
+    localStorage.setItem("appLogo", applogo);
+    localStorage.setItem("domain", domain);
+    localStorage.setItem("appversion", appversion);
+    localStorage.setItem("appTitle", appTitle);
+    localStorage.setItem("defaultmenuid", defaultmenuid);
+    localStorage.setItem("PageLanding", PageLanding);
+    localStorage.setItem("_appName", _appName);
+    localStorage.setItem("_app_objectId", _app_objectId);
+    localStorage.setItem("appName", appName);
+    localStorage.setItem("userSettings", userSettings);
+    localStorage.setItem("baseUrl", baseUrl);
+    localStorage.setItem("parseAppId", appid);
+
+  };
   const responseGoogle = async (response) => {
+    clearStorage();
     setThirdpartyLoader(true);
     // console.log("response ", response);
     if (response.credential) {
@@ -66,9 +101,11 @@ const GoogleSignInBtn = ({
     }
   };
   const checkExtUser = async (details) => {
-    const extUser = new Parse.Query("contracts_Users");
-    extUser.equalTo("Email", details.Gmail);
-    const extRes = await extUser.first();
+    // const extUser = new Parse.Query("contracts_Users");
+    // extUser.equalTo("Email", details.Gmail);
+    // const extRes = await extUser.first();
+    const params = { email: details.Gmail };
+    const extRes = await Parse.Cloud.run("getUserDetails", params);
     // console.log("extRes ", extRes);
     if (extRes) {
       const params = { ...details, Phone: extRes.get("Phone") };
@@ -141,6 +178,32 @@ const GoogleSignInBtn = ({
       alert("Please fill required details!");
     }
   };
+  const handleCloseModal = () => {
+    setIsModal(false);
+    Parse.User.logOut();
+
+    let appdata = localStorage.getItem("userSettings");
+    let applogo = localStorage.getItem("appLogo");
+    let appName = localStorage.getItem("appName");
+    let defaultmenuid = localStorage.getItem("defaultmenuid");
+    let PageLanding = localStorage.getItem("PageLanding");
+    let domain = localStorage.getItem("domain");
+    let _appName = localStorage.getItem("_appName");
+    let baseUrl = localStorage.getItem("BaseUrl12");
+    let appid = localStorage.getItem("AppID12");
+
+    localStorage.clear();
+
+    localStorage.setItem("appLogo", applogo);
+    localStorage.setItem("appName", appName);
+    localStorage.setItem("_appName", _appName);
+    localStorage.setItem("defaultmenuid", defaultmenuid);
+    localStorage.setItem("PageLanding", PageLanding);
+    localStorage.setItem("domain", domain);
+    localStorage.setItem("userSettings", appdata);
+    localStorage.setItem("BaseUrl12", baseUrl);
+    localStorage.setItem("AppID12", appid);
+  };
   return (
     <div style={{ position: "relative" }}>
       {thirdpartyLoader && (
@@ -235,17 +298,17 @@ const GoogleSignInBtn = ({
                   </div>
                   <div className="form-group">
                     <label
-                      htmlFor="Destination"
+                      htmlFor="JobTitle"
                       style={{ display: "flex" }}
                       className="col-form-label"
                     >
-                      Destination{" "}
+                      Job Title{" "}
                       <span style={{ fontSize: 13, color: "red" }}>*</span>
                     </label>
                     <input
                       type="text"
                       className="form-control"
-                      id="Destination"
+                      id="JobTitle"
                       value={userDetails.Destination}
                       onChange={(e) =>
                         setUserDetails({
@@ -259,18 +322,19 @@ const GoogleSignInBtn = ({
                   <div>
                     <button
                       type="button"
-                      className="btn btn-secondary"
-                      onClick={() => setIsModal(false)}
-                      style={{ marginRight: 10, width: 90 }}
+                      className="bg-[#17a2b8] p-2 text-white rounded"
+                      onClick={() => handleSubmitbtn()}
+                      style={{ marginRight: 10 }}
                     >
-                      Cancel
+                      Sign up
                     </button>
                     <button
                       type="button"
-                      onClick={() => handleSubmitbtn()}
-                      className="btn btn-info"
+                      className="bg-[#6c757d] p-2 text-white rounded"
+                      onClick={handleCloseModal}
+                      style={{ width: 90 }}
                     >
-                      Sign up
+                      Cancel
                     </button>
                   </div>
                 </form>

apps/OpenSign/src/components/ReportMicroapp.js

@@ -1,6 +1,6 @@
 import useFederatedComponent from "mf-cra";
 import React, { Suspense, useEffect } from "react";
-import { useNavigate, useParams } from "react-router-dom";
+import { useParams } from "react-router-dom";
 
 const MicroappModal = () => {
   const { remoteApp } = useParams();
@@ -15,7 +15,9 @@ const MicroappModal = () => {
     // console.log("value ", key + ":" + value);
 
     if (key === "remoteUrl") {
-      obj = { ...obj, [key]: atob(value) };
+      const url = window.location.origin + "/mfbuild/remoteEntry.js";
+      // console.log("atob(value) ", atob(value))
+      obj = { ...obj, [key]: url };
     } else {
       if (key === "moduleToLoad") {
         obj = { ...obj, [key]: "./" + value };
@@ -26,60 +28,36 @@ const MicroappModal = () => {
   }
   // console.log("app ", remoteApp);
   const { Component: RemoteComponent } = useFederatedComponent(obj);
-  const navigate = useNavigate();
   // console.log("RemoteComponent ", RemoteComponent);
   return (
     <div className="w-full h-full flex items-center justify-center ">
-      {/* <!-- Modal Container --> */}
-      <div className="bg-white rounded-lg shadow-lg w-full">
-        {/* <!-- Modal Header --> */}
-        <div className="flex w-full items-center border-b-2 mb-2 p-2">
-          <button
-            className="focus:outline-none bg-blue-500 text-white text-sm shadow px-2.5 py-1 rounded"
-            id="closeModal"
-            onClick={(e) => {
-              e.preventDefault();
-              //   setIsModal(false);
-              navigate(-1);
+      <div className="w-full">
+        <Suspense
+          fallback={
+            <div style={{ height: "300px" }}>
+              <div
+                style={{
+                  marginLeft: "45%",
+                  marginTop: "150px",
+                  fontSize: "45px",
+                  color: "#3dd3e0"
+                }}
+                className="loader-37"
+              ></div>
+            </div>
+          }
+        >
+          <div
+            style={{
+              backgroundColor: "#ffffff",
+              width: "100%",
+              overflow: "hidden",
+              minHeight: "50vh"
             }}
           >
-            Back
-          </button>
-          {localStorage.getItem('domain') && (
-            <p className="flex-1 w-full text-sm md:text-base text-black text-center">
-              {localStorage.getItem('domain') === "contracts" ? "Document":""}
-            </p>
-          )}
-        </div>
-        {/* <!-- Modal Body --> */}
-        <div className="w-full">
-          <Suspense
-            fallback={
-              <div style={{ height: "300px" }}>
-                <div
-                  style={{
-                    marginLeft: "45%",
-                    marginTop: "150px",
-                    fontSize: "45px",
-                    color: "#3dd3e0"
-                  }}
-                  className="loader-37"
-                ></div>
-              </div>
-            }
-          >
-            <div
-              style={{
-                backgroundColor: "#ffffff",
-                width: "100%",
-                overflow: "hidden",
-                minHeight: "50vh"
-              }}
-            >
-              {RemoteComponent && <RemoteComponent />}
-            </div>
-          </Suspense>
-        </div>
+            {RemoteComponent && <RemoteComponent />}
+          </div>
+        </Suspense>
       </div>
     </div>
   );

apps/OpenSign/src/components/TreeWidget.js

@@ -49,12 +49,9 @@ const TreeWidget = (props) => {
                 let data = JSON.parse(localStorage.getItem("Extand_Class"));
                 res = data[0];
               } else {
-                var emp = Parse.Object.extend(
-                  localStorage.getItem("extended_class")
-                );
-                var q = new Parse.Query(emp);
-                q.equalTo("UserId", currentUser);
-                res = await q.first();
+                res = await Parse.Cloud.run("getUserDetails", {
+                  email: currentUser.get("email")
+                });
                 if (res) res = res.toJSON();
               }
               if (res) {
@@ -79,12 +76,9 @@ const TreeWidget = (props) => {
                   let data = JSON.parse(localStorage.getItem("Extand_Class"));
                   res = data[0];
                 } else {
-                  emp = Parse.Object.extend(
-                    localStorage.getItem("extended_class")
-                  );
-                  q = new Parse.Query(emp);
-                  q.equalTo("UserId", currentUser);
-                  res = await q.first();
+                  res = await Parse.Cloud.run("getUserDetails", {
+                    email: currentUser.get("email")
+                  });
                   if (res) res = res.toJSON();
                 }
 
@@ -121,10 +115,15 @@ const TreeWidget = (props) => {
             let data = JSON.parse(localStorage.getItem("Extand_Class"));
             res = data[0];
           } else {
-            emp = Parse.Object.extend(localStorage.getItem("extended_class"));
-            q = new Parse.Query(emp);
-            q.equalTo("UserId", currentUser);
-            res = await q.first();
+            // emp = Parse.Object.extend(localStorage.getItem("extended_class"));
+            // q = new Parse.Query(emp);
+            // q.equalTo("UserId", currentUser);
+            // res = await q.first();
+            // if (res) res = res.toJSON();
+            const currentUser = Parse.User.current();
+            res = await Parse.Cloud.run("getUserDetails", {
+              email: currentUser.get("email")
+            });
             if (res) res = res.toJSON();
           }
 
@@ -532,7 +531,7 @@ const TreeWidget = (props) => {
       padding: 0
     },
     overlay: {
-      width:"100%",
+      width: "100%",
       backgroundColor: "rgba(0, 0, 0, 0.75)",
       zIndex: 50
     }

apps/OpenSign/src/components/dashboard/DashboardCard.js

@@ -1,7 +1,6 @@
 import React, { useState, useEffect } from "react";
 import axios from "axios";
 import Parse from "parse";
-import onSearchFilter from "../../constant/searchQuery";
 import getReplacedHashQuery from "../../constant/getReplacedHashQuery";
 import "../../styles/loader.css";
 import { useNavigate } from "react-router-dom";
@@ -35,14 +34,9 @@ const DashboardCard = (props) => {
           let data = JSON.parse(localStorage.getItem("Extand_Class"));
           res = data[0];
         } else {
-          var emp = Parse.Object.extend(localStorage.getItem("extended_class"));
-          var q = new Parse.Query(emp);
-          q.equalTo("UserId", {
-            __type: "Pointer",
-            className: "_User",
-            objectId: currentUser
+          res = await Parse.Cloud.run("getUserDetails", {
+            email: currentUser.get("email")
           });
-          res = await q.first();
           if (res) res = res.toJSON();
         }
         if (res) {
@@ -50,12 +44,7 @@ const DashboardCard = (props) => {
           var reg = /(\#.*?\#)/gi; // eslint-disable-line
           var str = props.Data.query;
           var test = "";
-          if (str.includes("#filterCondition#")) {
-            str = str.replace(
-              "#filterCondition#",
-              onSearchFilter(props.DefaultQuery)
-            );
-          }
+
           if (props.Data.extendkey) {
             let a = props.Data.extendkey.split(".");
             if (a.length > 0) {
@@ -110,13 +99,10 @@ const DashboardCard = (props) => {
             let data = JSON.parse(localStorage.getItem("Extand_Class"));
             resr = data[0];
           } else {
-            let emp = Parse.Object.extend(
-              localStorage.getItem("extended_class")
-            );
-            let q = new Parse.Query(emp);
-            q.equalTo("UserId", currentUser);
-            let t = await q.first();
-            resr = t.toJSON();
+            resr = await Parse.Cloud.run("getUserDetails", {
+              email: currentUser.get("email")
+            });
+            if (resr) resr = resr.toJSON();
           }
 
           let json = resr;
@@ -150,47 +136,65 @@ const DashboardCard = (props) => {
           "X-Parse-Application-Id": parseAppId,
           "X-Parse-Session-Token": localStorage.getItem("accesstoken")
         };
-        await axios.get(url, { headers: headers }).then((res) => {
-          if (res.data.results.length > 0) {
-            setLoading(false);
-            if (props.Data.key !== "count") {
-              setresponse(res.data.results[0][props.Data.key]);
-            } else {
-              if (props.Label === "Need your Signature") {
-                const listData = res.data?.results.filter(
-                  (x) => x.Signers.length > 0
+        // handle need your sign report count
+        if (props.Data.Redirect_id === "4Hhwbp482K") {
+          const params = {
+            reportId: props.Data.Redirect_id,
+            skip: 0,
+            limit: 200
+          };
+          const url = `${parseBaseUrl}/functions/getReport`;
+          await axios
+            .post(url, params, {
+              headers: {
+                "Content-Type": "application/json",
+                "X-Parse-Application-Id": parseAppId,
+                sessiontoken: localStorage.getItem("accesstoken")
+              }
+            })
+            .then((res) => {
+              const listData = res.data?.result.filter(
+                (x) => x.Signers.length > 0
+              );
+              let arr = [];
+              for (const obj of listData) {
+                const isSigner = obj.Signers.some(
+                  (item) => item.UserId.objectId === currentUser.id
                 );
-                let arr = [];
-                for (const obj of listData) {
-                  const isSigner = obj.Signers.some(
-                    (item) => item.UserId.objectId === currentUser.id
-                  );
-                  if (isSigner) {
-                    let isRecord;
-                    if (obj?.AuditTrail && obj?.AuditTrail.length > 0) {
-                      isRecord = obj?.AuditTrail.some(
-                        (item) =>
-                          item?.UserPtr?.UserId?.objectId === currentUser.id &&
-                          item.Activity === "Signed"
-                      );
-                    } else {
-                      isRecord = false;
-                    }
-                    if (isRecord === false) {
-                      arr.push(obj);
-                    }
+                if (isSigner) {
+                  let isRecord;
+                  if (obj?.AuditTrail && obj?.AuditTrail.length > 0) {
+                    isRecord = obj?.AuditTrail.some(
+                      (item) =>
+                        item?.UserPtr?.UserId?.objectId === currentUser.id &&
+                        item.Activity === "Signed"
+                    );
+                  } else {
+                    isRecord = false;
+                  }
+                  if (isRecord === false) {
+                    arr.push(obj);
                   }
                 }
-                setresponse(arr.length);
+              }
+              setresponse(arr.length);
+              setLoading(false);
+            });
+        } else {
+          await axios.get(url, { headers: headers }).then((res) => {
+            if (res.data.results.length > 0) {
+              setLoading(false);
+              if (props.Data.key !== "count") {
+                setresponse(res.data.results[0][props.Data.key]);
               } else {
                 setresponse(res.data[props.Data.key]);
               }
+            } else {
+              setresponse(0);
+              setLoading(false);
             }
-          } else {
-            setresponse(0);
-            setLoading(false);
-          }
-        });
+          });
+        }
       } catch (e) {
         console.error("Problem", e);
         setLoading(false);
@@ -227,13 +231,10 @@ const DashboardCard = (props) => {
               let data = JSON.parse(localStorage.getItem("Extand_Class"));
               res = data[0];
             } else {
-              var emp = Parse.Object.extend(
-                localStorage.getItem("extended_class")
-              );
-              var q = new Parse.Query(emp);
-              q.equalTo("UserId", currentUser);
-              let resr = await q.first();
-              res = resr.toJSON();
+              let resr = await Parse.Cloud.run("getUserDetails", {
+                email: currentUser.get("email")
+              });
+              if (res) res = resr.toJSON();
             }
 
             let json = res;

apps/OpenSign/src/components/dashboard/DashboardReport.js

@@ -9,39 +9,58 @@ function DashboardReport(props) {
   const [isLoader, setIsLoader] = useState(true);
   const [reportName, setReportName] = useState("");
   const [actions, setActions] = useState([]);
+  const [isNextRecord, setIsNextRecord] = useState(false);
+  const [isMoreDocs, setIsMoreDocs] = useState(true);
+  const abortController = new AbortController();
+  const docPerPage = 5;
+
   useEffect(() => {
     setReportName("");
     getReportData(props.Record.reportId);
+
+    // Function returned from useEffect is called on unmount
+    return () => {
+      setIsLoader(true);
+      setList([]);
+      setIsNextRecord(false);
+      // Here it'll abort the fetch
+      abortController.abort();
+    };
+    // eslint-disable-next-line
   }, [props.Record.reportId]);
 
-  const getReportData = async (id) => {
+  // below useEffect call when isNextRecord state is true and fetch next record
+  useEffect(() => {
+    if (isNextRecord) {
+      getReportData(props.Record.reportId, List.length, 200);
+    }
+    // eslint-disable-next-line
+  }, [isNextRecord]);
+
+  const getReportData = async (id, skipUserRecord = 0, limit = 200) => {
     setIsLoader(true);
     const json = reportJson(id);
     if (json) {
       setActions(json.actions);
       setReportName(json.reportName);
-      const { className, params, keys, orderBy } = json;
       Parse.serverURL = localStorage.getItem("BaseUrl12");
       Parse.initialize(localStorage.getItem("AppID12"));
-      const serverURL =
-        localStorage.getItem("BaseUrl12") + "classes/" + className;
+      const currentUser = Parse.User.current().id;
 
-      const strParams = JSON.stringify(params);
-      const strKeys = keys.join();
       const headers = {
         "Content-Type": "application/json",
         "X-Parse-Application-Id": localStorage.getItem("AppID12"),
-        "X-Parse-Session-Token": localStorage.getItem("accesstoken")
+        sessiontoken: localStorage.getItem("accesstoken")
       };
       try {
-        const url = `${serverURL}?where=${strParams}&keys=${strKeys}&order=${orderBy}&include=AuditTrail.UserPtr`;
-        const res = await axios.get(url, { headers: headers });
-        // console.log("res ", res.data?.results);
+        const params = { reportId: id, skip: skipUserRecord, limit: limit };
+        const url = `${localStorage.getItem("BaseUrl12")}/functions/getReport`;
+        const res = await axios.post(url, params, {
+          headers: headers,
+          signal: abortController.signal // is used to cancel fetch query
+        });
         if (id === "5Go51Q7T8r") {
-          const currentUser = Parse.User.current().id;
-          const listData = res.data?.results.filter(
-            (x) => x.Signers.length > 0
-          );
+          const listData = res.data?.result.filter((x) => x.Signers.length > 0);
           let arr = [];
           for (const obj of listData) {
             const isSigner = obj.Signers.some(
@@ -63,14 +82,34 @@ function DashboardReport(props) {
               }
             }
           }
-          setList(arr);
+          if (arr.length === docPerPage) {
+            setIsMoreDocs(true);
+          } else {
+            setIsMoreDocs(false);
+          }
+          setList((prevRecord) =>
+            prevRecord.length > 0 ? [...prevRecord, ...arr] : arr
+          );
         } else {
-          setList(res.data?.results);
+          if (res.data.result.length === docPerPage) {
+            setIsMoreDocs(true);
+          } else {
+            setIsMoreDocs(false);
+          }
+          setIsNextRecord(false);
+          setList((prevRecord) =>
+            prevRecord.length > 0
+              ? [...prevRecord, ...res.data.result]
+              : res.data.result
+          );
         }
         setIsLoader(false);
       } catch (err) {
-        console.log("err ", err);
-        setIsLoader(false);
+        const isCancel = axios.isCancel(err);
+        if (!isCancel) {
+          console.log("err ", err);
+          setIsLoader(false);
+        }
       }
     } else {
       setIsLoader(false);
@@ -101,8 +140,10 @@ function DashboardReport(props) {
             <ReportTable
               ReportName={reportName}
               List={List}
-              act={"Sign"}
               actions={actions}
+              setIsNextRecord={setIsNextRecord}
+              isMoreDocs={isMoreDocs}
+              docPerPage={docPerPage}
             />
           ) : (
             <div className="flex items-center justify-center h-[100px] w-full bg-white rounded">

apps/OpenSign/src/components/dashboard/GetDashboard.js

@@ -1,5 +1,4 @@
-import React, { useState, Suspense, lazy } from "react";
-import moment from "moment";
+import React, { Suspense, lazy } from "react";
 import ErrorBoundary from "../ErrorBoundary";
 
 const DashboardCard = lazy(() => import("./DashboardCard"));
@@ -7,258 +6,6 @@ const DashboardCard = lazy(() => import("./DashboardCard"));
 const DashboardReport = lazy(() => import("./DashboardReport"));
 
 const GetDashboard = (props) => {
-  const [filter, setfilter] = useState("");
-  const [option, setoption] = useState("");
-
-  const onSearchFilter = (e) => {
-    let _search = e.target.value;
-    localStorage.setItem("DashboardDefaultFilter", _search);
-    switch (_search) {
-      case "Today": {
-        let d = new Date();
-        let formDate = new Date(
-          Date.UTC(d.getFullYear(), d.getMonth(), d.getDate(), 0, 0, 0)
-        ).toISOString();
-        let Todate = new Date(
-          Date.UTC(d.getFullYear(), d.getMonth(), d.getDate(), 23, 59, 59)
-        ).toISOString();
-        let Query = `'$gte':'${formDate}','$lte':'${Todate}'`;
-        setfilter(Query);
-        setoption(_search);
-        break;
-      }
-      case "Yesterday": {
-        let d1 = new Date();
-        d1.setDate(d1.getDate() - 1);
-        let yesFrDate = new Date(
-          Date.UTC(d1.getFullYear(), d1.getMonth(), d1.getDate(), 0, 0, 0)
-        ).toISOString();
-
-        let YesTodate = new Date(
-          Date.UTC(d1.getFullYear(), d1.getMonth(), d1.getDate(), 23, 59, 59)
-        ).toISOString();
-        let Query1 = `'$gte':'${yesFrDate}','$lte':'${YesTodate}'`;
-        setfilter(Query1);
-        setoption(_search);
-        break;
-      }
-      case "This week": {
-        let oneDay = 24 * 60 * 60 * 1000;
-        let curr = new Date(); // get current date
-        let first = curr.getDate() - curr.getDay(); // First day is the day of the month - the day of the week
-
-        let firstday = new Date(
-          new Date(
-            Date.UTC(
-              curr.getFullYear(),
-              curr.getMonth(),
-              curr.getDate(),
-              0,
-              0,
-              0
-            )
-          ).setDate(first)
-        ).toISOString();
-        let diffDays = Math.round(
-          Math.abs(
-            (new Date(
-              Date.UTC(
-                curr.getFullYear(),
-                curr.getMonth(),
-                curr.getDate(),
-                23,
-                59,
-                59
-              )
-            ) -
-              new Date(firstday)) /
-              oneDay
-          )
-        ); //Days since last week
-        let last = first + diffDays;
-        let lastday = new Date(
-          new Date(
-            Date.UTC(
-              curr.getFullYear(),
-              curr.getMonth(),
-              curr.getDate(),
-              23,
-              59,
-              59
-            )
-          ).setDate(last)
-        ).toISOString();
-        let Query2 = `'$gte':'${firstday}','$lte':'${lastday}'`;
-        setfilter(Query2);
-        setoption(_search);
-        break;
-      }
-      case "Last 7 days": {
-        let d7 = new Date();
-        let d7l = new Date();
-        d7.setDate(d7.getDate() - 7);
-        let l7t = new Date(
-          Date.UTC(d7l.getFullYear(), d7l.getMonth(), d7l.getDate(), 23, 59, 59)
-        ).toISOString();
-        let date7 = new Date(
-          Date.UTC(d7.getFullYear(), d7.getMonth(), d7.getDate(), 0, 0, 0)
-        ).toISOString();
-        let Query7 = `'$gte':'${date7}','$lte':'${l7t}'`;
-        setfilter(Query7);
-        setoption(_search);
-        break;
-      }
-      case "Last 14 days": {
-        let d14 = new Date();
-        let d14l = new Date();
-        let l14t = new Date(
-          Date.UTC(
-            d14l.getFullYear(),
-            d14l.getMonth(),
-            d14l.getDate(),
-            23,
-            59,
-            59
-          )
-        ).toISOString();
-        d14.setDate(d14.getDate() - 14);
-        let date14 = new Date(
-          Date.UTC(d14.getFullYear(), d14.getMonth(), d14.getDate(), 0, 0, 0)
-        ).toISOString();
-
-        let Query14 = `'$gte':'${date14}','$lte':'${l14t}'`;
-        setfilter(Query14);
-        setoption(_search);
-        break;
-      }
-      case "Last 30 days": {
-        let d30 = new Date();
-        let d30l = new Date();
-        let l30t = new Date(
-          Date.UTC(
-            d30l.getFullYear(),
-            d30l.getMonth(),
-            d30l.getDate(),
-            23,
-            59,
-            59
-          )
-        ).toISOString();
-        d30.setDate(d30.getDate() - 30);
-        let date30 = new Date(
-          Date.UTC(d30.getFullYear(), d30.getMonth(), d30.getDate(), 0, 0, 0)
-        ).toISOString();
-        let Query30 = `'$gte':'${date30}','$lte':'${l30t}'`;
-        setfilter(Query30);
-        setoption(_search);
-        break;
-      }
-      case "Last week": {
-        const from_date = moment().startOf("week").subtract(7, "days");
-        const to_date = moment().endOf("week").subtract(7, "days");
-        let Queryl = `'$gte':'${from_date.toISOString()}','$lte':'${to_date.toISOString()}'`;
-        setfilter(Queryl);
-        setoption(_search);
-        break;
-      }
-      case "This month": {
-        const tdate = new Date();
-        let tfirstDay = new Date(
-          tdate.getFullYear(),
-          tdate.getMonth(),
-          1
-        ).toISOString();
-        let tlastDay = new Date(
-          tdate.getFullYear(),
-          tdate.getMonth() + 1,
-          0
-        ).toISOString();
-        let Querylt = `'$gte':'${tfirstDay}','$lte':'${tlastDay}'`;
-        setfilter(Querylt);
-        setoption(_search);
-        break;
-      }
-      case "Last month": {
-        const ldate = new Date();
-        var lfirstDay = new Date(
-          ldate.getFullYear(),
-          ldate.getMonth() - 1,
-          2
-        ).toISOString();
-        var llastDay = new Date(
-          ldate.getFullYear(),
-          ldate.getMonth(),
-          1
-        ).toISOString();
-        let Queryltl = `'$gte':'${lfirstDay}','$lte':'${llastDay}'`;
-        setfilter(Queryltl);
-        setoption(_search);
-        break;
-      }
-      case "All": {
-        let fall = new Date(
-          new Date().getFullYear() - 100,
-          0,
-          1,
-          0,
-          0,
-          0
-        ).toISOString();
-        let fall_year = `'$gte':'${fall}'`;
-        setfilter(fall_year);
-        setoption(_search);
-        break;
-      }
-      case "This year": {
-        let fcy = new Date(
-          new Date().getFullYear(),
-          0,
-          1,
-          0,
-          0,
-          0
-        ).toISOString();
-        let lcy = new Date(
-          new Date().getFullYear(),
-          11,
-          31,
-          23,
-          59,
-          59
-        ).toISOString();
-        let cur_year = `'$gte':'${fcy}','$lte':'${lcy}'`;
-        setfilter(cur_year);
-        setoption(_search);
-        break;
-      }
-      case "Last year": {
-        let fly = new Date(
-          new Date().getFullYear() - 1,
-          0,
-          1,
-          0,
-          0,
-          0
-        ).toISOString();
-        let lly = new Date(
-          new Date().getFullYear() - 1,
-          11,
-          31,
-          23,
-          59,
-          59
-        ).toISOString();
-        let last_year = `'$gte':'${fly}','$lte':'${lly}'`;
-        setfilter(last_year);
-        setoption(_search);
-        break;
-      }
-      default: {
-        setoption(_search);
-        break;
-      }
-    }
-  };
   const renderSwitchWithTour = (col) => {
     switch (col.widget.type) {
       case "Card":
@@ -272,7 +19,6 @@ const GetDashboard = (props) => {
               <DashboardCard
                 Icon={col.widget.icon}
                 Label={col.widget.label}
-                Filter={filter}
                 Format={col.widget.format && col.widget.format}
                 Data={col.widget.data}
                 FilterData={col.widget.filter}
@@ -281,50 +27,12 @@ const GetDashboard = (props) => {
             </Suspense>
           </div>
         );
-      case "customeHtml":
-        return (
-          <div data-tut={col.widget.data.tourSection}>
-            <select
-              id="searchFiltr"
-              className="form-control"
-              value={
-                option ||
-                localStorage.getItem("DashboardDefaultFilter") ||
-                col.widget.data[0].default
-              }
-              onChange={onSearchFilter}
-            >
-              {col.widget.data[0].options.map((opt) => (
-                <option key={opt} value={opt}>
-                  {opt}
-                </option>
-              ))}
-            </select>
-
-            <br />
-          </div>
-        );
-
-      case "customeTag":
-        return (
-          <h3
-            data-tut={col.widget.data.tourSection}
-            style={{
-              marginBottom: "4px",
-              color: "currentColor",
-              marginLeft: "4px"
-            }}
-          >
-            {col.widget.label}
-          </h3>
-        );
       case "report": {
-        let _filter = `${col.widget.filterKey}:${filter}`;
         return (
           <div data-tut={col.widget.data.tourSection}>
             <Suspense fallback={<div>please wait</div>}>
               <div className="mb-4 md:mb-0">
-                <DashboardReport Filter={_filter} Record={col.widget} />
+                <DashboardReport Record={col.widget} />
               </div>
             </Suspense>
           </div>
@@ -346,7 +54,6 @@ const GetDashboard = (props) => {
               <DashboardCard
                 Icon={col.widget.icon}
                 Label={col.widget.label}
-                Filter={filter}
                 Format={col.widget.format && col.widget.format}
                 Data={col.widget.data}
                 FilterData={col.widget.filter}
@@ -355,48 +62,11 @@ const GetDashboard = (props) => {
             </Suspense>
           </div>
         );
-      case "customeHtml":
-        return (
-          <div>
-            <select
-              id="searchFiltr"
-              className="form-control"
-              value={
-                option ||
-                localStorage.getItem("DashboardDefaultFilter") ||
-                col.widget.data[0].default
-              }
-              onChange={onSearchFilter}
-            >
-              {col.widget.data[0].options.map((opt) => (
-                <option key={opt} value={opt}>
-                  {opt}
-                </option>
-              ))}
-            </select>
-
-            <br />
-          </div>
-        );
-
-      case "customeTag":
-        return (
-          <h3
-            style={{
-              marginBottom: "4px",
-              color: "currentColor",
-              marginLeft: "4px"
-            }}
-          >
-            {col.widget.label}
-          </h3>
-        );
       case "report": {
-        let _filter = `${col.widget.filterKey}:${filter}`;
         return (
           <Suspense fallback={<div>please wait</div>}>
             <div className="mb-4 md:mb-0">
-              <DashboardReport Filter={_filter} Record={col.widget} />
+              <DashboardReport Record={col.widget} />
             </div>
           </Suspense>
         );

apps/OpenSign/src/components/fields/FileUpload.js

@@ -1,8 +1,7 @@
 import React, { useState, useEffect } from "react";
 import { SaveFileSize } from "../../constant/saveFileSize";
-// import Parse from "parse";
-// import sanitizeFileName from "../../primitives/sanitizeFileName";
-import axios from "axios";
+import Parse from "parse";
+import sanitizeFileName from "../../primitives/sanitizeFileName";
 
 const FileUpload = (props) => {
   const [parseBaseUrl] = useState(localStorage.getItem("baseUrl"));
@@ -69,53 +68,44 @@ const FileUpload = (props) => {
   };
 
   const handleFileUpload = async (file) => {
+    Parse.serverURL = parseBaseUrl;
+    Parse.initialize(parseAppId);
     setfileload(true);
-    const file_url = parseBaseUrl.slice(0, -4);
-    const url = `${file_url}file_upload`;
-    const formData = new FormData();
-    formData.append("file", file);
-    const config = {
-      headers: {
-        "content-type": "multipart/form-data",
-        "X-Parse-Application-Id": parseAppId
-      },
-      onUploadProgress: function (progressEvent) {
-        var percentCompleted = Math.round(
-          (progressEvent.loaded * 100) / progressEvent.total
-        );
-        setpercentage(percentCompleted);
-      }
-    };
+    const size = file.size;
+    const fileName = file.name;
+    const name = sanitizeFileName(fileName);
+    const pdfFile = file;
+    const parseFile = new Parse.File(name, pdfFile);
 
     try {
-      await axios
-        .post(url, formData, config)
-        .then((res) => {
-          if (res.data.status === "Error") {
-            alert(res.data.message);
+      const response = await parseFile.save({
+        progress: (progressValue, loaded, total, { type }) => {
+          if (type === "upload" && progressValue !== null) {
+            const percentCompleted = Math.round((loaded * 100) / total);
+            // console.log("percentCompleted ", percentCompleted);
+            setpercentage(percentCompleted);
           }
-          setFileUpload(res.data.imageUrl);
-          props.onChange(res.data.imageUrl);
-          setfileload(false);
-          setpercentage(0);
+        }
+      });
 
-          if (res.data.imageUrl) {
-            SaveFileSize(file.size, res.data.imageUrl);
-            return res.data.imageUrl;
-          }
-        })
-        .catch((err) => {
-          alert(`${err.message}`);
-          setfileload(false);
-          setpercentage(0);
-        });
+      setFileUpload(response.url());
+      props.onChange(response.url());
+      setfileload(false);
+      // The response object will contain information about the uploaded file
+      // console.log("File uploaded:", response);
+
+      // You can access the URL of the uploaded file using response.url()
+      // console.log("File URL:", response.url());
+      if (response.url()) {
+        SaveFileSize(size, response.url());
+        return response.url();
+      }
     } catch (error) {
-      alert(error.message);
       setfileload(false);
       setpercentage(0);
+      console.error("Error uploading file:", error);
     }
   };
-
   let fileView =
     props.formData &&
     props.schema.uploadtype === "s3viajw" ? null : props.formData &&
@@ -124,7 +114,7 @@ const FileUpload = (props) => {
         <a
           href={props.formData}
           title={props.formData}
-          style={{ paddingBottom: "10px", color: "blue"}}
+          style={{ paddingBottom: "10px", color: "blue" }}
         >
           Download
         </a>

apps/OpenSign/src/components/fields/HiddenField.js

@@ -1,6 +1,6 @@
 import React, { Component } from "react";
 import Parse from "parse";
-import axios from "axios";
+// import axios from "axios";
 
 export class HiddenField extends Component {
   state = {
@@ -37,31 +37,46 @@ export class HiddenField extends Component {
           this.setState({ _fields: custome_Filed });
         } else {
           if (currentUser) {
-            let url = `${this.state.baseUrl}classes/${localStorage.getItem(
-              "extended_class"
-            )}?where={"UserId":{"__type":"Pointer","className":"_User","objectId":"${
-              currentUser.id
-            }"}}&keys=${this.props.schema.data.valueKey}`;
-            const headers = {
-              "Content-Type": "application/json",
-              "X-Parse-Application-Id": this.state.parseAppId
-            };
-            await axios.get(url, { headers: headers }).then((res) => {
-              let custome_Filed = "";
-              let _rdata = res.data.results;
-              let splitArray = this.props.schema.data.valueKey.split(".");
-              if (splitArray.length > 1) {
-                custome_Filed = _rdata[0][splitArray[0]][splitArray[1]];
-              } else {
-                console.log(_rdata[0][splitArray[0]]);
-                custome_Filed = _rdata[0][splitArray[0]];
-              }
-              this.setState({ _fields: custome_Filed });
+            // let url = `${this.state.baseUrl}classes/${localStorage.getItem(
+            //   "extended_class"
+            // )}?where={"UserId":{"__type":"Pointer","className":"_User","objectId":"${
+            //   currentUser.id
+            // }"}}&keys=${this.props.schema.data.valueKey}`;
+            // const headers = {
+            //   "Content-Type": "application/json",
+            //   "X-Parse-Application-Id": this.state.parseAppId
+            // };
+            // await axios.get(url, { headers: headers }).then((res) => {
+            //   let custome_Filed = "";
+            //   let _rdata = res.data.results;
+            //   let splitArray = this.props.schema.data.valueKey.split(".");
+            //   if (splitArray.length > 1) {
+            //     custome_Filed = _rdata[0][splitArray[0]][splitArray[1]];
+            //   } else {
+            //     console.log(_rdata[0][splitArray[0]]);
+            //     custome_Filed = _rdata[0][splitArray[0]];
+            //   }
+            //   this.setState({ _fields: custome_Filed });
+            // });
+
+            const res = await Parse.Cloud.run("getUserDetails", {
+              email: currentUser.get("email")
             });
+            let custome_Filed = "";
+            const result = res.toJSON();
+            let _rdata = [result];
+            let splitArray = this.props.schema.data.valueKey.split(".");
+            if (splitArray.length > 1) {
+              custome_Filed = _rdata[0][splitArray[0]][splitArray[1]];
+            } else {
+              console.log(_rdata[0][splitArray[0]]);
+              custome_Filed = _rdata[0][splitArray[0]];
+            }
+            this.setState({ _fields: custome_Filed });
           }
         }
       } catch (error) {
-        console.log('err', error)
+        console.log("err", error);
       }
     }
   };

apps/OpenSign/src/components/fields/Level1Dropdown.js

@@ -120,12 +120,10 @@ const Level1Dropdown = (props) => {
             let data = JSON.parse(localStorage.getItem("Extand_Class"));
             res = data[0];
           } else {
-            var emp = Parse.Object.extend(
-              localStorage.getItem("extended_class")
-            );
-            var q = new Parse.Query(emp);
-            q.equalTo("UserId", currentUser);
-            res = await q.first();
+            const currentUser = Parse.User.current();
+            res = await Parse.Cloud.run("getUserDetails", {
+              email: currentUser.get("email")
+            });
             if (res) res = res.toJSON();
           }
 
@@ -339,7 +337,7 @@ const Level1Dropdown = (props) => {
           x.className = x.className.replace("show", "");
         }, 5000);
       } catch (error) {
-        console.log("Err", error)
+        console.log("Err", error);
       }
     }
   };

apps/OpenSign/src/components/sidebar/Menu.js

@@ -0,0 +1,21 @@
+import React from "react";
+import { NavLink } from "react-router-dom";
+
+const Menu = ({ item, isOpen, closeSidebar }) => {
+    return (
+        <li key={item.title} role="none">
+            <NavLink
+                to={`/${item.pageType}/${item.objectId}`}
+                className="mx-auto flex items-center hover:bg-[#eef1f5] p-3 lg:p-4"
+                onClick={closeSidebar}
+                tabIndex={isOpen ? 0 : -1}
+                role="menuitem"
+            >
+                <i className={`${item.icon} text-[18px]`} aria-hidden="true"></i>
+                <span className="ml-3 lg:ml-4">{item.title}</span>
+            </NavLink>
+        </li>
+    )
+}
+
+export default Menu;

apps/OpenSign/src/components/sidebar/Sidebar.js

@@ -1,115 +1,77 @@
 import React, { useState, useEffect } from "react";
-import { Link, NavLink } from "react-router-dom";
+
+import Menu from './Menu';
 import Submenu from "./SubMenu";
-import dp from "../../assets/images/dp.png";
+import SocialMedia from './SocialMedia';
+
 import Parse from "parse";
+import dp from "../../assets/images/dp.png";
+
 const Sidebar = ({ isOpen, closeSidebar }) => {
+  const [menuList, setmenuList] = useState([]);
   let username = localStorage.getItem("username");
   const image = localStorage.getItem("profileImg") || dp;
   const tenantname = localStorage.getItem("TenantName");
-  const [menuList, setmenuList] = useState([]);
 
   useEffect(() => {
     if (localStorage.getItem("accesstoken")) {
       menuItem();
     }
   }, []);
+
   const menuItem = async () => {
     const parseBaseUrl = localStorage.getItem("baseUrl");
     const parseAppId = localStorage.getItem("parseAppId");
+
     try {
       Parse.serverURL = parseBaseUrl;
       Parse.initialize(parseAppId);
       var sideMenu = Parse.Object.extend("w_menu");
       var query = new Parse.Query(sideMenu);
       query.equalTo("objectId", localStorage.getItem("defaultmenuid"));
-   
+
       const results = await query.first();
       const resultjson = results.toJSON();
-      // console.log("resultjson ", resultjson);
       let result = resultjson;
       setmenuList(result.menuItems);
     } catch (e) {
       console.error("Problem", e);
     }
+
   };
 
   return (
-    <div
-      className={`${
-        isOpen ? "block" : "hidden"
-      } bg-white text-[#444] h-screen w-full md:w-[300px] overflow-y-auto transform transition-transform z-40 ${
-        isOpen ? "translate-x-0" : "-translate-x-full"
-      }`}
+    <aside
+      className={`${isOpen ? "block" : "hidden"
+        } bg-white text-[#444] h-screen w-full md:w-[300px] overflow-y-auto transform transition-transform z-40 ${isOpen ? "translate-x-0" : "-translate-x-full"
+        }`}
     >
       <div className="flex px-2 py-3 gap-2 items-center shadow-md">
         <div className="w-[75px] h-[75px] rounded-full ring-[2px] ring-offset-2 ring-gray-400 overflow-hidden">
-          <img className="w-full h-full object-contain" src={image} alt="img" />
+          <img className="w-full h-full object-cover" src={image} alt="Profile" />
         </div>
         <div>
-          <p className="text-[14px] font-bold">{username && username}</p>
-          <p
-            className={`text-[12px] ${tenantname && tenantname ? "mt-2" : ""}`}
-          >
-            {tenantname && tenantname}
+          <p className="text-[14px] font-bold">{username}</p>
+          <p className={`text-[12px] ${tenantname ? "mt-2" : ""}`}>
+            {tenantname}
           </p>
         </div>
       </div>
-      <ul className="text-sm">
-        {menuList.length > 0 && (
-          <>
-            {menuList.map((item) =>
-              !item.children ? (
-                <li key={item.title} onClick={() => closeSidebar()}>
-                  <Link
-                    className={`mx-auto flex items-center hover:bg-[#eef1f5] p-3 lg:p-4 hover:no-underline cursor-pointer`}
-                    to={`/${item.pageType}/${item.objectId}`}
-                  >
-                    <i className={item.icon + " text-[18px]"}></i>
-                    <span title={item.description} className="ml-3 lg:ml-4">
-                      {item.title}
-                    </span>
-                  </Link>
-                </li>
-              ) : (
-                <Submenu key={item.title} icon={item.icon} title={item.title}>
-                  {item.children.map((item) => (
-                    <li key={item.title} onClick={() => closeSidebar()} className="pl-6 md:pl-8 hover:bg-[#eef1f5] cursor-pointer">
-                      <Link
-                        className={`mx-auto flex items-center p-2 lg:p-3 hover:no-underline`}
-                        to={`/${item.pageType}/${item.objectId}`}
-                      >
-                        <i className={item.icon + " text-[18px]"}></i>
-                        <span title={item.description} className="ml-3 lg:ml-4">
-                          {item.title}
-                        </span>
-                      </Link>
-                    </li>
-                  ))}
-                </Submenu>
-              )
-            )}
-          </>
-        )}
-      </ul>
-      <div className="mt-4 flex justify-center items-center text-[25px] text-black gap-3">
-        <NavLink to="https://github.com/opensignlabs/opensign" target="_blank">
-          <i className="fa-brands fa-github"></i>
-        </NavLink>
-        <NavLink
-          to="https://www.linkedin.com/company/opensign%E2%84%A2/"
-          target="_blank"
-        >
-          <i className="fa-brands fa-linkedin"></i>
-        </NavLink>
-        <NavLink to="https://www.twitter.com/opensignlabs" target="_blank">
-          <i className="fa-brands fa-square-x-twitter"></i>
-        </NavLink>
-        <NavLink to="https://discord.com/invite/xe9TDuyAyj" target="_blank">
-          <i className="fa-brands fa-discord"></i>
-        </NavLink>
-      </div>
-    </div>
+      <nav aria-label="OpenSign Sidebar Navigation">
+        <ul className="text-sm" role="menubar" aria-label="OpenSign Sidebar Navigation">
+          {menuList.map((item) => (
+            !item.children ? (
+              <Menu key={item.title} item={item} isOpen={isOpen} closeSidebar={closeSidebar} />
+            ) : (
+              <Submenu key={item.title} item={item} closeSidebar={closeSidebar} />
+            )
+          ))}
+        </ul>
+      </nav>
+      <footer className="mt-4 flex justify-center items-center text-[25px] text-black gap-3">
+        <SocialMedia />
+      </footer>
+    </aside>
   );
 };
 

apps/OpenSign/src/components/sidebar/SocialMedia.js

@@ -0,0 +1,27 @@
+import React from "react";
+import { NavLink } from "react-router-dom";
+
+const SocialMedia = () => {
+    return (
+        <React.Fragment>
+            <NavLink to="https://github.com/opensignlabs/opensign" target="_blank" rel="noopener noreferrer">
+                <i aria-hidden="true" className="fa-brands fa-github"></i>
+                <span className="fa-sr-only">OpenSign&apos;s Github</span>
+            </NavLink>
+            <NavLink to="https://www.linkedin.com/company/opensign%E2%84%A2/" target="_blank" rel="noopener noreferrer">
+                <i aria-hidden="true" className="fa-brands fa-linkedin"></i>
+                <span className="fa-sr-only">OpenSign&apos;s LinkedIn</span>
+            </NavLink>
+            <NavLink to="https://www.twitter.com/opensignlabs" target="_blank" rel="noopener noreferrer">
+                <i aria-hidden="true" className="fa-brands fa-square-x-twitter"></i>
+                <span className="fa-sr-only">OpenSign&apos;s Twitter</span>
+            </NavLink>
+            <NavLink to="https://discord.com/invite/xe9TDuyAyj" target="_blank" rel="noopener noreferrer">
+                <i aria-hidden="true" className="fa-brands fa-discord"></i>
+                <span className="fa-sr-only">OpenSign&apos;s Discord</span>
+            </NavLink>
+        </React.Fragment>
+    )
+}
+
+export default SocialMedia;

apps/OpenSign/src/components/sidebar/SubMenu.js

@@ -1,30 +1,52 @@
 import React, { useState } from "react";
+import { NavLink } from "react-router-dom";
 
-const Submenu = ({ icon, title, children }) => {
-  const [isOpen, setIsOpen] = useState(false);
+const Submenu = ({ item, closeSidebar }) => {
+  const [submenuOpen, setSubmenuOpen] = useState(false);
+  const { title, icon, children } = item;
 
   const toggleSubmenu = () => {
-    setIsOpen(!isOpen);
+    setSubmenuOpen(!submenuOpen);
   };
 
   return (
-    <div>
+    <li role="none">
       <button
         onClick={toggleSubmenu}
-        className="w-full mx-auto flex items-center text-left text-[#444] p-3 lg:p-4 hover:bg-[#eef1f5] focus:outline-none"
+        className="w-full flex items-center text-left text-[#444] p-3 lg:p-4 hover:bg-[#eef1f5] focus:ring-2 focus:ring-blue-600"
+        aria-expanded={submenuOpen}
+        aria-haspopup="true"
+        aria-controls={`submenu-${title}`}
       >
-        <i className={icon + " text-[18px]"}></i>
+        <i className={`${icon} text-[18px]`}></i>
         <div className="flex justify-between items-center w-full">
           <span className="ml-3 lg:ml-4">{title}</span>
           <i
-            className={
-              isOpen ? "fa-solid fa-angle-down" : "fa-solid fa-angle-right"
-            }
+            className={`${submenuOpen ? "fa-solid fa-angle-down" : "fa-solid fa-angle-right"
+              }`}
+            aria-hidden="true"
           ></i>
         </div>
       </button>
-      {isOpen && <ul>{children}</ul>}
-    </div>
+      {submenuOpen && (
+        <ul id={`submenu-${title}`} role="menu" aria-label={`${title} submenu`}>
+          {children.map((childItem) => (
+            <li key={childItem.title} role="none">
+              <NavLink
+                to={`/${childItem.pageType}/${childItem.objectId}`}
+                className="block pl-6 md:pl-8 py-2 text-sm text-gray-700 hover:bg-blue-500 hover:text-white"
+                onClick={closeSidebar}
+                role="menuitem"
+                tabIndex={submenuOpen ? 0 : -1}
+              >
+                <i className={`${childItem.icon} text-[18px]`} aria-hidden="true"></i>
+                <span className="ml-3 lg:ml-4">{childItem.title}</span>
+              </NavLink>
+            </li>
+          ))}
+        </ul>
+      )}
+    </li>
   );
 };
 

apps/OpenSign/src/constant/searchQuery.js

@@ -1,210 +0,0 @@
-import moment from "moment";
-
-export default function onSearchFilter(_search) {
-  switch (_search) {
-    case "Today": {
-      let d = new Date();
-      let formDate = new Date(
-        Date.UTC(d.getFullYear(), d.getMonth(), d.getDate(), 0, 0, 0)
-      ).toISOString();
-      let Todate = new Date(
-        Date.UTC(d.getFullYear(), d.getMonth(), d.getDate(), 23, 59, 59)
-      ).toISOString();
-      let Query = `'$gte':'${formDate}','$lte':'${Todate}'`;
-      return Query;
-    }
-    case "Yesterday": {
-      let d1 = new Date();
-      d1.setDate(d1.getDate() - 1);
-      let yesFrDate = new Date(
-        Date.UTC(d1.getFullYear(), d1.getMonth(), d1.getDate(), 0, 0, 0)
-      ).toISOString();
-
-      let YesTodate = new Date(
-        Date.UTC(d1.getFullYear(), d1.getMonth(), d1.getDate(), 23, 59, 59)
-      ).toISOString();
-      let Query1 = `'$gte':'${yesFrDate}','$lte':'${YesTodate}'`;
-      return Query1;
-    }
-
-    case "This week": {
-      let oneDay = 24 * 60 * 60 * 1000;
-      let curr = new Date(); // get current date
-      let first = curr.getDate() - curr.getDay(); // First day is the day of the month - the day of the week
-
-      let firstday = new Date(
-        new Date(
-          Date.UTC(curr.getFullYear(), curr.getMonth(), curr.getDate(), 0, 0, 0)
-        ).setDate(first)
-      ).toISOString();
-      let diffDays = Math.round(
-        Math.abs(
-          (new Date(
-            Date.UTC(
-              curr.getFullYear(),
-              curr.getMonth(),
-              curr.getDate(),
-              23,
-              59,
-              59
-            )
-          ) -
-            new Date(firstday)) /
-            oneDay
-        )
-      ); //Days since last week
-      let last = first + diffDays;
-      let lastday = new Date(
-        new Date(
-          Date.UTC(
-            curr.getFullYear(),
-            curr.getMonth(),
-            curr.getDate(),
-            23,
-            59,
-            59
-          )
-        ).setDate(last)
-      ).toISOString();
-      let Query2 = `'$gte':'${firstday}','$lte':'${lastday}'`;
-      return Query2;
-    }
-
-    case "Last 7 days": {
-      let d7 = new Date();
-      let d7l = new Date();
-      d7.setDate(d7.getDate() - 7);
-      let l7t = new Date(
-        Date.UTC(d7l.getFullYear(), d7l.getMonth(), d7l.getDate(), 23, 59, 59)
-      ).toISOString();
-      let date7 = new Date(
-        Date.UTC(d7.getFullYear(), d7.getMonth(), d7.getDate(), 0, 0, 0)
-      ).toISOString();
-      let Query7 = `'$gte':'${date7}','$lte':'${l7t}'`;
-      return Query7;
-    }
-    case "Last 14 days": {
-      let d14 = new Date();
-      let d14l = new Date();
-      let l14t = new Date(
-        Date.UTC(
-          d14l.getFullYear(),
-          d14l.getMonth(),
-          d14l.getDate(),
-          23,
-          59,
-          59
-        )
-      ).toISOString();
-      d14.setDate(d14.getDate() - 14);
-      let date14 = new Date(
-        Date.UTC(d14.getFullYear(), d14.getMonth(), d14.getDate(), 0, 0, 0)
-      ).toISOString();
-
-      let Query14 = `'$gte':'${date14}','$lte':'${l14t}'`;
-      return Query14;
-    }
-
-    case "Last 30 days": {
-      let d30 = new Date();
-      let d30l = new Date();
-      let l30t = new Date(
-        Date.UTC(
-          d30l.getFullYear(),
-          d30l.getMonth(),
-          d30l.getDate(),
-          23,
-          59,
-          59
-        )
-      ).toISOString();
-      d30.setDate(d30.getDate() - 30);
-      let date30 = new Date(
-        Date.UTC(d30.getFullYear(), d30.getMonth(), d30.getDate(), 0, 0, 0)
-      ).toISOString();
-      return `'$gte':'${date30}','$lte':'${l30t}'`;
-    }
-    case "Last week": {
-      const from_date = moment().startOf("week").subtract(7, "days");
-      const to_date = moment().endOf("week").subtract(7, "days");
-      return `'$gte':'${from_date.toISOString()}','$lte':'${to_date.toISOString()}'`;
-    }
-    case "This month": {
-      var tdate = new Date();
-      var tfirstDay = new Date(
-        tdate.getFullYear(),
-        tdate.getMonth(),
-        1
-      ).toISOString();
-      var tlastDay = new Date(
-        tdate.getFullYear(),
-        tdate.getMonth() + 1,
-        0
-      ).toISOString();
-      let Querylt = `'$gte':'${tfirstDay}','$lte':'${tlastDay}'`;
-      return Querylt;
-    }
-    case "Last month": {
-      var ldate = new Date();
-      var lfirstDay = new Date(
-        ldate.getFullYear(),
-        ldate.getMonth() - 1,
-        2
-      ).toISOString();
-      var llastDay = new Date(
-        ldate.getFullYear(),
-        ldate.getMonth(),
-        1
-      ).toISOString();
-      let Queryltl = `'$gte':'${lfirstDay}','$lte':'${llastDay}'`;
-      return Queryltl;
-    }
-    case "All": {
-      let fall = new Date(
-        new Date().getFullYear() - 100,
-        0,
-        1,
-        0,
-        0,
-        0
-      ).toISOString();
-      let fall_year = `'$gte':'${fall}'`;
-      return fall_year;
-    }
-    case "This year": {
-      let fcy = new Date(new Date().getFullYear(), 0, 1, 0, 0, 0).toISOString();
-      let lcy = new Date(
-        new Date().getFullYear(),
-        11,
-        31,
-        23,
-        59,
-        59
-      ).toISOString();
-      let cur_year = `'$gte':'${fcy}','$lte':'${lcy}'`;
-      return cur_year;
-    }
-    case "Last year": {
-      let fly = new Date(
-        new Date().getFullYear() - 1,
-        0,
-        1,
-        0,
-        0,
-        0
-      ).toISOString();
-      let lly = new Date(
-        new Date().getFullYear() - 1,
-        11,
-        31,
-        23,
-        59,
-        59
-      ).toISOString();
-      let last_year = `'$gte':'${fly}','$lte':'${lly}'`;
-      return last_year;
-    }
-    default:
-      return "";
-  }
-}

apps/OpenSign/src/json/ReportJson.js

@@ -1,6 +1,4 @@
-import Parse from "parse";
 export default function reportJson(id) {
-  const currentUserId = Parse.User.current().id;
   // console.log("json ", json);
 
   switch (id) {
@@ -8,28 +6,6 @@ export default function reportJson(id) {
     case "ByHuevtCFY":
       return {
         reportName: "Draft Documents",
-        className: "contracts_Document",
-        params: {
-          Type: null,
-          $or: [
-            { Signers: null, SignedUrl: null },
-            { Signers: { $exists: true }, Placeholders: null }
-          ],
-          CreatedBy: {
-            __type: "Pointer",
-            className: "_User",
-            objectId: currentUserId
-          }
-        },
-        keys: [
-          "Name",
-          "Note",
-          "Folder.Name",
-          "URL",
-          "ExtUserPtr.Name",
-          "Signers.Name"
-        ],
-        orderBy: "-updatedAt",
         actions: [
           {
             btnLabel: "sign",
@@ -45,27 +21,6 @@ export default function reportJson(id) {
     case "4Hhwbp482K":
       return {
         reportName: "Need your sign",
-        className: "contracts_Document",
-        params: {
-          Type: { $ne: "Folder" },
-          IsCompleted: { $ne: true },
-          IsDeclined: { $ne: true },
-          ExpiryDate: {
-            $gt: { __type: "Date", iso: new Date().toISOString() }
-          },
-          Placeholders: { $ne: null }
-        },
-        keys: [
-          "Name",
-          "Note",
-          "Folder.Name",
-          "URL",
-          "ExtUserPtr.Name",
-          "Signers.Name",
-          "Signers.UserId",
-          "AuditTrail"
-        ],
-        orderBy: "-updatedAt",
         actions: [
           {
             btnLabel: "sign",
@@ -81,31 +36,6 @@ export default function reportJson(id) {
     case "1MwEuxLEkF":
       return {
         reportName: "In-progress documents",
-        className: "contracts_Document",
-        params: {
-          Type: { $ne: "Folder" },
-          Signers: { $ne: null },
-          Placeholders: { $ne: null },
-          IsCompleted: { $ne: true },
-          IsDeclined: { $ne: true },
-          CreatedBy: {
-            __type: "Pointer",
-            className: "_User",
-            objectId: currentUserId
-          },
-          ExpiryDate: {
-            $gt: { __type: "Date", iso: new Date().toISOString() }
-          }
-        },
-        keys: [
-          "Name",
-          "Note",
-          "Folder.Name",
-          "URL",
-          "ExtUserPtr.Name",
-          "Signers.Name"
-        ],
-        orderBy: "-updatedAt",
         actions: [
           {
             btnLabel: "View",
@@ -121,27 +51,6 @@ export default function reportJson(id) {
     case "kQUoW4hUXz":
       return {
         reportName: "Completed Documents",
-        className: "contracts_Document",
-        params: {
-          Type: null,
-          IsCompleted: true,
-          CreatedBy: {
-            __type: "Pointer",
-            className: "_User",
-            objectId: currentUserId
-          },
-          IsDeclined: { $ne: true }
-        },
-        keys: [
-          "Name",
-          "Note",
-          "Folder.Name",
-          "URL",
-          "ExtUserPtr.Name",
-          "Signers.Name",
-          "TimeToCompleteDays"
-        ],
-        orderBy: "-updatedAt",
         actions: [
           {
             btnLabel: "View",
@@ -153,63 +62,10 @@ export default function reportJson(id) {
           }
         ]
       };
-    // OpenSignDrive™ documents Drafts
-    case "VRFDmUmw5B":
-      return {
-        reportName: "OpenSignDrive™ Drafts",
-        className: "contracts_Document",
-        params: {
-          Type: "AIDoc",
-          $or: [
-            { Signers: null, SignedUrl: null },
-            { Signers: { $exists: true }, Placeholders: null }
-          ],
-          CreatedBy: {
-            __type: "Pointer",
-            className: "_User",
-            objectId: currentUserId
-          }
-        },
-        keys: [
-          "Name",
-          "Note",
-          "Folder.Name",
-          "URL",
-          "ExtUserPtr.Name",
-          "Signers.Name"
-        ],
-        orderBy: "-updatedAt",
-        actions: [
-          {
-            btnLabel: "edit",
-            btnColor: "#3ac9d6",
-            textColor: "white",
-            btnIcon: "fa fa-plus",
-            redirectUrl:
-              "remoteUrl=aHR0cHM6Ly9xaWstYWktb3JnLmdpdGh1Yi5pby9MZWdhR2VuaWUtTWljcm9hcHBWMi9yZW1vdGVFbnRyeS5qcw==&moduleToLoad=AppRoutes&remoteName=legageniemicroapp/legagenie"
-          }
-        ]
-      };
     //  declined documents report
     case "UPr2Fm5WY3":
       return {
         reportName: "Declined Documents",
-        className: "contracts_Document",
-        params: { Type: null, IsDeclined: true },
-        CreatedBy: {
-          __type: "Pointer",
-          className: "_User",
-          objectId: currentUserId
-        },
-        keys: [
-          "Name",
-          "Note",
-          "Folder.Name",
-          "URL",
-          "ExtUserPtr.Name",
-          "Signers.Name"
-        ],
-        orderBy: "-updatedAt",
         actions: [
           {
             btnLabel: "View",
@@ -225,39 +81,6 @@ export default function reportJson(id) {
     case "zNqBHXHsYH":
       return {
         reportName: "Expired Documents",
-        className: "contracts_Document",
-        params: {
-          IsCompleted: { $ne: true },
-          IsDeclined: { $ne: true },
-          Type: { $ne: "Folder" },
-          $and: [
-            {
-              $or: [
-                { Signers: { $ne: null }, SignedUrl: { $ne: null } },
-                { Placeholders: { $ne: null } }
-              ]
-            },
-            {
-              ExpiryDate: {
-                $lt: { __type: "Date", iso: new Date().toISOString() }
-              }
-            }
-          ],
-          CreatedBy: {
-            __type: "Pointer",
-            className: "_User",
-            objectId: currentUserId
-          }
-        },
-        keys: [
-          "Name",
-          "Note",
-          "Folder.Name",
-          "URL",
-          "ExtUserPtr.Name",
-          "Signers.Name"
-        ],
-        orderBy: "-updatedAt",
         actions: [
           {
             btnLabel: "View",
@@ -273,31 +96,6 @@ export default function reportJson(id) {
     case "d9k3UfYHBc":
       return {
         reportName: "Recently sent for signatures",
-        className: "contracts_Document",
-        params: {
-          Type: { $ne: "Folder" },
-          Signers: { $ne: null },
-          Placeholders: { $ne: null },
-          IsCompleted: { $ne: true },
-          IsDeclined: { $ne: true },
-          CreatedBy: {
-            __type: "Pointer",
-            className: "_User",
-            objectId: currentUserId
-          },
-          ExpiryDate: {
-            $gt: { __type: "Date", iso: new Date().toISOString() }
-          }
-        },
-        keys: [
-          "Name",
-          "Note",
-          "Folder.Name",
-          "URL",
-          "ExtUserPtr.Name",
-          "Signers.Name"
-        ],
-        orderBy: "-updatedAt",
         actions: [
           {
             btnLabel: "View",
@@ -313,27 +111,6 @@ export default function reportJson(id) {
     case "5Go51Q7T8r":
       return {
         reportName: "Recent signature requests",
-        className: "contracts_Document",
-        params: {
-          Type: { $ne: "Folder" },
-          IsCompleted: { $ne: true },
-          IsDeclined: { $ne: true },
-          ExpiryDate: {
-            $gt: { __type: "Date", iso: new Date().toISOString() }
-          },
-          Placeholders: { $ne: null }
-        },
-        keys: [
-          "Name",
-          "Note",
-          "Folder.Name",
-          "URL",
-          "ExtUserPtr.Name",
-          "Signers.Name",
-          "Signers.UserId",
-          "AuditTrail"
-        ],
-        orderBy: "-updatedAt",
         actions: [
           {
             btnLabel: "Sign",
@@ -349,28 +126,6 @@ export default function reportJson(id) {
     case "kC5mfynCi4":
       return {
         reportName: "Drafts",
-        className: "contracts_Document",
-        params: {
-          Type: null,
-          $or: [
-            { Signers: null, SignedUrl: null },
-            { Signers: { $exists: true }, Placeholders: null }
-          ],
-          CreatedBy: {
-            __type: "Pointer",
-            className: "_User",
-            objectId: currentUserId
-          }
-        },
-        keys: [
-          "Name",
-          "Note",
-          "Folder.Name",
-          "URL",
-          "ExtUserPtr.Name",
-          "Signers.Name"
-        ],
-        orderBy: "-updatedAt",
         actions: [
           {
             btnLabel: "sign",

apps/OpenSign/src/json/plansArr.json

@@ -6,6 +6,7 @@
         "subtitle": "Free for life One click install.",
         "btnText": "Visit github",
         "url": "https://github.com/opensignlabs/opensign",
+        "target": "_blank",
         "benefits": [
             "Sign Unlimited Documents",
             "S3 Doc Storage",
@@ -26,9 +27,10 @@
         "planName": "THANKS PLAN",
         "currency": "$",
         "price": "29.99",
-        "subtitle": "Use code 'FREEBETA' to get this for free(First 100 users)",
+        "subtitle": "Use code 'FREEBETA' to get this for free(First 1000 users)",
         "btnText": "Subscribe",
         "url": "https://subscriptions.zoho.in/subscribe/ef798486e6a0a11ea65f2bae8f2af901dbadf3175d495584fd25b9af5d2f2b9e/thanks",
+        "target": "_self",
         "benefits": [
             "Sign Unlimited Documents",
             "Unlimited Secure Doc Storage with OpenSignDrive",
@@ -50,6 +52,7 @@
         "subtitle": "Customization available Priority support.",
         "btnText": "Contact us",
         "url": "https://www.opensignlabs.com/contact-us",
+        "target": "_self",
         "benefits": [
             "All features",
             "Custom domain",

apps/OpenSign/src/layout/HomeLayout.js

@@ -6,7 +6,7 @@ import { useWindowSize } from "../hook/useWindowSize";
 import Tour from "reactour";
 import axios from "axios";
 import { useSelector } from "react-redux";
-
+import Parse from "parse";
 const HomeLayout = ({ children }) => {
   const { width } = useWindowSize();
   const [isOpen, setIsOpen] = useState(false);
@@ -124,20 +124,11 @@ const HomeLayout = ({ children }) => {
   };
 
   async function checkTourStatus() {
-    const serverUrl = localStorage.getItem("baseUrl");
-    const appId = localStorage.getItem("AppID12");
-    const extUserClass = localStorage.getItem("extended_class");
-    const json = JSON.parse(localStorage.getItem("Extand_Class"));
-    const extUserId = json && json.length > 0 && json[0].objectId;
-    // console.log("extUserId ", extUserId);
-    const res = await axios.get(
-      serverUrl + "classes/" + extUserClass + "/" + extUserId,
-      {
-        headers: {
-          "X-Parse-Application-Id": appId
-        }
-      }
-    );
+    const currentUser = Parse.User.current();
+    const cloudRes = await Parse.Cloud.run("getUserDetails", {
+      email: currentUser.get("email")
+    });
+    const res = { data: cloudRes.toJSON() };
     if (res.data && res.data.TourStatus && res.data.TourStatus.length > 0) {
       const tourStatus = res.data.TourStatus;
       // console.log("res ", res.data.TourStatus);

apps/OpenSign/src/primitives/GetReportDisplay.js

@@ -1,9 +1,37 @@
-import React from "react";
+import React, { useState, useEffect, useMemo } from "react";
 import pad from "../assets/images/pad.svg";
 import { useNavigate } from "react-router-dom";
 
-const ReportTable = ({ ReportName, List, actions }) => {
+const ReportTable = ({
+  ReportName,
+  List,
+  actions,
+  setIsNextRecord,
+  isMoreDocs,
+  docPerPage
+}) => {
   const navigate = useNavigate();
+  const [currentPage, setCurrentPage] = useState(1);
+  // const pageNumbers = [];
+
+  // For loop is used to calculate page numbers visible below table
+  // Initialize pageNumbers using useMemo to avoid unnecessary re-creation
+  const pageNumbers = useMemo(() => {
+    const calculatedPageNumbers = [];
+    for (let i = 1; i <= Math.ceil(List.length / docPerPage); i++) {
+      calculatedPageNumbers.push(i);
+    }
+    return calculatedPageNumbers;
+  }, [List, docPerPage]);
+  //  below useEffect reset currenpage to 1 if user change route
+  useEffect(() => {
+    return () => setCurrentPage(1);
+  }, []);
+
+  // `formatRow` is used to show data in poper manner like
+  // if data is of array type then it will join array items with ","
+  // if data is of object type then it Name values will be show in row
+  // if no data available it will show hyphen "-"
   const formatRow = (row) => {
     if (Array.isArray(row)) {
       let updateArr = row.map((x) => x.Name);
@@ -14,24 +42,17 @@ const ReportTable = ({ ReportName, List, actions }) => {
       return "-";
     }
   };
+  // below useEffect is used to render next record if IsMoreDoc is true
+  // second last value of pageNumber array is same as currentPage
+  useEffect(() => {
+    if (isMoreDocs && pageNumbers[pageNumbers.length - 1] === currentPage) {
+      setIsNextRecord(true);
+    }
+  }, [isMoreDocs, pageNumbers, currentPage, setIsNextRecord]);
+
+  // `handlemicroapp` is used to open microapp
   const handlemicroapp = (item, url) => {
     localStorage.removeItem("rowlevel");
-    // const params = new URLSearchParams(url);
-    // let arr = [];
-    // for (let [key, value] of params.entries()) {
-    //   if (key === "remoteUrl") {
-    //     arr.push(
-    //       `${key}=${window.btoa(
-    //         window.location.origin + "/mfbuild/remoteEntry.js"
-    //       )}`
-    //     );
-    //   } else {
-    //     arr.push(`${key}=${value}`);
-    //   }
-    // }
-    // const remoteUrl = arr.join("&");
-    // console.log("arr", remoteUrl);
-
     navigate("/rpmf/" + url);
     localStorage.setItem("rowlevel", JSON.stringify(item));
     // localStorage.setItem("rowlevelMicro");
@@ -39,6 +60,17 @@ const ReportTable = ({ ReportName, List, actions }) => {
   const handlebtn = () => {
     console.log("clicked");
   };
+
+  // Get current list
+  const indexOfLastDoc = currentPage * docPerPage;
+  const indexOfFirstDoc = indexOfLastDoc - docPerPage;
+  // `currentLists` is total record render on current page
+  const currentLists = List.slice(indexOfFirstDoc, indexOfLastDoc);
+
+  // Change page
+  const paginateFront = () => setCurrentPage(currentPage + 1);
+  const paginateBack = () => setCurrentPage(currentPage - 1);
+
   return (
     <div className="p-2 overflow-x-scroll w-full bg-white rounded-md">
       <h2 className="text-[23px] font-light my-2">{ReportName}</h2>
@@ -60,8 +92,8 @@ const ReportTable = ({ ReportName, List, actions }) => {
         <tbody className="text-[12px]">
           {List?.length > 0 ? (
             <>
-              {List.map((item, index) => (
-                <tr className="border-t-[1px]" key={index}>
+              {currentLists.map((item, index) => (
+                <tr className="border-y-[1px]" key={index}>
                   <td className="px-4 py-2">{index + 1}</td>
                   <td className="px-4 py-2 font-semibold">{item?.Name} </td>
                   <td className="px-4 py-2">{item?.Note || "-"}</td>
@@ -121,8 +153,46 @@ const ReportTable = ({ ReportName, List, actions }) => {
           )}
         </tbody>
       </table>
+      <div className="flex flex-wrap items-center gap-2 p-2 ">
+        {List.length > docPerPage && (
+          <>
+            {currentPage > 1 && (
+              <button
+                onClick={() => paginateBack()}
+                className="bg-blue-400 text-white rounded px-3 py-2 focus:outline-none"
+              >
+                Prev
+              </button>
+            )}
+          </>
+        )}
+        {pageNumbers.map((x) => (
+          <button
+            key={x}
+            onClick={() => setCurrentPage(x)}
+            className=" bg-sky-400 text-white rounded px-3 py-2 focus:outline-none"
+          >
+            {x}
+          </button>
+        ))}
+        {isMoreDocs && (
+          <button className="text-black rounded px-1 py-2">...</button>
+        )}
+        {List.length > docPerPage && (
+          <>
+            {pageNumbers.includes(currentPage + 1) && (
+              <button
+                onClick={() => paginateFront()}
+                className="bg-blue-400 text-white rounded px-3 py-2 focus:outline-none"
+              >
+                Next
+              </button>
+            )}
+          </>
+        )}
+      </div>
       {List?.length <= 0 && (
-        <div className="flex flex-col items-center justify-center w-full bg-white roundedm py-4">
+        <div className="flex flex-col items-center justify-center w-full bg-white rounded py-4">
           <div className="w-[60px] h-[60px] overflow-hidden">
             <img className="w-full h-full object-contain" src={pad} alt="img" />
           </div>

apps/OpenSign/src/redux/actions/index.js

@@ -11,7 +11,8 @@ export const fetchAppInfo = (str, burl, app_id) => async (dispatch) => {
   let _base = ""; // Define _base here and initialize it to an empty string
   if (response && response.baseurl) {
     _base = response.baseurl.charAt(response.baseurl.length - 1);
-  }  localStorage.removeItem("baseUrl");
+  }
+  localStorage.removeItem("baseUrl");
   localStorage.setItem("_appName", response.appname);
   localStorage.setItem("_app_objectId", response.objectId);
   if (_base === "/") {
@@ -120,16 +121,11 @@ export const login = (username, password) => async (dispatch) => {
               localStorage.setItem("_user_role", _role);
             }
             try {
-              const tour = Parse.Object.extend(
-                localStorage.getItem("extended_class")
-              );
-              let _tour = new Parse.Query(tour);
-              _tour.equalTo("UserId", {
-                __type: "Pointer",
-                className: "_User",
-                objectId: resultjson.objectId
-              });
-              await _tour.first().then(
+              const currentUser = Parse.User.current();
+              await Parse.Cloud.run("getUserDetails", {
+                email: currentUser.get("email")
+              })
+              .then(
                 (results) => {
                   let userinfo = results.toJSON();
                   if (userinfo.TenantId) {
@@ -142,7 +138,7 @@ export const login = (username, password) => async (dispatch) => {
                 }
               );
             } catch (error) {
-              console.log("err ", error)
+              console.log("err ", error);
             }
           }
         });

apps/OpenSign/src/routes/LoadMf.js

@@ -0,0 +1,84 @@
+import { Suspense } from "react";
+import { useParams } from "react-router-dom";
+import useFederatedComponent from "mf-cra";
+import React from "react";
+import Title from "../components/Title";
+function RemoteApp({ app }) {
+  // console.log("app ", app);
+  const { Component: RemoteComponent } = useFederatedComponent(app);
+  // console.log("RemoteComponent ", RemoteComponent);
+  return (
+    <>
+      <Title title={app.remoteName} />
+      <Suspense
+        fallback={
+          <div style={{ height: "300px" }}>
+            <div
+              style={{
+                marginLeft: "45%",
+                marginTop: "150px",
+                fontSize: "45px",
+                color: "#3dd3e0"
+              }}
+              className="loader-37"
+            ></div>
+          </div>
+        }
+      >
+        <div
+          style={{
+            boxShadow: "0 1px 3px 0 rgba(0, 0, 0, 0.33)",
+            backgroundColor: "#ffffff",
+            width: "100%",
+            overflow: "hidden",
+            borderRadius: 3,
+            minHeight: "70vh"
+          }}
+        >
+          {RemoteComponent && <RemoteComponent />}
+        </div>
+      </Suspense>
+    </>
+  );
+}
+function checkObjectProperties(obj) {
+  // Check if all three properties exist in the object
+  if (
+    obj &&
+    obj.remoteName !== undefined &&
+    obj.remoteUrl !== undefined &&
+    obj.moduleToLoad !== undefined
+  ) {
+    return true; // All properties are present
+  } else {
+    return false; // At least one property is missing
+  }
+}
+export default function RemoteAppContainer() {
+  const { remoteApp } = useParams();
+
+  const obj = {
+    remoteUrl: window.location.origin + "/mfbuild/remoteEntry.js",
+    moduleToLoad: "./AppRoutes",
+    remoteName: remoteApp
+  };
+  // console.log("obj ", obj);
+  const isMf = checkObjectProperties(obj);
+  if (isMf) {
+    const appToLoad = obj;
+    return <RemoteApp app={appToLoad} />;
+  } else {
+    return (
+      <div className="flex items-center justify-center h-screen w-full bg-white rounded">
+        <div className="text-center">
+          <h1 className="text-[60px] lg:text-[120px] font-semibold text-black">
+            404
+          </h1>
+          <p className="text-[30px] lg:text-[50px] text-black">
+            Page Not Found
+          </p>
+        </div>
+      </div>
+    );
+  }
+}

apps/OpenSign/src/routes/Pgsignup.js

@@ -67,9 +67,8 @@ const PgSignUp = (props) => {
         const userSettings = JSON.parse(localStorage.getItem("userSettings"));
         const extClass = userSettings[0].extended_class;
         // console.log("extClass ", extClass);
-        const checkUser = new Parse.Query(extClass);
-        checkUser.equalTo("Email", userDetails.email);
-        const res = await checkUser.first();
+        const params = { email: userDetails.email };
+        const res = await Parse.Cloud.run("getUserDetails", params);
         // console.log("res", res);
         if (res) {
           const checkUser = new Parse.Query(extClass);
@@ -152,6 +151,7 @@ const PgSignUp = (props) => {
       if (res) {
         const params = {
           userDetails: {
+            jobTitle: zohoRes.data.result.jobTitle,
             company: zohoRes.data.result.company,
             name: zohoRes.data.result.name,
             email: zohoRes.data.result.email,
@@ -279,13 +279,6 @@ const PgSignUp = (props) => {
                         ""
                       );
                       localStorage.setItem("_user_role", _role);
-
-                      if (element.enableCart) {
-                        localStorage.setItem("EnableCart", element.enableCart);
-                        props.setEnableCart(element.enableCart);
-                      } else {
-                        localStorage.removeItem("EnableCart");
-                      }
                       // Get TenentID from Extendend Class
                       localStorage.setItem(
                         "extended_class",
@@ -293,14 +286,12 @@ const PgSignUp = (props) => {
                       );
                       localStorage.setItem("userpointer", element.userpointer);
 
-                      const extendedClass = Parse.Object.extend(
-                        element.extended_class
-                      );
-                      let query = new Parse.Query(extendedClass);
-                      query.equalTo("UserId", Parse.User.current());
-                      query.include("TenantId");
-                      await query.find().then(
-                        (results) => {
+                      const currentUser = Parse.User.current();
+                      await Parse.Cloud.run("getUserDetails", {
+                        email: currentUser.get("email")
+                      }).then(
+                        (result) => {
+                          const results = [result];
                           let tenentInfo = [];
                           if (results) {
                             let extendedInfo_stringify =
@@ -415,7 +406,7 @@ const PgSignUp = (props) => {
               }
             })
             .catch((err) => {
-              console.log('err', err)
+              console.log("err", err);
               setIsLoader(false);
             });
         }
@@ -448,10 +439,10 @@ const PgSignUp = (props) => {
       ) : (
         <form id="signup" className="pgsignup-content" onSubmit={handleSubmit}>
           <div className="pgsignup-container">
-            <h1 className="text-4xl font-bold">Choose Password</h1>
+            <h1 className="text-2xl md:text-3xl font-bold">Choose Password</h1>
             <hr className="hrt" />
             <label htmlFor="password">
-              <b>Password</b>
+              <b className="text-[13px]">Password</b>
             </label>
             <input
               type="password"
@@ -464,7 +455,7 @@ const PgSignUp = (props) => {
             />
 
             <label htmlFor="confirmPassword">
-              <b>Confirm Password</b>
+              <b className="text-[13px]">Confirm Password</b>
             </label>
             <input
               type="password"

apps/OpenSign/src/routes/PlanSubscriptions.js

@@ -2,14 +2,14 @@ import React, { useState, useEffect } from "react";
 import { useNavigate } from "react-router";
 import { NavLink } from "react-router-dom";
 import checkmark from "../assets/images/checkmark.png";
-import plansArr from '../json/plansArr.json'
+import plansArr from "../json/plansArr.json";
 import Title from "../components/Title";
 const listItemStyle = {
-  paddingLeft: '20px', // Add padding to create space for the image
+  paddingLeft: "20px", // Add padding to create space for the image
   backgroundImage: `url(${checkmark})`, // Set your image as the list style image
-  backgroundPosition: 'left',
-  backgroundRepeat: 'no-repeat',
-  backgroundSize: '16px 16px', // Adjust the size of the image
+  backgroundPosition: "left",
+  backgroundRepeat: "no-repeat",
+  backgroundSize: "16px 16px" // Adjust the size of the image
 };
 
 const PlanSubscriptions = () => {
@@ -28,7 +28,12 @@ const PlanSubscriptions = () => {
       : "";
   const phone =
     userDetails && userDetails.phone ? "&mobile=" + userDetails.phone : "";
-  const details = "?" + name + email + company + phone;
+  const details =
+    "?shipping_country_code=US&billing_country_code=US&billing_state_code=CA&" +
+    name +
+    email +
+    company +
+    phone;
   useEffect(() => {
     if (localStorage.getItem("accesstoken")) {
       setIsLoader(false);
@@ -41,7 +46,7 @@ const PlanSubscriptions = () => {
 
   return (
     <>
-    <Title title={"Subscriptions"} />
+      <Title title={"Subscriptions"} />
       {isLoader ? (
         <div
           style={{
@@ -64,7 +69,7 @@ const PlanSubscriptions = () => {
           style={{
             backgroundColor: "white",
             overflowY: "auto",
-            maxHeight: "600px",
+            maxHeight: "100%",
             "--theme-color": "#7952b3",
             "--plan-width": 30
           }}
@@ -131,15 +136,13 @@ const PlanSubscriptions = () => {
                           <p>{item.subtitle}</p>
                         </div>
                       </div>
-                      <div className="bg-[#002862] w-full text-white py-2 rounded">
-                        <NavLink
-                          to={item.url + details}
-                          className="rounded uppercase hover:no-underline hover:text-white"
-                          target="_self"
-                        >
-                          {item.btnText}
-                        </NavLink>
-                      </div>
+                      <NavLink
+                        to={item.url + details}
+                        className="bg-[#002862] w-full text-white py-2 rounded uppercase hover:no-underline hover:text-white"
+                        target={item.target}
+                      >
+                        {item.btnText}
+                      </NavLink>
                     </div>
                     <hr className="w-full bg-gray-300 p-[.5px]" />
                     <ul className="mx-1 p-3 text-left break-words text-sm list-none">

apps/OpenSign/src/routes/RemoteApp.js

@@ -65,7 +65,9 @@ export default function RemoteAppContainer() {
     // console.log("value ", key + ":" + value);
 
     if (key === "remoteUrl") {
-      obj = { ...obj, [key]: atob(value) };
+      const url = window.location.origin + "/mfbuild/remoteEntry.js";
+      // console.log("atob(value) ", atob(value))
+      obj = { ...obj, [key]: url };
     } else {
       if (key === "moduleToLoad") {
         obj = { ...obj, [key]: "./" + value };

apps/OpenSign/src/routes/Report.js

@@ -12,39 +12,60 @@ const Report = () => {
   const [isLoader, setIsLoader] = useState(true);
   const [reportName, setReportName] = useState("");
   const [actions, setActions] = useState([]);
+  const [isNextRecord, setIsNextRecord] = useState(false);
+  const [isMoreDocs, setIsMoreDocs] = useState(true);
+  const abortController = new AbortController();
+  const docPerPage = 10;
+
+  // below useEffect is call when id param change
   useEffect(() => {
     setReportName("");
+    setList([]);
     getReportData();
+
+    // Function returned from useEffect is called on unmount
+    return () => {
+      setIsLoader(true);
+      setList([]);
+      setIsNextRecord(false);
+      // Here it'll abort the fetch
+      abortController.abort();
+    };
     // eslint-disable-next-line
   }, [id]);
 
-  const getReportData = async () => {
-    setIsLoader(true);
+  // below useEffect call when isNextRecord state is true and fetch next record
+  useEffect(() => {
+    if (isNextRecord) {
+      getReportData(List.length, 200);
+    }
+    // eslint-disable-next-line
+  }, [isNextRecord]);
+
+  const getReportData = async (skipUserRecord = 0, limit = 200) => {
+    // setIsLoader(true);
     const json = reportJson(id);
     if (json) {
       setActions(json.actions);
       setReportName(json.reportName);
-      const { className, params, keys, orderBy } = json;
       Parse.serverURL = localStorage.getItem("BaseUrl12");
       Parse.initialize(localStorage.getItem("AppID12"));
       const currentUser = Parse.User.current().id;
-      const serverURL =
-        localStorage.getItem("BaseUrl12") + "classes/" + className;
 
-      const strParams = JSON.stringify(params);
-      const strKeys = keys.join();
       const headers = {
         "Content-Type": "application/json",
         "X-Parse-Application-Id": localStorage.getItem("AppID12"),
-        "X-Parse-Session-Token": localStorage.getItem("accesstoken")
+        sessiontoken: localStorage.getItem("accesstoken")
       };
       try {
-        const url = `${serverURL}?where=${strParams}&keys=${strKeys}&order=${orderBy}&include=AuditTrail.UserPtr`;
-        const res = await axios.get(url, { headers: headers });
+        const params = { reportId: id, skip: skipUserRecord, limit: limit };
+        const url = `${localStorage.getItem("BaseUrl12")}/functions/getReport`;
+        const res = await axios.post(url, params, {
+          headers: headers,
+          signal: abortController.signal // is used to cancel fetch query
+        });
         if (id === "4Hhwbp482K") {
-          const listData = res.data?.results.filter(
-            (x) => x.Signers.length > 0
-          );
+          const listData = res.data?.result.filter((x) => x.Signers.length > 0);
           let arr = [];
           for (const obj of listData) {
             const isSigner = obj.Signers.some(
@@ -66,14 +87,34 @@ const Report = () => {
               }
             }
           }
-          setList(arr);
+          if (arr.length === docPerPage) {
+            setIsMoreDocs(true);
+          } else {
+            setIsMoreDocs(false);
+          }
+          setList((prevRecord) =>
+            prevRecord.length > 0 ? [...prevRecord, ...arr] : arr
+          );
         } else {
-          setList(res.data?.results);
+          if (res.data.result.length === docPerPage) {
+            setIsMoreDocs(true);
+          } else {
+            setIsMoreDocs(false);
+          }
+          setIsNextRecord(false);
+          setList((prevRecord) =>
+            prevRecord.length > 0
+              ? [...prevRecord, ...res.data.result]
+              : res.data.result
+          );
         }
         setIsLoader(false);
       } catch (err) {
-        console.log("err ", err);
-        setIsLoader(false);
+        const isCancel = axios.isCancel(err);
+        if (!isCancel) {
+          console.log("err ", err);
+          setIsLoader(false);
+        }
       }
     } else {
       setIsLoader(false);
@@ -106,6 +147,9 @@ const Report = () => {
               ReportName={reportName}
               List={List}
               actions={actions}
+              setIsNextRecord={setIsNextRecord}
+              isMoreDocs={isMoreDocs}
+              docPerPage={docPerPage}
             />
           ) : (
             <div className="flex items-center justify-center h-screen w-full bg-white rounded">

apps/OpenSign/src/routes/Signup.js

@@ -6,8 +6,10 @@ import Title from "../components/Title";
 import { fetchAppInfo, showTenantName } from "../redux/actions";
 import { useNavigate, NavLink } from "react-router-dom";
 import login_img from "../assets/images/login_img.svg";
+import { useWindowSize } from "../hook/useWindowSize";
 
 const Signup = (props) => {
+  const { width } = useWindowSize();
   const navigate = useNavigate();
   const [name, setName] = useState("");
   const [phone, setPhone] = useState("");
@@ -18,7 +20,6 @@ const Signup = (props) => {
   const [company, setCompany] = useState("");
   const [jobTitle, setJobTitle] = useState("");
   const [state, setState] = useState({
-    hideNav: "",
     loading: false,
     toastColor: "#5cb85c",
     toastDescription: ""
@@ -52,56 +53,61 @@ const Signup = (props) => {
       res
         .then(async (r) => {
           if (r) {
-            let roleurl = `${parseBaseUrl}functions/AddUserToRole`;
-            const headers = {
-              "Content-Type": "application/json",
-              "X-Parse-Application-Id": parseAppId,
-              sessionToken:
-                r.getSessionToken() || localStorage.getItem("accesstoken")
-            };
-            let body = {
-              appName: props.appInfo.appname,
-              roleName: props.appInfo.defaultRole,
-              userId: r.id
-            };
-            await axios.post(roleurl, body, { headers: headers });
-
             let roleData = props.appInfo.settings;
             if (roleData && roleData.length > 0) {
-              roleData.forEach((rld) => {
-                if (rld.role === props.appInfo.defaultRole) {
-                  const extCls = Parse.Object.extend(rld.extended_class);
-                  const newObj = new extCls();
-                  newObj.set("UserId", {
-                    __type: "Pointer",
-                    className: "_User",
-                    objectId: r.id
-                  });
-                  newObj.set("UserRole", props.appInfo.defaultRole);
-                  newObj.set("Email", email);
-                  newObj.set("Name", name);
-                  newObj.set("Phone", phone);
-                  newObj.set("Company", company);
-                  newObj.set("JobTitle", jobTitle);
-                  newObj
-                    .save()
-                    .then((ex) => {
-                      if (ex) {
-                        handleNavigation(r.getSessionToken());
-                      }
-                    })
-                    .catch((err) => {
-                      alert(err.message);
-                      setState({ loading: false });
-                    });
+              const params = {
+                userDetails: {
+                  jobTitle: jobTitle,
+                  company: company,
+                  name: name,
+                  email: email,
+                  phone: phone,
+                  role: props.appInfo.defaultRole
                 }
-              });
+              };
+              try {
+                const usersignup = await Parse.Cloud.run("usersignup", params);
+                if (usersignup) {
+                  handleNavigation(r.getSessionToken());
+                }
+              } catch (err) {
+                alert(err.message);
+                setState({ loading: false });
+              }
             }
           }
         })
-        .catch((err) => {
-          alert(err.message);
-          setState({ loading: false });
+        .catch(async (err) => {
+          if (err.code === 202) {
+            const params = { email: email };
+            const res = await Parse.Cloud.run("getUserDetails", params);
+            // console.log("Res ", res);
+            if (res) {
+              alert("User already exists with this username!");
+              setState({ loading: false });
+            } else {
+              let baseUrl = localStorage.getItem("BaseUrl12");
+              let parseAppId = localStorage.getItem("AppID12");
+              // console.log("state.email ", email);
+              try {
+                Parse.serverURL = baseUrl;
+                Parse.initialize(parseAppId);
+                await Parse.User.requestPasswordReset(email).then(
+                  async function (res1) {
+                    if (res1.data === undefined) {
+                      alert("Verification mail has been sent to your E-mail!");
+                    }
+                  }
+                );
+              } catch (err) {
+                console.log(err);
+              }
+              setState({ loading: false });
+            }
+          } else {
+            alert(err.message);
+            setState({ loading: false });
+          }
         });
     } catch (error) {
       console.log("err ", error);
@@ -179,13 +185,6 @@ const Signup = (props) => {
                         ""
                       );
                       localStorage.setItem("_user_role", _role);
-
-                      if (element.enableCart) {
-                        localStorage.setItem("EnableCart", element.enableCart);
-                        props.setEnableCart(element.enableCart);
-                      } else {
-                        localStorage.removeItem("EnableCart");
-                      }
                       // Get TenentID from Extendend Class
                       localStorage.setItem(
                         "extended_class",
@@ -193,15 +192,12 @@ const Signup = (props) => {
                       );
                       localStorage.setItem("userpointer", element.userpointer);
 
-                      const extendedClass = Parse.Object.extend(
-                        element.extended_class
-                      );
-                      let query = new Parse.Query(extendedClass);
-                      query.equalTo("UserId", Parse.User.current());
-                      query.include("TenantId");
-                      await query.find().then(
-                        (results) => {
+                      await Parse.Cloud.run("getUserDetails", {
+                        email: email
+                      }).then(
+                        (result) => {
                           let tenentInfo = [];
+                          const results = [result];
                           if (results) {
                             let extendedInfo_stringify =
                               JSON.stringify(results);
@@ -251,7 +247,7 @@ const Signup = (props) => {
                                 element.pageType
                               );
                               setState({ loading: false });
-                              navigate("/login");
+                              navigate("/");
                             } else {
                               extendedInfo.forEach((x) => {
                                 if (x.TenantId) {
@@ -289,7 +285,7 @@ const Signup = (props) => {
                               );
                               setState({ loading: false });
                               if (process.env.REACT_APP_ENABLE_SUBSCRIPTION) {
-                                navigate("/subscription");
+                                navigate(`/subscription`, { replace: true });
                               } else {
                                 alert("Registered user successfully");
                                 navigate(
@@ -307,7 +303,7 @@ const Signup = (props) => {
                             localStorage.setItem("pageType", element.pageType);
                             setState({ loading: false });
                             if (process.env.REACT_APP_ENABLE_SUBSCRIPTION) {
-                              navigate("/subscription");
+                              navigate(`/subscription`, { replace: true });
                             } else {
                               navigate(
                                 `/${element.pageType}/${element.pageId}`
@@ -392,24 +388,14 @@ const Signup = (props) => {
     }
   };
   useEffect(() => {
-    window.addEventListener("resize", resize);
     props.fetchAppInfo(
       localStorage.getItem("domain"),
       localStorage.getItem("BaseUrl12"),
       localStorage.getItem("AppID12")
     );
-    return () => {
-      window.removeEventListener("resize", resize);
-    };
     // eslint-disable-next-line
   }, []);
 
-  const resize = () => {
-    let currentHideNav = window.innerWidth <= 760;
-    if (currentHideNav !== state.hideNav) {
-      setState({ hideNav: currentHideNav });
-    }
-  };
   return (
     <div className="bg-white">
       {state.loading && (
@@ -443,17 +429,13 @@ const Signup = (props) => {
         <div>
           <div className="md:m-10 lg:m-16 md:p-4 lg:p-10 p-5 bg-[#ffffff] md:border-[1px] md:border-gray-400 ">
             <div className="w-[250px] h-[66px] inline-block">
-              {state.hideNav ? (
-                <img src={image} width="100%" alt="" />
-              ) : (
-                <img src={image} width="100%" alt="" />
-              )}
+              <img src={image} width="100%" alt="" />
             </div>
             <div className="grid grid-cols-1 md:grid-cols-2 gap-x-2">
               <div className="">
                 <form onSubmit={handleSubmit}>
                   <h2 className="text-[30px] mt-6">Create Account !</h2>
-                  <div className="shadow-md rounded my-4">
+                  <div className="outline outline-1 outline-slate-300/50 shadow-md rounded my-4">
                     <div className="px-6 py-4 text-xs">
                       <label className="block ">
                         Name{" "}
@@ -472,6 +454,7 @@ const Signup = (props) => {
                         <span style={{ color: "red", fontSize: 13 }}>*</span>
                       </label>
                       <input
+                        id="email"
                         type="text"
                         className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
                         value={email}
@@ -554,16 +537,16 @@ const Signup = (props) => {
                     <NavLink
                       className="rounded-sm cursor-pointer bg-white border-[1px] border-[#15b4e9] text-[#15b4e9] w-full py-3 shadow uppercase"
                       to="/"
-                      style={state.hideNav ? { textAlign: "center" } : {}}
+                      style={width < 768 ? { textAlign: "center" } : {}}
                     >
                       Login
                     </NavLink>
                   </div>
                 </form>
               </div>
-              {!state.hideNav && (
+              {width >= 768 && (
                 <div className="self-center">
-                  <div className="mx-auto md:w-[300px] lg:w-[500px]">
+                  <div className="mx-auto md:w-[300px] lg:w-[400px] xl:w-[500px]">
                     <img src={login_img} alt="bisec" width="100%" />
                   </div>
                 </div>

apps/OpenSign/src/routes/UserProfile.js

@@ -5,7 +5,7 @@ import { SaveFileSize } from "../constant/saveFileSize";
 import dp from "../assets/images/dp.png";
 import Title from "../components/Title";
 import sanitizeFileName from "../primitives/sanitizeFileName";
-
+import axios from "axios";
 function UserProfile() {
   const navigate = useNavigate();
   let UserProfile = JSON.parse(localStorage.getItem("UserInformation"));
@@ -16,6 +16,8 @@ function UserProfile() {
   const [Phone, SetPhone] = useState(UserProfile && UserProfile.phone);
   const [Image, setImage] = useState(localStorage.getItem("profileImg"));
   const [isLoader, setIsLoader] = useState(false);
+  const [percentage, setpercentage] = useState(0);
+
   Parse.serverURL = parseBaseUrl;
   Parse.initialize(parseAppId);
   const handleSubmit = async (e) => {
@@ -44,7 +46,7 @@ function UserProfile() {
               await updateExtUser({ Name: res.name, Phone: res.phone });
               alert("Profile updated successfully.");
               setEditMode(false);
-              navigate("/");
+              navigate("/dashboard/35KBoSgoAK");
             }
           },
           (error) => {
@@ -64,18 +66,24 @@ function UserProfile() {
     const extClass = localStorage.getItem("extended_class");
     const extData = JSON.parse(localStorage.getItem("Extand_Class"));
     const ExtUserId = extData[0].objectId;
-    // console.log("extData ", extData);
     // console.log("UserId ", ExtUserId);
+    const body = { Phone: obj.Phone, Name: obj.Name };
+    await axios.put(
+      parseBaseUrl + "classes/" + extClass + "/" + ExtUserId,
+      body,
+      {
+        headers: {
+          "Content-Type": "application/json",
+          "X-Parse-Application-Id": parseAppId,
+          "X-Parse-Session-Token": localStorage.getItem("accesstoken")
+        }
+      }
+    );
+    const res = await Parse.Cloud.run("getUserDetails", {
+      email: extData[0].Email
+    });
 
-    const extQuery = new Parse.Query(extClass);
-    const update = await extQuery.get(ExtUserId);
-    // console.log("update ", update);
-
-    update.set("Phone", obj.Phone);
-    update.set("Name", obj.Name);
-    const updateRes = await update.save();
-
-    const json = JSON.parse(JSON.stringify([updateRes]));
+    const json = JSON.parse(JSON.stringify([res]));
     const extRes = JSON.stringify(json);
 
     localStorage.setItem("Extand_Class", extRes);
@@ -96,7 +104,15 @@ function UserProfile() {
     const parseFile = new Parse.File(name, pdfFile);
 
     try {
-      const response = await parseFile.save();
+      const response = await parseFile.save({
+        progress: (progressValue, loaded, total, { type }) => {
+          if (type === "upload" && progressValue !== null) {
+            const percentCompleted = Math.round((loaded * 100) / total);
+            // console.log("percentCompleted ", percentCompleted);
+            setpercentage(percentCompleted);
+          }
+        }
+      });
       // // The response object will contain information about the uploaded file
       // console.log("File uploaded:", response);
 
@@ -105,6 +121,7 @@ function UserProfile() {
       if (response.url()) {
         setImage(response.url());
         localStorage.setItem("profileImg", response.url());
+        setpercentage(0);
         SaveFileSize(size, response.url());
         return response.url();
       }
@@ -154,14 +171,25 @@ function UserProfile() {
               <input
                 type="file"
                 className="max-w-[270px] text-sm py-1 px-2 mt-4 border-[1px] border-[#15b4e9] text-black rounded"
+                accept="image/png, image/gif, image/jpeg"
                 onChange={(e) => {
                   let files = e.target.files;
                   fileUpload(files[0]);
                 }}
               />
             )}
+            {percentage !== 0 && (
+              <div className="flex items-center gap-x-2">
+                <div className="h-2 rounded-full w-[200px] md:w-[400px] bg-gray-200">
+                  <div
+                    className="h-2 rounded-full bg-blue-500"
+                    style={{ width: `${percentage}%` }}
+                  ></div>
+                </div>
+                <span className="text-black text-sm">{percentage}%</span>
+              </div>
+            )}
             <div className="text-base font-semibold pt-4">
-              {" "}
               {localStorage.getItem("_user_role")}
             </div>
           </div>
@@ -214,26 +242,11 @@ function UserProfile() {
             </li>
           </ul>
           <div className="flex justify-center pb-4">
-            <button
-              type="button"
-              onClick={() => {
-                if (editmode) {
-                  setEditMode(false);
-                } else {
-                  navigate("/changepassword");
-                }
-              }}
-              className={`rounded shadow text-white bg-[#3598dc] mr-4 ${
-                editmode ? "px-4 py-2 " : "p-2"
-              }`}
-            >
-              {editmode ? "Cancel" : "Change Password"}
-            </button>
             {editmode ? (
               <button
                 type="button"
                 onClick={handleSubmit}
-                className="rounded  bg-white border-[1px] border-[#15b4e9] text-[#15b4e9] px-4 py-2"
+                className="rounded  bg-white border-[1px] border-[#15b4e9] text-[#15b4e9] px-4 py-2 mr-4"
               >
                 Save
               </button>
@@ -243,11 +256,26 @@ function UserProfile() {
                 onClick={() => {
                   setEditMode(true);
                 }}
-                className="rounded shadow text-white bg-[#e7505a] px-4 py-2"
+                className="rounded shadow text-white bg-[#e7505a] px-4 py-2 mr-4"
               >
                 Edit
               </button>
             )}
+            <button
+              type="button"
+              onClick={() => {
+                if (editmode) {
+                  setEditMode(false);
+                } else {
+                  navigate("/changepassword");
+                }
+              }}
+              className={`rounded shadow text-white bg-[#3598dc]  ${
+                editmode ? "px-4 py-2 " : "p-2"
+              }`}
+            >
+              {editmode ? "Cancel" : "Change Password"}
+            </button>
           </div>
         </div>
       )}

apps/OpenSign/src/styles/pgsignup.css

@@ -1,12 +1,14 @@
 /* Full-width input fields */
 .inputt {
     width: 100%;
-    padding: 15px;
-    margin: 5px 0 22px 0;
+    padding: 8px;
+    margin-bottom: 10px;
+    /* margin: 5px 0 14px 0; */
     display: inline-block;
     border: none;
     background: #f1f1f1;
     color: black;
+    font-size: 12px;
 }
 
 /* Add a background color when the inputs get focus */
@@ -18,11 +20,12 @@
 
 .confirmInputt {
     width: 100%;
-    padding: 15px;
-    margin: 5px 0 1px 0;
+    padding: 8px;
+    /* margin: 5px 0 14px 0; */
     display: inline-block;
     background: #f1f1f1;
     color: black;
+    font-size: 12px;
 }
 
 .inputt::placeholder,
@@ -42,11 +45,10 @@
 .signupbtn {
     background-color: #15b4e9;
     color: white;
-    padding: 14px 20px;
+    padding: 12px 12px;
     margin: 8px 0;
     border: none;
     cursor: pointer;
-    width: 100%;
     opacity: 0.9;
     float: left;
     width: 50%;
@@ -87,7 +89,7 @@
     margin: 5% auto 15% auto;
     /* 5% from the top, 15% from the bottom and centered */
     border: 1px solid #888;
-    width: 80%;
+    width: 50%;
     /* Could be more or less, depending on screen size */
 }
 
@@ -111,8 +113,26 @@
 }
 
 /* Change styles for cancel button and signup button on extra small screens */
-@media screen and (max-width: 300px) {
+@media screen and (max-width: 768px) {
+
+    /* pgsignup Content/Box */
+    .pgsignup-content {
+        background-color: #fefefe;
+        margin: 5% auto 15% auto;
+        /* 5% from the top, 15% from the bottom and centered */
+        border: 1px solid #888;
+        width: 90%;
+        /* Could be more or less, depending on screen size */
+    }
+
     .signupbtn {
         width: 100%;
+        font-size: 16px;
     }
-}
+
+    /* Style the horizontal ruler */
+    .hrt {
+        border: 1px solid #f1f1f1;
+        margin-bottom: 16px;
+    }
+}

apps/OpenSignServer/Dockerfile

@@ -5,7 +5,7 @@ FROM node:16
 WORKDIR /usr/src/app
 
 # Copy package.json and package-lock.json first to leverage Docker cache
-COPY apps/OpenSignServer/package*.json ./
+COPY ./package*.json ./
 
 # Install application dependencies
 RUN npm install
@@ -14,7 +14,7 @@ RUN npm install
 # RUN apk add --no-cache make gcc g++ python3
 
 # Copy the current directory contents into the container
-COPY apps/OpenSignServer/ .
+COPY ./ .
 
 # Make port 8080 available to the world outside this container
 EXPOSE 8080
@@ -24,4 +24,4 @@ EXPOSE 8080
 # ENV DATABASE_URL mongodb://db:27017
 
 # Run the application
-CMD ["npm", "start"]
+ENTRYPOINT npm start

apps/OpenSignServer/cloud/customRoute/uploadFile.js

@@ -4,6 +4,12 @@ import multerS3 from 'multer-s3';
 import aws from 'aws-sdk';
 import dotenv from 'dotenv';
 dotenv.config();
+
+function sanitizeFileName(fileName) {
+  // Remove spaces and invalid characters
+  return fileName.replace(/[^a-zA-Z0-9._-]/g, '');
+}
+
 async function uploadFile(req, res) {
   try {
     //--size extended to 100 mb
@@ -50,16 +56,28 @@ async function uploadFile(req, res) {
       region: process.env.DO_REGION,
     });
 
-    // const s3 = new aws.S3();
-    const upload = multer({
-      fileFilter: function (req, file, cb) {
-        if (accepted_extensions.some(ext => file.originalname.toLowerCase().endsWith('.' + ext))) {
-          return cb(null, true);
+    const parseBaseUrl = process.env.SERVER_URL;
+    const parseAppId = process.env.APP_ID;
+
+    if (process.env.USE_LOCAL == "TRUE") {
+      var fileStorage = multer.diskStorage({
+        destination: function(req, file, cb) {
+          cb(null, "files/files");
+        },
+        metadata: function (req, file, cb) {
+          cb(null, { fieldName: 'OPENSIGN_METADATA' });
+        },
+        filename: function(req, file, cb) {
+          let filename = file.originalname;
+          let newFileName = filename.split('.')[0];
+          let extension = filename.split('.')[1];
+          newFileName = sanitizeFileName(newFileName + '_' + new Date().toISOString() + '.' + extension)
+          console.log(newFileName);
+          cb(null, newFileName);
         }
-        // otherwise, return error
-        return cb('Only ' + accepted_extensions.join(', ') + ' files are allowed!');
-      },
-      storage: multerS3({
+      });
+    } else {
+      var fileStorage = multerS3({
         acl: 'public-read',
         s3,
         bucket: DO_SPACE,
@@ -69,14 +87,25 @@ async function uploadFile(req, res) {
         key: function (req, file, cb) {
           //console.log(file);
           let filename = file.originalname;
-          let filenam = filename.split('.')[0];
+          let newFileName = filename.split('.')[0];
           let extension = filename.split('.')[1];
-          filenam = filenam + '_' + new Date().toISOString() + '.' + extension;
-          console.log(filenam);
-          cb(null, filenam);
-        },
-      }),
+          newFileName = sanitizeFileName(newFileName + '_' + new Date().toISOString() + '.' + extension)
+          console.log(newFileName);
+          cb(null, newFileName);
+        }
+      });
+    }
 
+    // const s3 = new aws.S3();
+    const upload = multer({
+      fileFilter: function (req, file, cb) {
+        if (accepted_extensions.some(ext => file.originalname.toLowerCase().endsWith('.' + ext))) {
+          return cb(null, true);
+        }
+        // otherwise, return error
+        return cb('Only ' + accepted_extensions.join(', ') + ' files are allowed!');
+      },
+      storage: fileStorage,
       limits: { fileSize: size },
     }).single('file');
 
@@ -93,7 +122,14 @@ async function uploadFile(req, res) {
       const status = 'Success';
       //res.header("Access-Control-Allow-Headers", "Content-Type");
       //res.setHeader("Access-Control-Allow-Origin", "*");
-      return res.json({ status, imageUrl: req.file.location });
+      if (process.env.USE_LOCAL == "TRUE") {
+        console.log(req.file);
+        var fileUrl = `${parseBaseUrl}/files/${parseAppId}/${req.file.filename}`;
+      } else {
+        var fileUrl = req.file.location;
+      }
+
+      return res.json({ status, imageUrl: fileUrl });
     });
   } catch (err) {
     console.log('Exeption in query ' + err.stack);

apps/OpenSignServer/cloud/main.js

@@ -13,6 +13,10 @@ import sendMailOTPv1 from './parsefunction/SendMailOTPv1.js';
 import SendMailv1 from './parsefunction/SendMailv1.js';
 import AuthLoginAsMail from './parsefunction/AuthLoginAsMail.js';
 import getUserId from './parsefunction/getUserId.js';
+import getUserDetails from './parsefunction/getUserDetails.js';
+import getDocument from './parsefunction/getDocument.js';
+import getDrive from './parsefunction/getDrive.js';
+import getReport from './parsefunction/getReport.js';
 
 Parse.Cloud.define('AddUserToRole', addUserToGroups);
 Parse.Cloud.define('UserGroups', getUserGroups);
@@ -29,3 +33,7 @@ Parse.Cloud.define('SendOTPMailV1', sendMailOTPv1);
 Parse.Cloud.define('sendmail', SendMailv1);
 Parse.Cloud.define('AuthLoginAsMail', AuthLoginAsMail);
 Parse.Cloud.define('getUserId', getUserId);
+Parse.Cloud.define('getUserDetails', getUserDetails);
+Parse.Cloud.define('getDocument', getDocument);
+Parse.Cloud.define('getDrive', getDrive)
+Parse.Cloud.define('getReport', getReport)

apps/OpenSignServer/cloud/parsefunction/SendMailv1.js

@@ -5,7 +5,7 @@ async function SendMailv1(request) {
     const recipient = request.params.email;
     const otp = request.params.otp;
     const res = await Parse.Cloud.sendEmail({
-      from: 'Test user' + ' <' + process.env.MAILGUN_SENDER + '>',
+      from: 'Test user' + ' <' + process.env.SMTP_ENABLE ? process.env.SMTP_USER_EMAIL : process.env.MAILGUN_SENDER + '>',
       recipient: recipient,
       subject: 'Your OpenSign™ OTP',
       text: 'This email is a test.',

apps/OpenSignServer/cloud/parsefunction/ZohoDetails.js

@@ -46,15 +46,20 @@ export default async function ZohoDetails(request) {
       (userData.data.data.subscription.customer &&
         userData.data.data.subscription.customer.company_name) ||
       '';
+    const jobTitle =
+      (userData.data.data.subscription.customer &&
+        userData.data.data.subscription.customer.cd_job_title) ||
+      '';
     const resData = {
       phone: userData.data.data.subscription.contactpersons[0].mobile,
       name: first_name + ' ' + last_name,
       email: userData.data.data.subscription.contactpersons[0].email,
-      nextBillingDate: userData.data.expiring_time,
+      nextBillingDate: userData.data.data.subscription.next_billing_at,
       company: company_name,
       plan: userData.data.data.subscription.plan,
       customer_id: userData.data.data.subscription.customer_id,
       subscription_id: userData.data.data.subscription.subscription_id,
+      jobTitle: jobTitle,
     };
     return resData;
   }

apps/OpenSignServer/cloud/parsefunction/getDocument.js

@@ -0,0 +1,50 @@
+import axios from 'axios';
+
+export default async function getDocument(request) {
+  const serverUrl = process.env.SERVER_URL;
+  const docId = request.params.docId;
+
+  try {
+    const userRes = await axios.get(serverUrl + '/users/me', {
+      headers: {
+        'X-Parse-Application-Id': process.env.APP_ID,
+        'X-Parse-Session-Token': request.headers['sessiontoken'],
+      },
+    });
+    const userId = userRes.data && userRes.data.objectId;
+    if (docId && userId) {
+      try {
+        const query = new Parse.Query('contracts_Document');
+        query.equalTo('objectId', docId);
+        query.include('ExtUserPtr');
+        query.include('CreatedBy');
+        query.include('Signers');
+        query.include('AuditTrail.UserPtr');
+        query.include('Placeholders');
+        const res = await query.first({ useMasterKey: true });
+        if (res) {
+          const acl = res.getACL();
+          if (acl && acl.getReadAccess(userId)) {
+            return res;
+          } else {
+            return { error: "You don't have access of this document!" };
+          }
+        } else {
+          return { error: "You don't have access of this document!" };
+        }
+      } catch (err) {
+        console.log('err', err);
+        return err;
+      }
+    } else {
+      return { error: 'Please pass required parameters!' };
+    }
+  } catch (err) {
+    console.log('err');
+    if (err.code == 209) {
+      return { error: 'Invalid session token' };
+    } else {
+      return { error: "You don't have access of this document!" };
+    }
+  }
+}

apps/OpenSignServer/cloud/parsefunction/getDrive.js

@@ -0,0 +1,51 @@
+import axios from 'axios';
+export default async function getDrive(request) {
+  const serverUrl = process.env.SERVER_URL;
+  const appId = process.env.APP_ID;
+
+  const classUrl = serverUrl + '/classes/contracts_Document';
+  const docId = request.params.docId;
+  try {
+    const userRes = await axios.get(serverUrl + '/users/me', {
+      headers: {
+        'X-Parse-Application-Id': appId,
+        'X-Parse-Session-Token': request.headers['sessiontoken'],
+      },
+    });
+    const userId = userRes.data && userRes.data.objectId;
+    if (userId) {
+      let url;
+      if (docId) {
+        url = `${classUrl}?where={"Folder":{"__type":"Pointer","className":"contracts_Document","objectId":"${docId}"},"$or":[{"CreatedBy":{"$exists":false}},{"CreatedBy":{"__type":"Pointer","className":"_User","objectId":"${userId}"}}]}&include=ExtUserPtr,Signers,Folder`;
+      } else {
+        url = `${classUrl}?where={"Folder":{"$exists":false},"$or":[{"CreatedBy":{"$exists":false}},{"CreatedBy":{"__type":"Pointer","className":"_User","objectId":"${userId}"}}]}&include=ExtUserPtr,Signers`;
+      }
+      try {
+        const res = await axios.get(url, {
+          headers: {
+            'X-Parse-Application-Id': appId,
+            'X-Parse-Master-key': process.env.MASTER_KEY,
+          },
+        });
+        // console.log('res.data.results ', res.data.results);
+        if (res.data && res.data.results) {
+          return res.data.results;
+        } else {
+          return [];
+        }
+      } catch (err) {
+        console.log('err', err);
+        return { error: "You don't have access to drive" };
+      }
+    } else {
+      return { error: 'Please provide required parameter!' };
+    }
+  } catch (err) {
+    console.log('err', err);
+    if (err.code == 209) {
+      return { error: 'Invalid session token' };
+    } else {
+      return { error: "You don't have access!" };
+    }
+  }
+}

apps/OpenSignServer/cloud/parsefunction/getReport.js

@@ -0,0 +1,51 @@
+import reportJson from './reportsJson.js';
+import axios from 'axios'
+
+export default async function getReport(request) {
+  const reportId = request.params.reportId;
+  const limit = request.params.limit;
+  const skip = request.params.skip;
+
+  const serverUrl = process.env.SERVER_URL;
+  const appId = process.env.APP_ID;
+
+  try {
+    const userRes = await axios.get(serverUrl + '/users/me', {
+      headers: {
+        'X-Parse-Application-Id': appId,
+        'X-Parse-Session-Token': request.headers['sessiontoken'],
+      },
+    });
+    const userId = userRes.data && userRes.data.objectId;
+    if (userId) {
+      const json = reportId && reportJson(reportId, userId);
+      if (json) {
+        const { params, keys } = json;
+        const orderBy = '-updatedAt';
+        const strParams = JSON.stringify(params);
+        const strKeys = keys.join();
+        const headers = {
+          'Content-Type': 'application/json',
+          'X-Parse-Application-Id': appId,
+          'X-Parse-Master-Key': process.env.MASTER_KEY,
+        };
+        const url = `${serverUrl}/classes/contracts_Document?where=${strParams}&keys=${strKeys}&order=${orderBy}&skip=${skip}&limit=${limit}&include=AuditTrail.UserPtr`;
+        const res = await axios.get(url, { headers: headers });
+        if (res.data && res.data.results) {
+          return res.data.results;
+        } else {
+          return [];
+        }
+      } else {
+        return { error: 'Report is not available!' };
+      }
+    }
+  } catch (err) {
+    console.log('err', err);
+    if (err.code == 209) {
+      return { error: 'Invalid session token' };
+    } else {
+      return { error: "You don't have access!" };
+    }
+  }
+}

apps/OpenSignServer/cloud/parsefunction/getUserDetails.js

@@ -0,0 +1,14 @@
+async function getUserDetails(request) {
+  try {
+    const userQuery = new Parse.Query('contracts_Users');
+    userQuery.equalTo('Email', request.params.email);
+    userQuery.include('TenantId');
+    userQuery.include('UserId')
+    const res = await userQuery.first({ useMasterKey: true });
+    return res;
+  } catch (err) {
+    console.log('Err ', err);
+    return err;
+  }
+}
+export default getUserDetails;

apps/OpenSignServer/cloud/parsefunction/pdf/PDF.min.js

@@ -79,7 +79,7 @@ async function sendCompletedMail(e) {
       url: a,
       from: 'OpenSign™',
       recipient: e.receiver,
-      subject: `Document ${s} has beeen signed by all parties`,
+      subject: `Document ${s} has been signed by all parties`,
       pdfName: s,
       html:
         "<html><head><meta http-equiv='Content-Type' content='text/html; charset=UTF-8' /></head><body>  <div style='background-color:#f5f5f5;padding:20px'>    <div style='box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;background-color:white;'> <div><img src=https://qikinnovation.ams3.digitaloceanspaces.com/logo.png  height='50' style='padding:20px'/> </div><div style='padding:2px;font-family:system-ui; background-color: #47a3ad;'>    <p style='font-size:20px;font-weight:400;color:white;padding-left:20px',> Document sign successfully</p></div><div><p style='padding:20px;font-family:system-ui;font-size:14px'>All parties have successfully signed the document" +
@@ -105,7 +105,7 @@ async function PDF(s, r) {
         headers: {
           'Content-Type': 'application/json',
           'X-Parse-Application-Id': APPID,
-          'X-Parse-Session-Token': s.headers.sessiontoken,
+          'X-Parse-Master-Key': masterKEY,
         },
       }),
       d = await axios.get(serverUrl + '/users/me', {
@@ -132,7 +132,7 @@ async function PDF(s, r) {
           : ((a = await axios.get(serverUrl + '/classes/contracts_Users?where=' + m, {
               headers: {
                 'X-Parse-Application-Id': APPID,
-                'X-Parse-Session-Token': s.headers.sessiontoken,
+                'X-Parse-Master-Key': masterKEY,
               },
             })),
             'contracts_Users')
@@ -142,7 +142,7 @@ async function PDF(s, r) {
           (c = await axios.get(serverUrl + '/classes/contracts_Users?where=' + p, {
             headers: {
               'X-Parse-Application-Id': APPID,
-              'X-Parse-Session-Token': s.headers.sessiontoken,
+              'X-Parse-Master-Key': masterKEY,
             },
           })).data && 0 < c.data.results.length
             ? ((a = c), 'contracts_Users')

apps/OpenSignServer/cloud/parsefunction/pdf/SignPDF.min.cjs

@@ -1 +1 @@
-const signer=require("node-signpdf").default;class SignPDF{constructor(e,t){this.pdfDoc=e,this.certificate=t}async signPDF(){return signer.sign(this.pdfDoc,this.certificate,{passphrase:"emudhra"})}static unit8ToBuffer(e){var t=Buffer.alloc(e.byteLength),r=new Uint8Array(e);for(let e=0;e<t.length;++e)t[e]=r[e];return t}}module.exports=SignPDF;
+const signer=require("node-signpdf").default;class SignPDF{constructor(e,t){this.pdfDoc=e,this.certificate=t}async signPDF(){return signer.sign(this.pdfDoc,this.certificate, process.env.PASS_PHRASE ? {passphrase : process.env.PASS_PHRASE}:  null)}static unit8ToBuffer(e){var t=Buffer.alloc(e.byteLength),r=new Uint8Array(e);for(let e=0;e<t.length;++e)t[e]=r[e];return t}}module.exports=SignPDF;

apps/OpenSignServer/cloud/parsefunction/pdf/customSignPdf/pdfkitAddPlaceholder.min.js

@@ -1,28 +1,28 @@
-import{DEFAULT_BYTE_RANGE_PLACEHOLDER,DEFAULT_SIGNATURE_LENGTH,SUBFILTER_ADOBE_PKCS7_DETACHED}from"./const.min.js";import PDFKitReferenceMock from"./PDFKitReferenceMock.min.js";import PNG from"png-js";import zlib from"zlib";import fs from"node:fs";const specialCharacters=["á","Á","é","É","í","Í","ó","Ó","ö","Ö","ő","Ő","ú","Ú","ű","Ű"],MARKERS=[65472,65473,65474,65475,65477,65478,65479,65480,65481,65482,65483,65484,65485,65486,65487],COLOR_SPACE_MAP={1:"DeviceGray",3:"DeviceRGB",4:"DeviceCMYK"};function getImage(e,t){let n;if(255===e[0]&&216===e[1])n=getJpgImage(t,e);else{if(137!==e[0]||"PNG"!==e.toString("ascii",1,4))throw new Error("Unknown image format.");n=getPngImage(t,e)}return n}function getAnnotationApparance(e,t,n){return e.ref({CropBox:[0,0,197,70],Type:"XObject",FormType:1,BBox:[0,0,197,70],Resources:`<</XObject <<
+import{DEFAULT_BYTE_RANGE_PLACEHOLDER,DEFAULT_SIGNATURE_LENGTH,SUBFILTER_ADOBE_PKCS7_DETACHED}from"./const.min.js";import PDFKitReferenceMock from"./PDFKitReferenceMock.min.js";import PNG from"png-js";import zlib from"zlib";const specialCharacters=["á","Á","é","É","í","Í","ó","Ó","ö","Ö","ő","Ő","ú","Ú","ű","Ű"],MARKERS=[65472,65473,65474,65475,65477,65478,65479,65480,65481,65482,65483,65484,65485,65486,65487],COLOR_SPACE_MAP={1:"DeviceGray",3:"DeviceRGB",4:"DeviceCMYK"};function getImage(e,t){let n;if(255===e[0]&&216===e[1])n=getJpgImage(t,e);else{if(137!==e[0]||"PNG"!==e.toString("ascii",1,4))throw new Error("Unknown image format.");n=getPngImage(t,e)}return n}function getAnnotationApparance(e,t,n){return e.ref({CropBox:[0,10,200,60],Type:"XObject",FormType:1,BBox:[0,10,200,60],Resources:`<</XObject <<
 /Img${t.index} ${t.index} 0 R
 >>
 /Font <<
 /f1 ${n.index} 0 R
 >>
->>`,MediaBox:[0,0,197,70],Subtype:"Form"},null,getStream(t.index))}const getStream=e=>getConvertedText(`
-    1.0 1.0 1.0 rg
-    0.0 0.0 0.0 RG
-    q
-    q
-    200 0 0 50 0 10 cm
-    /Img${e} Do
-    Q
-    0 0 0 rg
-    BT
-    0 Tr
-    /f1 10.0 Tf
-    1.4 0 0 1 20 45.97412 Tm
-    ET
-    BT
-    0 Tr
-    /f1 10.0 Tf
-    1.4 0 0 1 20 33.56006 Tm
-    ET
-    Q`),getFont=(e,t)=>e.ref({Type:"Font",BaseFont:t,Encoding:"WinAnsiEncoding",Subtype:"Type1"}),getJpgImage=(e,t)=>{if(65496!==t.readUInt16BE(0))throw"SOI not found in JPEG";let n=2,a;for(;n<t.length&&(a=t.readUInt16BE(n),n+=2,!MARKERS.includes(a));)n+=t.readUInt16BE(n);if(!MARKERS.includes(a))throw"Invalid JPEG.";n+=2;var r=t[n++],o=t.readUInt16BE(n),i=(n+=2,t.readUInt16BE(n)),l=(n+=2,t[n++]),l=COLOR_SPACE_MAP[l],r={Type:"XObject",Subtype:"Image",BitsPerComponent:r,Width:i,Height:o,ColorSpace:l,Filter:"DCTDecode"},i=("DeviceCMYK"===l&&(r.Decode=[1,0,1,0,1,0,1,0]),e.ref(r,null,t));return i},getPngImage=(e,t)=>{var t=new PNG(t),n=t.hasAlphaChannel,a={Type:"XObject",Subtype:"Image",BitsPerComponent:n?8:t.bits,Width:t.width,Height:t.height,Filter:"FlateDecode"};if(n||(r=e.ref({Predictor:15,Colors:t.colors,BitsPerComponent:t.bits,Columns:t.width}),a.DecodeParms=r),0===t.palette.length?a.ColorSpace=t.colorSpace:(r=e.ref({stream:new Buffer(t.palette)}),a.ColorSpace=["Indexed","DeviceRGB",t.palette.length/3-1,r]),null!=t.transparency.grayscale){var r=t.transparency.grayscale;a.Mask=[r,r]}else if(t.transparency.rgb){var o,r=t.transparency["rgb"],i=[];for(o of r)i.push(o,o);a.Mask=i}else t.transparency.indexed?loadIndexedAlphaChannel(t):n&&(splitAlphaChannel(t),r=getSmask(e,t),a.Mask=r);return e.ref(a,null,t.imgData)},loadIndexedAlphaChannel=e=>{const o=e.transparency.indexed;return e.decodePixels(n=>{var a=new Buffer(e.width*e.height);let r=0;for(let e=0,t=n.length;e<t;e++)a[r++]=o[n[e]];e.alphaChannel=zlib.deflateSync(a)})},splitAlphaChannel=d=>{d.decodePixels(t=>{let e,n;var a=d.colors,r=d.width*d.height,o=new Buffer(r*a),i=new Buffer(r);let l=n=e=0;for(var g=t.length,c=16===d.bits?1:0;l<g;){for(let e=0;e<a;e++)o[n++]=t[l++],l+=c;i[e++]=t[l++],l+=c}d.imgData=zlib.deflateSync(o),d.alphaChannel=zlib.deflateSync(i)})},getSmask=(e,t)=>{let n;return console.log("image.hasAlphaChannel ",t.hasAlphaChannel),t.hasAlphaChannel&&(console.log("image.alphaChannel ",t.alphaChannel),n=e.ref({Type:"XObject",Subtype:"Image",Height:t.height,Width:t.width,BitsPerComponent:8,Filter:"FlateDecode",ColorSpace:"DeviceGray",Decode:[0,1],stream:t.alphaChannel})),n},getConvertedText=e=>e.split("").map(e=>specialCharacters.includes(e)?getOctalCodeFromCharacter(e):e).join(""),getOctalCodeFromCharacter=e=>"\\"+e.charCodeAt(0).toString(8),pdfkitAddPlaceholder=({pdf:e,pdfBuffer:a,reason:r,contactInfo:t="emailfromp1289@gmail.com",name:n="Name from p12",location:o="Location from p12",signatureLength:i=DEFAULT_SIGNATURE_LENGTH,byteRangePlaceholder:l=DEFAULT_BYTE_RANGE_PLACEHOLDER,subFilter:g=SUBFILTER_ADOBE_PKCS7_DETACHED,sign:c})=>{var d=getFont(e,"Helvetica"),s=getFont(e,"ZapfDingbats"),f=getFont(e,"Helvetica"),p=c.Base64,p=getAnnotationApparance(e,getImage(Buffer.from(p,"base64"),e),f),f=e.ref({Type:"Sig",Filter:"Adobe.PPKLite",SubFilter:g,ByteRange:[0,l,l,l],Contents:Buffer.from(String.fromCharCode(0).repeat(i)),Reason:new String(r),M:new Date,ContactInfo:new String(t),Name:new String(n),Location:new String(o)}),h=a.lastIndexOf("/Type /AcroForm"),g=-1!==h;let m=[],C;if(g){let e=h;var S=h-10;let t="",n=11;for(n;n<22;n+=1){var A=a.slice(h-n,S).toString();if("\n"===A[0])break;t=A,e=h-n}l=a.slice(e),i=l.slice(0,l.indexOf("endobj")).toString(),r=(C=parseInt(t),i.slice(i.indexOf("/Fields [")+9,i.indexOf("]")));m=r.split(" ").filter((e,t)=>t%3==0).map(e=>new PDFKitReferenceMock(e))}m.length;t=c.Left,n=c.Bottom,o=t+c.Width,l=n+c.Height,i=e.ref({Type:"Annot",Subtype:"Widget",FT:"Sig",Rect:[t,n,o,l],V:f,T:new String("Signature"+(m.length+1)),F:4,P:e.page.dictionary,AP:`<</N ${p.index} 0 R>>`,DA:new String("/Helvetica 0 Tf 0 g")});e.page.dictionary.data.Annots=[i];let T;return T=g?e.ref({Type:"AcroForm",SigFlags:3,Fields:[...m,i],DR:`<</Font
+>>`,MediaBox:[0,10,200,60],Subtype:"Form"},null,getStream(t.index))}const getStream=e=>getConvertedText(`
+      1.0 1.0 1.0 rg
+      0.0 0.0 0.0 RG
+      q
+      q
+      200 0 0 50 0 10 cm
+      /Img${e} Do
+      Q
+      0 0 0 rg
+      BT
+      0 Tr
+      /f1 10.0 Tf
+      1.4 0 0 1 20 45.97412 Tm
+      ET
+      BT
+      0 Tr
+      /f1 10.0 Tf
+      1.4 0 0 1 20 33.56006 Tm
+      ET
+      Q`),getFont=(e,t)=>e.ref({Type:"Font",BaseFont:t,Encoding:"WinAnsiEncoding",Subtype:"Type1"}),getJpgImage=(e,t)=>{if(65496!==t.readUInt16BE(0))throw"SOI not found in JPEG";let n=2,a;for(;n<t.length&&(a=t.readUInt16BE(n),n+=2,!MARKERS.includes(a));)n+=t.readUInt16BE(n);if(!MARKERS.includes(a))throw"Invalid JPEG.";n+=2;var r=t[n++],o=t.readUInt16BE(n),i=(n+=2,t.readUInt16BE(n)),l=(n+=2,t[n++]),l=COLOR_SPACE_MAP[l],r={Type:"XObject",Subtype:"Image",BitsPerComponent:r,Width:i,Height:o,ColorSpace:l,Filter:"DCTDecode"},i=("DeviceCMYK"===l&&(r.Decode=[1,0,1,0,1,0,1,0]),e.ref(r,null,t));return i},getPngImage=(e,t)=>{var t=new PNG(t),n=t.hasAlphaChannel,a={Type:"XObject",Subtype:"Image",BitsPerComponent:n?8:t.bits,Width:t.width,Height:t.height,Filter:"FlateDecode"};if(n||(r=e.ref({Predictor:15,Colors:t.colors,BitsPerComponent:t.bits,Columns:t.width}),a.DecodeParms=r),0===t.palette.length?a.ColorSpace=t.colorSpace:(r=e.ref({stream:new Buffer(t.palette)}),a.ColorSpace=["Indexed","DeviceRGB",t.palette.length/3-1,r]),null!=t.transparency.grayscale){var r=t.transparency.grayscale;a.Mask=[r,r]}else if(t.transparency.rgb){var o,r=t.transparency["rgb"],i=[];for(o of r)i.push(o,o);a.Mask=i}else t.transparency.indexed?loadIndexedAlphaChannel(t):n&&(splitAlphaChannel(t),r=getSmask(e,t),a.Mask=r);return e.ref(a,null,t.imgData)},loadIndexedAlphaChannel=e=>{const o=e.transparency.indexed;return e.decodePixels(n=>{var a=new Buffer(e.width*e.height);let r=0;for(let e=0,t=n.length;e<t;e++)a[r++]=o[n[e]];e.alphaChannel=zlib.deflateSync(a)})},splitAlphaChannel=d=>{d.decodePixels(t=>{let e,n;var a=d.colors,r=d.width*d.height,o=new Buffer(r*a),i=new Buffer(r);let l=n=e=0;for(var c=t.length,g=16===d.bits?1:0;l<c;){for(let e=0;e<a;e++)o[n++]=t[l++],l+=g;i[e++]=t[l++],l+=g}d.imgData=zlib.deflateSync(o),d.alphaChannel=zlib.deflateSync(i)})},getSmask=(e,t)=>{let n;return console.log("image.hasAlphaChannel ",t.hasAlphaChannel),t.hasAlphaChannel&&(console.log("image.alphaChannel ",t.alphaChannel),n=e.ref({Type:"XObject",Subtype:"Image",Height:t.height,Width:t.width,BitsPerComponent:8,Filter:"FlateDecode",ColorSpace:"DeviceGray",Decode:[0,1],stream:t.alphaChannel})),n},getConvertedText=e=>e.split("").map(e=>specialCharacters.includes(e)?getOctalCodeFromCharacter(e):e).join(""),getOctalCodeFromCharacter=e=>"\\"+e.charCodeAt(0).toString(8),pdfkitAddPlaceholder=({pdf:e,pdfBuffer:a,reason:r,contactInfo:t="emailfromp1289@gmail.com",name:n="Name from p12",location:o="Location from p12",signatureLength:i=DEFAULT_SIGNATURE_LENGTH,byteRangePlaceholder:l=DEFAULT_BYTE_RANGE_PLACEHOLDER,subFilter:c=SUBFILTER_ADOBE_PKCS7_DETACHED,sign:g})=>{var d=getFont(e,"Helvetica"),s=getFont(e,"ZapfDingbats"),p=getFont(e,"Helvetica"),f=g.Base64,f=getAnnotationApparance(e,getImage(Buffer.from(f,"base64"),e),p,g),p=e.ref({Type:"Sig",Filter:"Adobe.PPKLite",SubFilter:c,ByteRange:[0,l,l,l],Contents:Buffer.from(String.fromCharCode(0).repeat(i)),Reason:new String(r),M:new Date,ContactInfo:new String(t),Name:new String(n),Location:new String(o)}),h=a.lastIndexOf("/Type /AcroForm"),c=-1!==h;let m=[],C;if(c){let e=h;var S=h-10;let t="",n=11;for(n;n<22;n+=1){var A=a.slice(h-n,S).toString();if("\n"===A[0])break;t=A,e=h-n}l=a.slice(e),i=l.slice(0,l.indexOf("endobj")).toString(),r=(C=parseInt(t),i.slice(i.indexOf("/Fields [")+9,i.indexOf("]")));m=r.split(" ").filter((e,t)=>t%3==0).map(e=>new PDFKitReferenceMock(e))}t=g.Left,n=g.Bottom,o=t+g.Width,l=n+g.Height,i=e.ref({Type:"Annot",Subtype:"Widget",FT:"Sig",Rect:[t,n,o,l],V:p,T:new String("Signature"+(m.length+1)),F:4,P:e.page.dictionary,AP:`<</N ${f.index} 0 R>>`,DA:new String("/Helvetica 0 Tf 0 g")});e.page.dictionary.data.Annots=[i];let T;return T=c?e.ref({Type:"AcroForm",SigFlags:3,Fields:[...m,i],DR:`<</Font
 <</Helvetica ${d.index} 0 R/ZapfDingbats ${s.index} 0 R>>
->>`},C):e.ref({Type:"AcroForm",SigFlags:3,Fields:[...m,i]}),{signature:f,form:e._root.data.AcroForm=T,widget:i}};export default pdfkitAddPlaceholder;
+>>`},C):e.ref({Type:"AcroForm",SigFlags:3,Fields:[...m,i]}),{signature:p,form:e._root.data.AcroForm=T,widget:i}};export default pdfkitAddPlaceholder;

apps/OpenSignServer/cloud/parsefunction/reportsJson.js

@@ -0,0 +1,204 @@
+export default function reportJson(id, userId) {
+  const currentUserId = userId;
+
+  switch (id) {
+    // draft documents report
+    case 'ByHuevtCFY':
+      return {
+        reportName: 'Draft Documents',
+        params: {
+          Type: null,
+          $or: [
+            { Signers: null, SignedUrl: null },
+            { Signers: { $exists: true }, Placeholders: null },
+          ],
+          CreatedBy: {
+            __type: 'Pointer',
+            className: '_User',
+            objectId: currentUserId,
+          },
+        },
+        keys: ['Name', 'Note', 'Folder.Name', 'URL', 'ExtUserPtr.Name', 'Signers.Name'],
+      };
+    // Need your sign report
+    case '4Hhwbp482K':
+      return {
+        reportName: 'Need your sign',
+        params: {
+          Type: { $ne: 'Folder' },
+          IsCompleted: { $ne: true },
+          IsDeclined: { $ne: true },
+          ExpiryDate: {
+            $gt: { __type: 'Date', iso: new Date().toISOString() },
+          },
+          Placeholders: { $ne: null },
+        },
+        keys: [
+          'Name',
+          'Note',
+          'Folder.Name',
+          'URL',
+          'ExtUserPtr.Name',
+          'Signers.Name',
+          'Signers.UserId',
+          'AuditTrail',
+        ],
+      };
+    // In progess report
+    case '1MwEuxLEkF':
+      return {
+        reportName: 'In-progress documents',
+        params: {
+          Type: { $ne: 'Folder' },
+          Signers: { $ne: null },
+          Placeholders: { $ne: null },
+          IsCompleted: { $ne: true },
+          IsDeclined: { $ne: true },
+          CreatedBy: {
+            __type: 'Pointer',
+            className: '_User',
+            objectId: currentUserId,
+          },
+          ExpiryDate: {
+            $gt: { __type: 'Date', iso: new Date().toISOString() },
+          },
+        },
+        keys: ['Name', 'Note', 'Folder.Name', 'URL', 'ExtUserPtr.Name', 'Signers.Name'],
+      };
+    // completed documents report
+    case 'kQUoW4hUXz':
+      return {
+        reportName: 'Completed Documents',
+        params: {
+          Type: null,
+          IsCompleted: true,
+          CreatedBy: {
+            __type: 'Pointer',
+            className: '_User',
+            objectId: currentUserId,
+          },
+          IsDeclined: { $ne: true },
+        },
+        keys: [
+          'Name',
+          'Note',
+          'Folder.Name',
+          'URL',
+          'ExtUserPtr.Name',
+          'Signers.Name',
+          'TimeToCompleteDays',
+        ],
+      };
+
+    //  declined documents report
+    case 'UPr2Fm5WY3':
+      return {
+        reportName: 'Declined Documents',
+        params: {
+          Type: null,
+          IsDeclined: true,
+          CreatedBy: {
+            __type: 'Pointer',
+            className: '_User',
+            objectId: currentUserId,
+          },
+        },
+
+        keys: ['Name', 'Note', 'Folder.Name', 'URL', 'ExtUserPtr.Name', 'Signers.Name'],
+      };
+    //  Expired Documents report
+    case 'zNqBHXHsYH':
+      return {
+        reportName: 'Expired Documents',
+        params: {
+          IsCompleted: { $ne: true },
+          IsDeclined: { $ne: true },
+          Type: { $ne: 'Folder' },
+          $and: [
+            {
+              $or: [
+                { Signers: { $ne: null }, SignedUrl: { $ne: null } },
+                { Placeholders: { $ne: null } },
+              ],
+            },
+            {
+              ExpiryDate: {
+                $lt: { __type: 'Date', iso: new Date().toISOString() },
+              },
+            },
+          ],
+          CreatedBy: {
+            __type: 'Pointer',
+            className: '_User',
+            objectId: currentUserId,
+          },
+        },
+        keys: ['Name', 'Note', 'Folder.Name', 'URL', 'ExtUserPtr.Name', 'Signers.Name'],
+      };
+    //  Recently sent for signatures report show on dashboard
+    case 'd9k3UfYHBc':
+      return {
+        reportName: 'Recently sent for signatures',
+        params: {
+          Type: { $ne: 'Folder' },
+          Signers: { $ne: null },
+          Placeholders: { $ne: null },
+          IsCompleted: { $ne: true },
+          IsDeclined: { $ne: true },
+          CreatedBy: {
+            __type: 'Pointer',
+            className: '_User',
+            objectId: currentUserId,
+          },
+          ExpiryDate: {
+            $gt: { __type: 'Date', iso: new Date().toISOString() },
+          },
+        },
+        keys: ['Name', 'Note', 'Folder.Name', 'URL', 'ExtUserPtr.Name', 'Signers.Name'],
+      };
+    //  Recent signature requests report show on dashboard
+    case '5Go51Q7T8r':
+      return {
+        reportName: 'Recent signature requests',
+        params: {
+          Type: { $ne: 'Folder' },
+          IsCompleted: { $ne: true },
+          IsDeclined: { $ne: true },
+          ExpiryDate: {
+            $gt: { __type: 'Date', iso: new Date().toISOString() },
+          },
+          Placeholders: { $ne: null },
+        },
+        keys: [
+          'Name',
+          'Note',
+          'Folder.Name',
+          'URL',
+          'ExtUserPtr.Name',
+          'Signers.Name',
+          'Signers.UserId',
+          'AuditTrail',
+        ],
+      };
+    // Drafts report show on dashboard
+    case 'kC5mfynCi4':
+      return {
+        reportName: 'Drafts',
+        params: {
+          Type: null,
+          $or: [
+            { Signers: null, SignedUrl: null },
+            { Signers: { $exists: true }, Placeholders: null },
+          ],
+          CreatedBy: {
+            __type: 'Pointer',
+            className: '_User',
+            objectId: currentUserId,
+          },
+        },
+        keys: ['Name', 'Note', 'Folder.Name', 'URL', 'ExtUserPtr.Name', 'Signers.Name'],
+      };
+    default:
+      return null;
+  }
+}

apps/OpenSignServer/cloud/parsefunction/sendMail.js

@@ -1,14 +1,30 @@
 import fs from 'node:fs';
+import https from 'https';
 import formData from 'form-data';
 import Mailgun from 'mailgun.js';
-import https from 'https';
+import { createTransport } from 'nodemailer';
 
-const mailgun = new Mailgun(formData);
-const mailgunClient = mailgun.client({
-  username: 'api',
-  key: process.env.MAILGUN_API_KEY,
-});
-const mailgunDomain = process.env.MAILGUN_DOMAIN;
+let transporterSMTP;
+let mailgunClient;
+let mailgunDomain;
+if (process.env.SMTP_ENABLE) {
+  transporterSMTP = createTransport({
+    host: process.env.SMTP_HOST,
+    port: process.env.SMTP_PORT || 465,
+    secure: process.env.SMTP_SECURE || true,
+    auth: {
+      user: process.env.SMTP_USER_EMAIL,
+      pass: process.env.SMTP_PASS,
+    },
+  });
+} else {
+  const mailgun = new Mailgun(formData);
+  mailgunClient = mailgun.client({
+    username: 'api',
+    key: process.env.MAILGUN_API_KEY,
+  });
+  mailgunDomain = process.env.MAILGUN_DOMAIN;
+}
 
 async function sendmail(req) {
   try {
@@ -38,22 +54,67 @@ async function sendmail(req) {
         const pdfName = req.params.pdfName && `${req.params.pdfName}.pdf`;
         const file = {
           filename: pdfName || 'exported.pdf',
-          data: PdfBuffer, //fs.readFileSync('./exports/exported_file_1223.pdf'),
+          content: process.env.SMTP_ENABLE ? PdfBuffer : undefined, //fs.readFileSync('./exports/exported_file_1223.pdf'),
+          data: process.env.SMTP_ENABLE ? undefined : PdfBuffer,
         };
 
         // const html = "<html><head><meta http-equiv='Content-Type' content='text/html; charset=UTF-8' /></head><body style='text-align: center;'> <p style='font-weight: bolder; font-size: large;'>Hello!</p> <p>This is a html checking mail</p><p><button style='background-color: lightskyblue; cursor: pointer; border-radius: 5px; padding: 10px; border-style: solid; border-width: 2px; text-decoration: none; font-weight: bolder; color:blue'>Verify email</button></p></body></html>"
 
         const from = req.params.from || '';
+        const mailsender = process.env.SMTP_ENABLE
+          ? process.env.SMTP_USER_EMAIL
+          : process.env.MAILGUN_SENDER;
 
         const messageParams = {
-          from: from + ' <' + process.env.MAILGUN_SENDER + '>',
+          from: from + ' <' + mailsender + '>',
           to: req.params.recipient,
           subject: req.params.subject,
           text: req.params.text || 'mail',
           html: req.params.html || '',
-          attachment: file,
+          attachments: process.env.SMTP_ENABLE ? [file] : undefined,
+          attachment: process.env.SMTP_ENABLE ? undefined : file,
         };
+        if (transporterSMTP) {
+          const res = await transporterSMTP.sendMail(messageParams);
+          console.log('Res ', res);
+          if (!res.err) {
+            return {
+              status: 'success',
+            };
+          }
+        } else {
+          const res = await mailgunClient.messages.create(mailgunDomain, messageParams);
+          console.log('Res ', res);
+          if (res.status === 200) {
+            return {
+              status: 'success',
+            };
+          }
+        }
+      }
+    } else {
+      const from = req.params.from || '';
+      const mailsender = process.env.SMTP_ENABLE
+        ? process.env.SMTP_USER_EMAIL
+        : process.env.MAILGUN_SENDER;
 
+      const messageParams = {
+        from: from + ' <' + mailsender + '>',
+        to: req.params.recipient,
+        subject: req.params.subject,
+        text: req.params.text || 'mail',
+        html: req.params.html || '',
+      };
+
+      if (transporterSMTP) {
+        const res = await transporterSMTP.sendMail(messageParams);
+        console.log('Res ', res);
+        if (!res.err) {
+          return {
+            status: 'success',
+          };
+        }
+      } else {
         const res = await mailgunClient.messages.create(mailgunDomain, messageParams);
         console.log('Res ', res);
         if (res.status === 200) {
@@ -62,23 +123,6 @@ async function sendmail(req) {
           };
         }
       }
-    } else {
-      const from = req.params.from || '';
-      const messageParams = {
-        from: from + ' <' + process.env.MAILGUN_SENDER + '>',
-        to: req.params.recipient,
-        subject: req.params.subject,
-        text: req.params.text || 'mail',
-        html: req.params.html || '',
-      };
-
-      const res = await mailgunClient.messages.create(mailgunDomain, messageParams);
-      console.log('Res ', res);
-      if (res.status === 200) {
-        return {
-          status: 'success',
-        };
-      }
     }
   } catch (err) {
     console.log('err ', err);

apps/OpenSignServer/cloud/parsefunction/usersignup.js

@@ -123,6 +123,9 @@ export default async function (request) {
       if (userDetails && userDetails.company) {
         newObj.set("Company", userDetails.company);
       }
+      if (userDetails && userDetails.jobTitle) {
+        newObj.set("JobTitle", userDetails.jobTitle);
+      }
       if (planDetails && planDetails.customer_id) {
         newObj.set("Next_billing_date", new Date(planDetails.nextBillingDate));
         newObj.set("Plan", planDetails.plan);

apps/OpenSignServer/databases/migrations/20231110174122-update_setclp.cjs

@@ -0,0 +1,47 @@
+/**
+ *
+ * @param {Parse} Parse
+ */
+exports.up = async Parse => {
+  // TODO: set className here
+  const className = 'contracts_Users';
+  const schema = new Parse.Schema(className);
+  // schema.addString('Name');
+  // schema.addString('Phone');
+  // schema.addString('JobTitle');
+  // schema.addString('Email');
+  // schema.addString('Company');
+  // schema.addString('UserRole');
+  // schema.addObject('Plan');
+  // schema.addString('Customer_id');
+  // schema.addString('Subscription_id');
+  // schema.addString('Next_billing_date');
+  // schema.addBoolean('IsContactEntry');
+  // schema.addBoolean('ShareWithTeam');
+  // schema.addPointer('TenantId', 'partners_Tenant');
+  // schema.addPointer('UserId', '_User');
+  // schema.addPointer('CreatedBy', '_User');
+  schema.setCLP({
+    get: {},
+    find: {},
+    count: {},
+    create: { '*': true },
+    update: { '*': true },
+    delete: {},
+    addField: {},
+  });
+
+  return schema.update();
+};
+
+/**
+ *
+ * @param {Parse} Parse
+ */
+exports.down = async Parse => {
+  // TODO: set className here
+  const className = 'contracts_Users';
+  const schema = new Parse.Schema(className);
+
+  return schema.purge().then(() => schema.delete());
+};

apps/OpenSignServer/files/verification_email.html

@@ -10,7 +10,7 @@
     <br />
     <p><a href="{{{link}}}" style="background-color: lightskyblue; cursor: pointer; border-radius: 5px; padding: 10px; border-style: solid; border-width: 2px; text-decoration: none; font-weight: bolder; color:blue">Verify email</a></p>
     <br />
-    <p>ExampleApp</p>
+    <p><a href="https://www.opensignlabs.com">OpenSign™</a></p>
 </body>
 
-</html>
+</html>

apps/OpenSignServer/index.js

@@ -14,32 +14,54 @@ import formData from 'form-data';
 import Mailgun from 'mailgun.js';
 import { ApiPayloadConverter } from 'parse-server-api-mail-adapter';
 import S3Adapter from 'parse-server-s3-adapter';
+import FSFilesAdapter from 'parse-server-fs-adapter';
 import AWS from 'aws-sdk';
 import { app as customRoute } from './cloud/customRoute/customApp.js';
+import { exec } from 'child_process';
 
 const spacesEndpoint = new AWS.Endpoint(process.env.DO_ENDPOINT);
 // console.log("configuration ", configuration);
-const s3Options = {
-  bucket: process.env.DO_SPACE, // globalConfig.S3FilesAdapter.bucket,
-  baseUrl: process.env.DO_BASEURL,
-  region: process.env.DO_REGION,
-  directAccess: true,
-  preserveFileName: true,
-  s3overrides: {
-    accessKeyId: process.env.DO_ACCESS_KEY_ID,
-    secretAccessKey: process.env.DO_SECRET_ACCESS_KEY,
-    endpoint: spacesEndpoint,
-  },
-};
+if (process.env.USE_LOCAL !== 'TRUE') {
+  const s3Options = {
+    bucket: process.env.DO_SPACE, // globalConfig.S3FilesAdapter.bucket,
+    baseUrl: process.env.DO_BASEURL,
+    region: process.env.DO_REGION,
+    directAccess: true,
+    preserveFileName: true,
+    s3overrides: {
+      accessKeyId: process.env.DO_ACCESS_KEY_ID,
+      secretAccessKey: process.env.DO_SECRET_ACCESS_KEY,
+      endpoint: spacesEndpoint,
+    },
+  };
+  var fsAdapter = new S3Adapter(s3Options);
+} else {
+  var fsAdapter = new FSFilesAdapter({
+    filesSubDirectory: 'files', // optional, defaults to ./files
+  });
+}
 
+let transporterMail;
 let mailgunClient;
 let mailgunDomain;
-if (process.env.MAILGUN_API_KEY) {
+
+if (process.env.SMTP_ENABLE) {
+  transporterMail = createTransport({
+    host: process.env.SMTP_HOST,
+    port: process.env.SMTP_PORT || 465,
+    secure: process.env.SMTP_SECURE || true,
+    auth: {
+      user: process.env.SMTP_USER_EMAIL,
+      pass: process.env.SMTP_PASS,
+    },
+  });
+} else if (process.env.MAILGUN_API_KEY) {
   const mailgun = new Mailgun(formData);
   mailgunClient = mailgun.client({
     username: 'api',
     key: process.env.MAILGUN_API_KEY,
   });
+
   mailgunDomain = process.env.MAILGUN_DOMAIN;
 }
 
@@ -51,41 +73,47 @@ export const config = {
   masterKey: process.env.MASTER_KEY || '', //Add your master key here. Keep it secret!
   masterKeyIps: ['0.0.0.0/0', '::1'], // '::1'
   serverURL: process.env.SERVER_URL || 'http://localhost:8080/app', // Don't forget to change to https if needed
-  // verifyUserEmails: true,
+  verifyUserEmails: true,
   publicServerURL: process.env.SERVER_URL || 'http://localhost:8080/app',
   // Your apps name. This will appear in the subject and body of the emails that are sent.
   appName: 'Open Sign',
-  emailAdapter: process.env.MAILGUN_API_KEY
-    ? {
-        module: 'parse-server-api-mail-adapter',
-        options: {
-          // The email address from which emails are sent.
-          sender: process.env.MAILGUN_SENDER,
-          // The email templates.
-          templates: {
-            // The template used by Parse Server to send an email for password
-            // reset; this is a reserved template name.
-            passwordResetEmail: {
-              subjectPath: './files/password_reset_email_subject.txt',
-              textPath: './files/password_reset_email.txt',
-              htmlPath: './files/password_reset_email.html',
+  allowClientClassCreation: false,
+  emailAdapter:
+    process.env.SMTP_ENABLE || process.env.MAILGUN_API_KEY
+      ? {
+          module: 'parse-server-api-mail-adapter',
+          options: {
+            // The email address from which emails are sent.
+            sender: process.env.SMTP_ENABLE
+              ? process.env.SMTP_USER_EMAIL
+              : process.env.MAILGUN_SENDER,
+            // The email templates.
+            templates: {
+              // The template used by Parse Server to send an email for password
+              // reset; this is a reserved template name.
+              passwordResetEmail: {
+                subjectPath: './files/password_reset_email_subject.txt',
+                textPath: './files/password_reset_email.txt',
+                htmlPath: './files/password_reset_email.html',
+              },
+              // The template used by Parse Server to send an email for email
+              // address verification; this is a reserved template name.
+              verificationEmail: {
+                subjectPath: './files/verification_email_subject.txt',
+                textPath: './files/verification_email.txt',
+                htmlPath: './files/verification_email.html',
+              },
             },
-            // The template used by Parse Server to send an email for email
-            // address verification; this is a reserved template name.
-            verificationEmail: {
-              subjectPath: './files/verification_email_subject.txt',
-              textPath: './files/verification_email.txt',
-              htmlPath: './files/verification_email.html',
+            apiCallback: async ({ payload, locale }) => {
+              if (mailgunClient) {
+                const mailgunPayload = ApiPayloadConverter.mailgun(payload);
+                await mailgunClient.messages.create(mailgunDomain, mailgunPayload);
+              } else if (transporterMail) await transporterMail.sendMail(payload);
             },
           },
-          apiCallback: async ({ payload, locale }) => {
-            const mailgunPayload = ApiPayloadConverter.mailgun(payload);
-            await mailgunClient.messages.create(mailgunDomain, mailgunPayload);
-          },
-        },
-      }
-    : null,
-  filesAdapter: new S3Adapter(s3Options),
+        }
+      : null,
+  filesAdapter: fsAdapter,
   auth: {
     google: {
       enabled: true,
@@ -155,6 +183,20 @@ if (!process.env.TESTING) {
   httpServer.headersTimeout = 100000; // in milliseconds
   httpServer.listen(port, function () {
     console.log('parse-server-example running on port ' + port + '.');
+    const migrate = `APPLICATION_ID=${process.env.APP_ID} SERVER_URL=http://localhost:8080/app MASTER_KEY=${process.env.MASTER_KEY} npx parse-dbtool migrate`;
+
+    exec(migrate, (error, stdout, stderr) => {
+      if (error) {
+        console.error(`Error: ${error.message}`);
+        return;
+      }
+
+      if (stderr) {
+        console.error(`Error: ${stderr}`);
+        return;
+      }
+      console.log(`Command output: ${stdout}`);
+    });
   });
   // This will enable the Live Query real-time server
   await ParseServer.createLiveQueryServer(httpServer);

apps/OpenSignServer/package.json

@@ -27,16 +27,19 @@
     "express-sse": "^0.5.3",
     "form-data": "^4.0.0",
     "jsonschema": "^1.4.1",
-    "mailgun.js": "^9.0.1",
+    "mailgun.js": "^9.3.0",
     "mongoose": "^7.2.1",
     "multer": "^1.4.5-lts.1",
     "multer-s3": "^2.10.0",
     "node-forge": "^1.3.1",
     "node-signpdf": "^1.5.1",
+    "nodemailer": "^6.9.7",
     "openai": "^4.8.0",
-    "parse": "4.0.1",
-    "parse-server": "6.0.0",
+    "parse": "4.1.0",
+    "parse-dbtool": "^1.2.0",
+    "parse-server": "6.3.1",
     "parse-server-api-mail-adapter": "^3.0.0",
+    "parse-server-fs-adapter": "1.0.1",
     "parse-server-s3-adapter": "^1.2.0",
     "pdf-lib": "^1.16.0",
     "pdfkit": "^0.13.0",

apps/OpenSignServer/runmigrate.js

@@ -0,0 +1,37 @@
+// const { exec } = require('child_process');
+import { exec } from 'child_process';
+
+const migrate =
+  'APPLICATION_ID=legadranaxn SERVER_URL=http://localhost:8080/app MASTER_KEY=XnAwPDRQQyMr npx parse-dbtool migrate';
+// `APPLICATION_ID=${process.env.APP_ID} SERVER_URL=${process.env.SERVER_URL} MASTER_KEY=${process.env.MASTER_KEY} npx parse-dbtool migrate`;
+
+exec(migrate, (error, stdout, stderr) => {
+  if (error) {
+    console.error(`Error: ${error.message}`);
+    return;
+  }
+
+  if (stderr) {
+    console.error(`Error: ${stderr}`);
+    return;
+  }
+
+  console.log(`Command output: ${stdout}`);
+});
+
+// const seeder =
+//   'APPLICATION_ID=legadranaxn SERVER_URL=http://localhost:8080/app MASTER_KEY=XnAwPDRQQyMr npx parse-dbtool seed';
+
+// exec(seeder, (error, stdout, stderr) => {
+//   if (error) {
+//     console.error(`Error: ${error.message}`);
+//     return;
+//   }
+
+//   if (stderr) {
+//     console.error(`Error: ${stderr}`);
+//     return;
+//   }
+
+//   console.log(`Command output: ${stdout}`);
+// });

apps/localstack/localstack-script.sh

@@ -0,0 +1,6 @@
+#!/bin/bash
+
+awslocal s3api \
+create-bucket --bucket my-bucket \
+--create-bucket-configuration LocationConstraint=eu-central-1 \
+--region eu-central-1

apps/mongo/Dockerfile

@@ -0,0 +1,11 @@
+# Use the official MongoDB imagee
+FROM mongo:latest
+
+# Create a directory to host initialization scripts
+RUN mkdir -p /docker-entrypoint-initdb.d
+
+# Copy default data JSON files to the initialization directory
+COPY ./default-data/*.json /docker-entrypoint-initdb.d/
+
+# Execute the initialization script during container startup
+CMD ["mongod"]

apps/mongo/default-data/legadraGCva._Role.json

@@ -0,0 +1,70 @@
+[{
+    "_id": "lpm8ijrwod",
+    "name": "contracts_Admin",
+    "_wperm": [
+      "*"
+    ],
+    "_rperm": [
+      "*"
+    ],
+    "_acl": {
+      "*": {
+        "r": true,
+        "w": true
+      }
+    },
+    "_created_at": {
+      "$date": "2023-09-19T09:25:20.205Z"
+    },
+    "_updated_at": {
+      "$date": "2023-09-28T09:47:03.968Z"
+    }
+  },
+  {
+    "_id": "Bz90QJSYMw",
+    "name": "contracts_Guest",
+    "_wperm": [
+      "ZhOmhqvw7S"
+    ],
+    "_rperm": [
+      "*",
+      "ZhOmhqvw7S"
+    ],
+    "_acl": {
+      "ZhOmhqvw7S": {
+        "w": true,
+        "r": true
+      },
+      "*": {
+        "r": true
+      }
+    },
+    "_created_at": {
+      "$date": "2023-10-20T07:56:10.094Z"
+    },
+    "_updated_at": {
+      "$date": "2023-10-20T10:50:36.229Z"
+    }
+  },
+  {
+    "_id": "Tb14x04JK2",
+    "name": "contracts_User",
+    "_wperm": [
+      "*"
+    ],
+    "_rperm": [
+      "*"
+    ],
+    "_acl": {
+      "*": {
+        "r": true,
+        "w": true
+      }
+    },
+    "_created_at": {
+      "$date": "2023-09-19T09:25:20.205Z"
+    },
+    "_updated_at": {
+      "$date": "2023-10-20T06:54:09.836Z"
+    }
+  }]

apps/mongo/default-data/legadraGCva._SCHEMA.json

@@ -0,0 +1,657 @@
+[{
+    "_id": "_Role",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "name": "string",
+    "users": "relation<_User>",
+    "roles": "relation<_Role>",
+    "_metadata": {
+      "indexes": {
+        "name_1": {
+          "name": 1
+        },
+        "_id_": {
+          "_id": 1
+        }
+      },
+      "class_permissions": {
+        "get": {
+          "*": true
+        },
+        "find": {
+          "*": true
+        },
+        "count": {
+          "*": true
+        },
+        "create": {
+          "*": true
+        },
+        "update": {
+          "*": true
+        },
+        "delete": {
+          "*": true
+        },
+        "addField": {},
+        "protectedFields": {
+          "*": []
+        }
+      }
+    }
+  },
+  {
+    "_id": "_Session",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "user": "*_User",
+    "installationId": "string",
+    "sessionToken": "string",
+    "expiresAt": "date",
+    "createdWith": "object",
+    "_metadata": {
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      }
+    }
+  },
+  {
+    "_id": "_User",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "username": "string",
+    "email": "string",
+    "emailVerified": "boolean",
+    "authData": "object",
+    "_metadata": {
+      "indexes": {
+        "phone_1": {
+          "phone": 1
+        },
+        "username_1": {
+          "username": 1
+        },
+        "case_insensitive_username": {
+          "username": 1
+        },
+        "email_1": {
+          "email": 1
+        },
+        "case_insensitive_email": {
+          "email": 1
+        },
+        "_id_": {
+          "_id": 1
+        }
+      },
+      "class_permissions": {
+        "get": {
+          "*": true
+        },
+        "find": {
+          "*": true
+        },
+        "count": {
+          "*": true
+        },
+        "create": {
+          "*": true
+        },
+        "update": {
+          "*": true
+        },
+        "delete": {
+          "*": true
+        },
+        "addField": {},
+        "protectedFields": {
+          "*": [
+            "email"
+          ]
+        }
+      }
+    },
+    "name": "string",
+    "phone": "string",
+    "ProfilePic": "string"
+  },
+  {
+    "_id": "contracts_Contactbook",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "Phone": "string",
+    "Email": "string",
+    "Name": "string",
+    "UserRole": "string",
+    "UserId": "*_User",
+    "CreatedBy": "*_User",
+    "_metadata": {
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      }
+    },
+    "TenantId": "*partners_Tenant",
+    "TourStatus": "array"
+  },
+  {
+    "_id": "contracts_Document",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "_metadata": {
+      "fields_options": {
+        "EnablePhoneOTP": {
+          "required": "false"
+        },
+        "IsCompleted": {
+          "required": "false",
+          "defaultValue": false
+        },
+        "IsDeclined": {
+          "required": "false",
+          "defaultValue": false
+        },
+        "SendinOrder": {
+          "required": "false",
+          "defaultValue": false
+        },
+        "ExpiryDate": {
+          "required": "false"
+        },
+        "Signers": {
+          "required": "false"
+        },
+        "Name": {
+          "required": "false"
+        },
+        "AgreementValidUntil": {
+          "required": "false"
+        },
+        "URL": {
+          "required": "false"
+        },
+        "RemindOnceInEvery": {
+          "required": "false",
+          "defaultValue": 5
+        },
+        "EnableEmailOTP": {
+          "required": "false"
+        },
+        "AutomaticReminders": {
+          "required": "false",
+          "defaultValue": false
+        },
+        "SentToOthers": {
+          "required": "false",
+          "defaultValue": false
+        },
+        "TimeToCompleteDays": {
+          "required": "false",
+          "defaultValue": 15
+        },
+        "Recipients": {
+          "required": "false"
+        },
+        "Type": {
+          "required": "false"
+        },
+        "Description": {
+          "required": "false"
+        },
+        "ExtUserPtr": {
+          "required": "false"
+        },
+        "SignedUrl": {
+          "required": "false"
+        },
+        "AuditTrail": {
+          "required": "false"
+        },
+        "Placeholders": {
+          "required": "false"
+        },
+        "Folder": {
+          "required": "false"
+        },
+        "Note": {
+          "required": false
+        },
+        "Clauses": {
+          "required": false
+        },
+        "AgreementDelta": {
+          "required": false
+        }
+      },
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      },
+      "class_permissions": {
+        "get": {
+          "*": true
+        },
+        "find": {
+          "*": true
+        },
+        "count": {
+          "*": true
+        },
+        "create": {
+          "*": true
+        },
+        "update": {
+          "*": true
+        },
+        "delete": {
+          "*": true
+        },
+        "addField": {},
+        "protectedFields": {
+          "*": []
+        }
+      }
+    },
+    "EnablePhoneOTP": "boolean",
+    "IsCompleted": "boolean",
+    "IsDeclined": "boolean",
+    "SendinOrder": "boolean",
+    "ExpiryDate": "date",
+    "Signers": "array",
+    "Name": "string",
+    "AgreementValidUntil": "date",
+    "URL": "string",
+    "RemindOnceInEvery": "number",
+    "EnableEmailOTP": "boolean",
+    "AutomaticReminders": "boolean",
+    "SentToOthers": "boolean",
+    "TimeToCompleteDays": "number",
+    "Recipients": "array",
+    "Type": "string",
+    "Description": "string",
+    "ExtUserPtr": "*contracts_Users",
+    "SignedUrl": "string",
+    "AuditTrail": "array",
+    "Placeholders": "array",
+    "Folder": "*contracts_Document",
+    "Note": "string",
+    "CreatedBy": "*_User",
+    "Clauses": "array",
+    "AgreementDelta": "array"
+  },
+  {
+    "_id": "contracts_Signature",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "_metadata": {
+      "fields_options": {
+        "SignatureName": {
+          "required": "false"
+        },
+        "SignText": {
+          "required": "false"
+        },
+        "ImageURL": {
+          "required": "false"
+        },
+        "SignTextFont": {
+          "required": "false"
+        },
+        "InitialsText": {
+          "required": "false"
+        },
+        "InitialsFont": {
+          "required": "false"
+        },
+        "UserId": {
+          "required": false
+        }
+      },
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      },
+      "class_permissions": {
+        "get": {
+          "*": true
+        },
+        "find": {
+          "*": true
+        },
+        "count": {
+          "*": true
+        },
+        "create": {
+          "*": true
+        },
+        "update": {
+          "*": true
+        },
+        "delete": {
+          "*": true
+        },
+        "addField": {},
+        "protectedFields": {
+          "*": []
+        }
+      }
+    },
+    "SignatureName": "string",
+    "SignText": "string",
+    "ImageURL": "string",
+    "SignTextFont": "string",
+    "InitialsText": "string",
+    "InitialsFont": "string",
+    "Initials": "string",
+    "UserId": "*_User"
+  },
+  {
+    "_id": "contracts_Users",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "_metadata": {
+      "fields_options": {
+        "Name": {
+          "required": "false"
+        },
+        "Phone": {
+          "required": "false"
+        },
+        "JobTitle": {
+          "required": "false"
+        },
+        "Email": {
+          "required": "false"
+        },
+        "Company": {
+          "required": "false"
+        },
+        "UserId": {
+          "required": "false"
+        },
+        "TenantId": {
+          "required": "false"
+        },
+        "TourStatus": {
+          "required": false
+        },
+        "IsContactEntry": {
+          "required": false,
+          "defaultValue": false
+        },
+        "ShareWithTeam": {
+          "required": false
+        }
+      },
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      },
+      "class_permissions": {
+        "get": {
+          "*": true
+        },
+        "find": {
+          "*": true
+        },
+        "count": {
+          "*": true
+        },
+        "create": {
+          "*": true
+        },
+        "update": {
+          "*": true
+        },
+        "delete": {
+          "*": true
+        },
+        "addField": {},
+        "protectedFields": {
+          "*": []
+        }
+      }
+    },
+    "Name": "string",
+    "Phone": "string",
+    "JobTitle": "string",
+    "Email": "string",
+    "Company": "string",
+    "UserId": "*_User",
+    "TenantId": "*partners_Tenant",
+    "TourStatus": "array",
+    "Plan": "object",
+    "UserRole": "string",
+    "Next_billing_date": "date",
+    "Customer_id": "string",
+    "Subscription_id": "string",
+    "CreatedBy": "*_User",
+    "IsContactEntry": "boolean",
+    "ShareWithTeam": "boolean"
+  },
+  {
+    "_id": "partners_DataFiles",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "FileSize": "number",
+    "FileUrl": "string",
+    "_metadata": {
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      }
+    }
+  },
+  {
+    "_id": "partners_Subscriptions",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date"
+  },
+  {
+    "_id": "partners_Tenant",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "EmailAddress": "string",
+    "TenantName": "string",
+    "IsActive": "boolean",
+    "CreatedBy": "*_User",
+    "ContactNumber": "string",
+    "UserId": "*_User",
+    "_metadata": {
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      }
+    }
+  },
+  {
+    "_id": "partners_TenantCredits",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "usedStorage": "number",
+    "PartnersTenant": "*partners_Tenant",
+    "_metadata": {
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      }
+    }
+  },
+  {
+    "_id": "w_appinfo",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "orgId": "string",
+    "forgetpassFormId": "string",
+    "mainformObjId": "string",
+    "applogo": "string",
+    "fbAppId": "string",
+    "appname": "string",
+    "loginFormId": "string",
+    "baseurl": "string",
+    "org_name": "string",
+    "signUpFormId": "string",
+    "defaultmenuid": "string",
+    "version": "string",
+    "formTitle": "string",
+    "googleClietId": "string",
+    "_metadata": {
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      },
+      "class_permissions": {
+        "get": {
+          "*": true
+        },
+        "find": {
+          "*": true
+        },
+        "count": {
+          "*": true
+        },
+        "create": {
+          "*": true
+        },
+        "update": {
+          "*": true
+        },
+        "delete": {
+          "*": true
+        },
+        "addField": {
+          "*": true
+        }
+      },
+      "fields_options": {
+        "uploadUrl": {
+          "required": false
+        }
+      }
+    },
+    "class": "string",
+    "LandingPageId": "string",
+    "accessType": "string",
+    "settings": "array",
+    "appTitle": "string",
+    "metaDescription": "string",
+    "branding_image": "string",
+    "fev_Icon": "string",
+    "defaultRole": "string",
+    "results": "array",
+    "loginType": "string",
+    "createdBy": "*_User",
+    "domain": "string",
+    "enableWebNotification": "boolean",
+    "allowWhiteLabel": "boolean",
+    "uploadUrl": "string"
+  },
+  {
+    "_id": "w_dashboard",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "dbDescription": "string",
+    "dbTitle": "string",
+    "bgColor": "string",
+    "rows": "array",
+    "_metadata": {
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      }
+    },
+    "appId": "*w_appinfo"
+  },
+  {
+    "_id": "w_formV3",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "description": "string",
+    "uiSchema": "object",
+    "jsonSchema": "object",
+    "_metadata": {
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      }
+    },
+    "class": "string",
+    "success_message": "string",
+    "restrict_form_entry": "object",
+    "send_email": "boolean",
+    "restrict_form_access": "object",
+    "email_template": "object",
+    "form_permission": "string",
+    "success_redirect": "string",
+    "form_buttons": "object",
+    "buttons": "object",
+    "appId": "*w_appinfo",
+    "rpTitle": "string",
+    "rpDescription": "string",
+    "rpType": "string",
+    "bgColor": "string",
+    "rows": "array",
+    "redirect_id": "string",
+    "formACL": "object",
+    "userSchema": "object",
+    "isRegisterForm": "boolean",
+    "liveValidate": "boolean",
+    "noValidate": "boolean",
+    "validFunction": "string",
+    "help": "object",
+    "name": "string",
+    "phone": "string",
+    "email": "string",
+    "password": "string",
+    "username": "string",
+    "role": "string",
+    "helpText": "object",
+    "helpTextForm": "object",
+    "hideActionsAfter": "number",
+    "rules": "array",
+    "extraActions": "object",
+    "persistentFields": "array"
+  },
+  {
+    "_id": "w_menu",
+    "objectId": "string",
+    "updatedAt": "date",
+    "createdAt": "date",
+    "menuTitle": "string",
+    "menuType": "string",
+    "menuItems": "array",
+    "_metadata": {
+      "indexes": {
+        "_id_": {
+          "_id": 1
+        }
+      }
+    },
+    "appId": "*w_appinfo"
+  }]

apps/mongo/default-data/legadraGCva.w_dashboard.json

@@ -0,0 +1,104 @@
+[{
+    "_id": "35KBoSgoAK",
+    "rows": [
+      {
+        "columns": [
+          {
+            "colxs": "12",
+            "colmd": "6",
+            "collg": "6",
+            "widget": {
+              "type": "Card",
+              "icon": "fas fa-signature",
+              "bgColor": "#f0058e",
+              "label": "Need your Signature",
+              "description": null,
+              "data": {
+                "id": "e04ee9dc-932d-6b80-0202-703fd154eb74",
+                "queryType": "",
+                "class": "contracts_Document",
+                "query": "where={\"$and\":[{\"AuditTrail.UserPtr\":{\"$ne\":{\"__type\":\"Pointer\",\"className\": \"contracts_Users\",\"objectId\":\"#objectId#\"}}},{\"AuditTrail.Activity\":{\"$ne\":\"Signed\"}}],\"Signers\":{\"$in\":[{\"__type\":\"Pointer\",\"className\":\"contracts_Users\",\"objectId\":\"#objectId#\"}]},\"IsDeclined\":{\"$ne\":true},\"IsCompleted\":{\"$ne\":true},\"Type\":{\"$ne\":\"Folder\"},\"Placeholders\":{\"$ne\":null},\"ExpiryDate\":{\"#*gt\":{\"__type\":\"#Date#\",\"iso\":\"#today#\"}}}&count=1",
+                "key": "count",
+                "Redirect_type": "Report",
+                "Redirect_id": "4Hhwbp482K",
+                "tourSection": "tourcard1",
+                "tourMessage": "This card shows the aggregate count of documents that are awaiting your signature. Clicking on this card will seamlessly take you to the detailed list of such documents for your review and action."
+              }
+            }
+          },
+          {
+            "colxs": "12",
+            "colmd": "6",
+            "collg": "6",
+            "widget": {
+              "type": "Card",
+              "icon": "fas fa-sign-out-alt",
+              "bgColor": "#g0058e",
+              "label": "Out for signatures",
+              "description": null,
+              "data": {
+                "id": "c1935cc0-28d4-3d73-b72a-8c1e3d18a17f",
+                "queryType": "",
+                "class": "contracts_Document",
+                "query":  "where={\"IsDeclined\":{\"$ne\":true},\"IsCompleted\":{\"$ne\":true},\"Type\":{\"$ne\":\"Folder\"},\"Placeholders\":{\"$ne\":null},\"ExpiryDate\":{\"#*gt\":{\"__type\":\"#Date#\",\"iso\":\"#today#\"}}}&include=Signers,AuditTrail.UserPtr",
+                "key": "count",
+                "Redirect_type": "Report",
+                "Redirect_id": "1MwEuxLEkF",
+                "tourSection": "tourcard2",
+                "tourMessage": "This card indicates the total number of documents you've sent out for signatures. A single click on this card will navigate you to a comprehensive list of these documents, allowing you to monitor their status."
+              }
+            }
+          },
+          {
+            "colxs": "12",
+            "colmd": "6",
+            "collg": "6",
+            "widget": {
+              "type": "report",
+              "reportId": "5Go51Q7T8r",
+              "data": {
+                "tourSection": "tourreport1",
+                "tourMessage": "Here lies a curated list of documents that are pending your signature. These are requests from other users that require your immediate attention for completion."
+              }
+            }
+          },
+          {
+            "colxs": "12",
+            "colmd": "6",
+            "collg": "6",
+            "widget": {
+              "type": "report",
+              "reportId": "d9k3UfYHBc",
+              "data": {
+                "tourSection": "tourreport2",
+                "tourMessage": "This area displays all the documents you've dispatched for signatures from other parties. It serves as a real-time tracker for documents pending external approval."
+              }
+            }
+          },
+          {
+            "colxs": "12",
+            "colmd": "12",
+            "collg": "12",
+            "widget": {
+              "type": "report",
+              "reportId": "kC5mfynCi4",
+              "data": {
+                "tourSection": "tourreport3",
+                "tourMessage": "In this section, you'll find your draft documents awaiting completion. These are the documents you've initiated but haven't yet finalized for sending."
+              }
+            }
+          }
+        ]
+      }
+    ],
+    "_p_appId": "w_appinfo$aIPmIvMzGM",
+    "dbTitle": "Dashboard",
+    "dbDescription": null,
+    "bgColor": "#ffffff",
+    "_created_at": {
+      "$date": "2023-09-04T13:17:26.707Z"
+    },
+    "_updated_at": {
+      "$date": "2023-09-27T04:53:20.395Z"
+    }
+  }]

apps/mongo/default-data/legadraGCva.w_menu.json

@@ -0,0 +1,272 @@
+[{
+    "_id": "H9vRfEYKhT",
+    "_created_at": {
+      "$date": "2023-09-04T14:04:00.669Z"
+    },
+    "_updated_at": {
+      "$date": "2023-10-20T06:27:02.314Z"
+    },
+    "_p_appId": "w_appinfo$aIPmIvMzGM",
+    "menuItems": [
+      {
+        "icon": "fas fa-tachometer-alt",
+        "title": "Dashboard",
+        "target": "",
+        "pageType": "dashboard",
+        "description": "",
+        "objectId": "35KBoSgoAK"
+      },
+      {
+        "icon": "far fa-newspaper",
+        "title": "New Document",
+        "target": "_self",
+        "pageType": null,
+        "description": null,
+        "objectId": null,
+        "children": [
+          {
+            "icon": "fas fa-pen-nib",
+            "title": "Sign yourself",
+            "target": "_self",
+            "pageType": "form",
+            "description": "",
+            "objectId": "sHAnZphf69"
+          },
+          {
+            "icon": "fas fa-file-signature",
+            "title": "Request signatures",
+            "target": "_self",
+            "pageType": "form",
+            "description": "",
+            "objectId": "8mZzFxbG1z"
+          }
+        ]
+      },
+      {
+        "icon": "fas fa-folder",
+        "title": "OpenSignDrive™",
+        "target": "_self",
+        "pageType": "mf",
+        "description": "",
+        "objectId": "remoteUrl=aHR0cHM6Ly9xaWstYWktb3JnLmdpdGh1Yi5pby9TaWduLU1pY3JvYXBwVjIvcmVtb3RlRW50cnkuanM=&moduleToLoad=AppRoutes&remoteName=signmicroapp/legadrive"
+      },
+      {
+        "icon": "fas fa-address-card",
+        "title": "Reports",
+        "target": "_self",
+        "pageType": null,
+        "description": "",
+        "objectId": null,
+        "children": [
+          {
+            "icon": "fas fa-signature",
+            "title": "Need your sign",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "4Hhwbp482K"
+          },
+          {
+            "icon": "fas fa-tasks",
+            "title": "In Progress",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "1MwEuxLEkF"
+          },
+          {
+            "icon": "fas fa-check-circle",
+            "title": "Completed",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "kQUoW4hUXz"
+          },
+          {
+            "icon": "fas fa-edit",
+            "title": "Drafts",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "ByHuevtCFY"
+          },
+          {
+            "icon": "fas fa-times-circle",
+            "title": "Declined",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "UPr2Fm5WY3"
+          },
+          {
+            "icon": "fas fa-hourglass-end",
+            "title": "Expired",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "zNqBHXHsYH"
+          }
+        ]
+      },
+      {
+        "icon": "fas fa-cog",
+        "title": "Settings",
+        "target": "_self",
+        "pageType": null,
+        "description": "",
+        "objectId": null,
+        "children": [
+          {
+            "icon": "fas fa-pen-fancy",
+            "title": "My Signature",
+            "target": "_self",
+            "pageType": "mf",
+            "description": "",
+            "objectId": "remoteUrl=aHR0cHM6Ly9xaWstYWktb3JnLmdpdGh1Yi5pby9TaWduLU1pY3JvYXBwVjIvcmVtb3RlRW50cnkuanM=&moduleToLoad=AppRoutes&remoteName=signmicroapp/managesign"
+          }
+        ]
+      }
+    ],
+    "menuTitle": "Default Menu",
+    "menuType": "Side Menu"
+  },
+  {
+    "_id": "VPh91h0ZHk",
+    "_created_at": {
+      "$date": "2023-09-04T14:16:15.424Z"
+    },
+    "_updated_at": {
+      "$date": "2023-10-20T06:25:59.660Z"
+    },
+    "_p_appId": "w_appinfo$aIPmIvMzGM",
+    "menuItems": [
+      {
+        "icon": "fas fa-tachometer-alt",
+        "title": "Dashboard",
+        "target": "",
+        "pageType": "dashboard",
+        "description": "",
+        "objectId": "35KBoSgoAK"
+      },
+      {
+        "icon": "far fa-newspaper",
+        "title": "New Document",
+        "target": "_self",
+        "pageType": null,
+        "description": null,
+        "objectId": null,
+        "children": [
+          {
+            "icon": "fas fa-pen-nib",
+            "title": "Sign yourself",
+            "target": "_self",
+            "pageType": "form",
+            "description": "",
+            "objectId": "sHAnZphf69"
+          },
+          {
+            "icon": "fas fa-file-signature",
+            "title": "Request signatures",
+            "target": "_self",
+            "pageType": "form",
+            "description": "",
+            "objectId": "8mZzFxbG1z"
+          }
+        ]
+      },
+      {
+        "icon": "fas fa-folder",
+        "title": "OpenSignDrive™",
+        "target": "_self",
+        "pageType": "mf",
+        "description": "",
+        "objectId": "remoteUrl=aHR0cHM6Ly9xaWstYWktb3JnLmdpdGh1Yi5pby9TaWduLU1pY3JvYXBwVjIvcmVtb3RlRW50cnkuanM=&moduleToLoad=AppRoutes&remoteName=signmicroapp/legadrive"
+      },
+      {
+        "icon": "fas fa-address-card",
+        "title": "Reports",
+        "target": "_self",
+        "pageType": null,
+        "description": "",
+        "objectId": null,
+        "children": [
+          {
+            "icon": "fas fa-signature",
+            "title": "Need your sign",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "4Hhwbp482K"
+          },
+          {
+            "icon": "fas fa-tasks",
+            "title": "In Progress",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "1MwEuxLEkF"
+          },
+          {
+            "icon": "fas fa-check-circle",
+            "title": "Completed",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "kQUoW4hUXz"
+          },
+          {
+            "icon": "fas fa-edit",
+            "title": "Drafts",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "ByHuevtCFY"
+          },
+          {
+            "icon": "fas fa-times-circle",
+            "title": "Declined",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "UPr2Fm5WY3"
+          },
+          {
+            "icon": "fas fa-hourglass-end",
+            "title": "Expired",
+            "target": "_self",
+            "pageType": "report",
+            "description": "",
+            "objectId": "zNqBHXHsYH"
+          }
+        ]
+      },
+      {
+        "icon": "fas fa-cog",
+        "title": "Settings",
+        "target": "_self",
+        "pageType": null,
+        "description": "",
+        "objectId": null,
+        "children": [
+          {
+            "icon": "fas fa-pen-fancy",
+            "title": "My Signature",
+            "target": "_self",
+            "pageType": "mf",
+            "description": "",
+            "objectId": "remoteUrl=aHR0cHM6Ly9xaWstYWktb3JnLmdpdGh1Yi5pby9TaWduLU1pY3JvYXBwVjIvcmVtb3RlRW50cnkuanM=&moduleToLoad=AppRoutes&remoteName=signmicroapp/managesign"
+          },
+          {
+            "icon": "far fa-user",
+            "title": "Add User",
+            "target": "_self",
+            "pageType": "form",
+            "description": "",
+            "objectId": "lM0xRnM3iE"
+          }
+        ]
+      }
+    ],
+    "menuTitle": "Admin Menu",
+    "menuType": "Side Menu"
+  }]

apps/mongo/mongo-init.sh

@@ -0,0 +1,17 @@
+#!/bin/bash
+
+echo "Starting MongoDB initial data import..."
+
+# Wait for MongoDB to fully start
+sleep 10
+
+# Import the data
+mongoimport --host localhost --db OpenSignDB --collection _Role --type json --file /docker-entrypoint-initdb.d/legadraGCva._Role.json --jsonArray
+mongoimport --host localhost --db OpenSignDB --collection _SCHEMA --type json --file /docker-entrypoint-initdb.d/legadraGCva._SCHEMA.json --jsonArray
+mongoimport --host localhost --db OpenSignDB --collection w_appinfo --type json --file /docker-entrypoint-initdb.d/legadraGCva.w_appinfo.json --jsonArray
+mongoimport --host localhost --db OpenSignDB --collection w_dashboard --type json --file /docker-entrypoint-initdb.d/legadraGCva.w_dashboard.json --jsonArray
+mongoimport --host localhost --db OpenSignDB --collection w_menu --type json --file /docker-entrypoint-initdb.d/legadraGCva.w_menu.json --jsonArray
+
+
+
+echo "MongoDB initial data import done."

cert/local-dev_base64_pfx

@@ -0,0 +1,54 @@
+MIIKCQIBAzCCCc8GCSqGSIb3DQEHAaCCCcAEggm8MIIJuDCCBG8GCSqGSIb3DQEH
+BqCCBGAwggRcAgEAMIIEVQYJKoZIhvcNAQcBMBwGCiqGSIb3DQEMAQYwDgQIpumu
+bFabBWACAggAgIIEKDqHS7Icd5MzIBk1dBokGK2s+5a2fA4308WA1QzEWmczqVYI
+z6lYmW8qsiZIw4PFkRzdIx1+zCmP8jgWiiqh5RKnbHYmh1JPNyx9SqmUDILDXmjg
+KxO9agRw9LXge4hgRL7YW0TxYZYw4EeXV9Yr7kcOq9DoO2MoRikJ+2Tuvvq/hfuV
+9zFHsz4jpf7W95k1IeH6bZ92klz5R1e/EK8JuHy592i/u+BxxW1vTkiPpTaHD6s9
+1lDSkT1j0LIDU6l9gVvJvFBV8j88vet/Z4QkTbHPMYvBnKNRstKuOvDasEJE4RkA
+PV4TfBwFF6uvREZI1vBboM/18pzeyjoRX+mlJNfcH3kh1tkck+Jg+M2bLXAH1EdD
+GRwENvnTNW1CFIn37VVja7SFBQNXA+E6rejmqtUmZ5XktSINDBUyjow9XuYTUtI/
+sgcRSC0aB0EKKpphbFPp1niKCLm1ef33e+bWyWbtR2L2Kc3ETmhjNADpyapAGmzc
+LP2BafGaKj18KiLAG4GL6+kXk0GUz7Fw5q8H8RY1T33o+xjWvC0+aJgvr65qWdKw
++ug6wuu4Cr2kFEuXxPKsnYqmE5NT/x+lfunlZ5iEQN3w2XO5J2u2eMXVRUsPH2T6
+0sJKomjY0RB1JsqZBnyleWm+tYo0RpVAyJ3NGBp9dVb7a3Qw6jNZBG/xMW+gvtUJ
+q6hfK/cD3cagD0NQFVD5STMOuGOSqq/bbwAKjZ/lrPmCCYATKwkjAFybYfHJVrrW
+Y2tQgCQ/zrZLIxQjp7F17hU0+gT54x0MpF6AoqIM/qqNnHrQ0fi50ECmLvx3SqYa
+nvjvt/HZhMZfqRXiXjeicIwpnNoG7+uQknySk+7cc9GNhHZR7cfPfkTpgvuuebrQ
+l5YW+k9tG+xrX8g72nvtFMnammlBixlFwECJaEszEQk5tc2ti8uG2z+kGnFoDoBV
+M6ZVMpKDJzXPxLdzT6ChIPyatjIkqOKe6vDpnmzcoEhbBhmtkVjWFA2dfX846ugV
+y1QiecWgk8pMNWhh3IDd05v/wzbFwNcq+Gi+1dZsPmFH+egIcrQKZu2r3jCJtGHh
+DNG/nyf/anqvKXF90bi4hRT3vdDXXuWgY7EUwfn9h5jYabCO6HsQxQOBjFYNmBrh
+MfaiBZe72E8fzNAfIlwDcJ4AWY1SOM7hi8bqfRWw1NtNxuMUiRFoR31O6XkQauye
+9hAmpdlZHZXtJ6LM0QaWkPJmG3058GMtIn/qS60V9nINh+zXhwza/1pnFB+e9MWc
+hAPgo0nn55FusM//g1nM31PKe+nOm3Jyp0nEQ4m8aDtJS63o2fvp3e2KJbPWQMHE
+a83W975diWg4NTdevV9lFpNllHclVoPoavUHIzHd7HF9TcPpjbXJSUZ7cITHHefr
+kQTa/2G9cWuRhN9GKIHBdr13nfEvMIIFQQYJKoZIhvcNAQcBoIIFMgSCBS4wggUq
+MIIFJgYLKoZIhvcNAQwKAQKgggTuMIIE6jAcBgoqhkiG9w0BDAEDMA4ECDgnjfOf
+AjArAgIIAASCBMgkbVuptroBdyMY5gl/eBQj5+iAV02YSaF969ihStLSWI4x5FAf
+HuDgqCyEMSl4RHG8ZvNaO9JoNfIpMK/TPQBoQRCzE2Vjf66VTERaQtU6h7tZrbQt
+K96n9eqvohm/vXbXe08fsodYp2s79kAvKgpuGG5iX77qYVzJHBPed87cvczo4ToP
+CpurDpByt8fGEmjtcikal8o+H9uoHjcFwqMigX1Q7IEjuKXrb5e6wTvxMRob8yfv
+LVl6ahteKSkWCMb6rLZ5f12jDoCGX/YXRrSsU9t/lXe0Nxv5i7c8flb2EsNtwygD
+fexVvn5u6ble6RDYNpuQkPgF41HyZh+JvGAF6i1r4tJPL9Pf4HnjEB8Y8IHgon+w
+T5I+8LTgcrWyhptzblXMjKySTEp9OEa2cCVwZkl4z43PWJ5oIAQ2IDTOQ603/5o/
+d9KA76/zMPQ5O0gv17OA7kwFv98v6sTcR4vgkQZqnyDpJSEPHyNxhw2MSBqS3jq3
+YPhRz+3Ei1oFp9uYFhzn39f9gzNi++X9pOjSrDb8v3mcDXZKNrxQLuoRMSf0eQNI
+dgJRqj/fuqNZ5ac3kd4P5BALCsnA1tM27zYrgUdpOnrc2D9FBthEjpRlQKMMzhQf
+cNMFWmoNjakDilvvLcsQeQ3P6cXbN1ODoNnjgK3VzcmeKyzW2PrTXEPHARUM3j4V
+sZzGaUOVKLqaaDrXWQKC0vrTvxP2WMfjQ1dTdXQP/kSZTXRC5rtB9tky38flBor0
+N9rhUDIGMs5qBvyrkV2hKXiW39G69p1KWY+Cw28AzY+CNSjePRi60TsnUxgcOS7i
+0AT25Gx3A4YqxmTY38MPB4wPcBPcw4hjNoQamaC9mqs+KVHcP5YHUlqykMeH0YVi
+J+ehytJE9xuDcfBOjxjadxp3/q/Lku4rky89gdJGFQWuuz75VulDywPRZRwmQTel
+sjEGMHR1zTOlPJdTDWhqaKmWvL4GhbCgEPIKwmqd1QKRTl/3Baa1nYllJeYVwiTT
+qLCkbA6qXrLGj1ENZxrKn9yqr8HwOoApjwhARu4LF/BRMgdkzelK2kOXHnZ26sZ2
+NY/MMtVmq4c59y6iQwmsbHr9tWGz3ahyXcZZufjNXU/AVnO1c92g7umAWZF4RohL
+gMmh57cAhN9PEbEv6j/6BT3XXp8jB0ywcRriYxfxwidviCKH/76Q4sytYJQaDFI1
+fnzmv0aDotbG2BdpWSiYPDOPm+3cmfjlULsn1FYWL4NDCX1f+C4lNtKVX9LU8c5M
+m8dA1DUlDfnuNO5/BShuoGXG2z4O/XwxIaRFizMxWS2sWurbAEFJ6oNw3kC7WSah
+NIe8aUC1umpc1Gk3X2f4Ytzj9OEqn0y55qoqLINJuejXMffF/gjopxHWadLVaVaj
+Q1SewrECuEXdSbBR/a10po24wmRtkmlvRJXJl7sG95xE5ZCqp+m6sRPWGdf1yKbV
+vyWNUe4Qvkxe4a0VAJpTyIGr980CKz/jkvtNQMobGl7AfhxKJ450wg454WcexMct
+BYXvZMSdUDCgMLlh0nHJHl5btrFWqE0Z/fqWmIknZL2jZ4J+2hdVl/xB/sUt6kcu
+txw+RfL+vNE8PxhTNaOdJFwD8yeN1mJ3yMUA8HHYpw9yljgxJTAjBgkqhkiG9w0B
+CRUxFgQUDYlgGVxSxuOknhQc256x3++7BDwwMTAhMAkGBSsOAwIaBQAEFFjASdYl
+3pXAXxZuvVvv9tsb4bdrBAhyb+KCIjp/gAICCAA=

cert/local_dev.crt

@@ -0,0 +1,23 @@
+-----BEGIN CERTIFICATE-----
+MIIDxTCCAq2gAwIBAgIUAZQ9QST2eBZz5k9pCa//mHQVm1QwDQYJKoZIhvcNAQEL
+BQAwcjELMAkGA1UEBhMCVVMxETAPBgNVBAgMCE5ldyBZb3JrMRYwFAYDVQQKDA1P
+cGVuU2lnbiBMYWJzMREwDwYDVQQDDAhPcGVuU2lnbjElMCMGCSqGSIb3DQEJARYW
+aGVsbG9Ab3BlbnNpZ25sYWJzLmNvbTAeFw0yMzExMTcxOTQ0MzZaFw0yNDExMTYx
+OTQ0MzZaMHIxCzAJBgNVBAYTAlVTMREwDwYDVQQIDAhOZXcgWW9yazEWMBQGA1UE
+CgwNT3BlblNpZ24gTGFiczERMA8GA1UEAwwIT3BlblNpZ24xJTAjBgkqhkiG9w0B
+CQEWFmhlbGxvQG9wZW5zaWdubGFicy5jb20wggEiMA0GCSqGSIb3DQEBAQUAA4IB
+DwAwggEKAoIBAQDLRKLjCSrvV1zAY2leWxCvdKTUaThpQO8nWPE/4v5ilMU2aRON
+krAnli0LUfQ/tIRWNurxwVjJ7HrW3ICLn05GBLjm2AUCfuMbJCvOEEdmFJqRY04n
+12fBZWz2KtzbZEIBVxLhc4E4g+Rz68hQA2fqwNuFdyGkkIbhVXpZIePEppqRmw+2
+uuDvIzJ77rdDaLqwwPoHWenZ2uZTedKXx7PGYs98psg35GvcpssqAJGAIAi9Rzg/
+ZV4oSpGXCjn/TJy61zTDbmPFCS/rC1XBWzBQfwDeBPDI18W6gPVX6N4dp0Ao+n8Q
+txeI6g4FzMH91KPbdbZXxm8rZqXj87VQs9trAgMBAAGjUzBRMB0GA1UdDgQWBBRN
+NtRPagnqovdmbrdhSUON9Rwd3TAfBgNVHSMEGDAWgBRNNtRPagnqovdmbrdhSUON
+9Rwd3TAPBgNVHRMBAf8EBTADAQH/MA0GCSqGSIb3DQEBCwUAA4IBAQBrcPyA7GHq
++ol9qjy9HijpoU5MaEiV9v9H8/0v7KoXUND3rMl37yFyjxGN8uda8WxpEhE2eFnk
+Xjtm2NgPrv8qeYHor/A3y5RfQhnlCY4kE1bREZGhcuKihR4rOtmComwFjx4Ibwwj
+4nKsflj6rXcWKSfSNHLkXFXHPYwyqRsKdtClrD/8YJn6LeeMlMjIYGGP4qyi2WwS
+Z8hExWGEMaMWiA9rxTMX6iu/parGH/pWU/55Os3WlcHPhlvqchBkQFJ+f8b+NYz0
+vIHQgwn4K5WMsZVLxoiUcU7cSqE/qhnP+pzBf8lRaYwd+zUznDvzpKKz6nFgeHok
+s8BK7JAKkIsl
+-----END CERTIFICATE-----

cert/local_dev.key

@@ -0,0 +1,30 @@
+-----BEGIN RSA PRIVATE KEY-----
+Proc-Type: 4,ENCRYPTED
+DEK-Info: DES-EDE3-CBC,5932FA9F02938D1B
+
+6gkkZP80WrVnR3dVwkimtfirSeYNXZlrXXBv+Ddjyq7FScqca7svJFd8ObC0xXjg
+nbxChDKS8SXcSjsNCTzixG0QReO5vaqovrpQoYbkSQ9GRMIVV8WuWNzlyMnypNJ4
+Z6hdpd5nkc1hIP8A6WcY3lA8msyHceU9IidEEb75CE743qsvUMko+XvqntZx/LNe
+0uK8Bs+cXeDzolpNX8ORKBTAOMii+WPlN2l+9ldsWTECEk4GmWa51QfpKouLxz5E
+u7fuGuku/nPKGb4Yj7sCgaD91UabRksDLS9UGDBqeNL+mogG3gY/Iu0/q2cUs6XR
+x1W6KW1eJHnOf1pAp7+G/zNqzdsxI3pnoR+nsV6/G0glBLar+Xqc99B568lnUWWv
+5NGN3Buz1axx1jPKIknDcT4Skmvt6TcmgrjoCQ9XvmNKVClpExQ+dKPmJI/EVNoU
+jjDZyfghcJ6BEMcTgoOBDiUrPM0273sb89u/AzyUA1tTciW2KARz6cOUTPWVRSRn
+4yXpkA4BJDpxRmK68BXorZLNxtvHk+on80c9tu5e+IVa3Gu1K7gc269TPmlIolAM
+v//i+jpwJ4Pe2IGVYdojMr15useUv7JC6/Kconnkx4q9rkMriguuXoQt8qW3kvEs
+Ur8KuibtDqhz2zGbsKboQFMOd6cdd+63dJCGAUqk4hFrSikTw3LhkXNcg9GZHq1z
+WFAfaA3x2jd+kJJ5xg8xMVEHax5IAOXDL2ektyPFpI1UZOuTc2i7FK6Y0NnXPkSN
+G/+DsKdLWT943mPfZj01mTRi3MgseDXsHMHGmmPxW9J4jv+WW4OdpHvd474QzJ8b
+vQmyiKq4XPHsuQUkzHVPbTrGe1B9z4p97YQKdEfXP2ChGFsUHCYQdpHyXwie2+pq
+E2rc7Bai0OuL0anYMSIvDrJ0DE8mVVaFur1b2Uz6ieCDlrOXnzD1BrcleiZem7og
+on/3oCUK+qxibCCcd5Hg2HtPusa43U0/UbCrqb2sww9iN36DLdtef/jlozKNiBx9
+e8ZztF6GtAKhIdgGW/M9TXMUZOYr7aaXO71MsqhwpVWZ5dNqagOBzhmd7Etokf1H
+O0WxJZ5XPDsnlKwYq86ssK+2RCNYAuvZoM3dRCysPvXoBFmsmHDzKdbKcckd8Vxr
+6P1yaCkB/iX55dUqwKfIuqxY3m4MA2Us9DD0BRxZOSUqHhzHHSogsLhqLQEQENA4
+U9N/v/za81UaU8nfkAswsGlTdTKjWH6Fzc0NeagbEFtpUaG/WIHPesUzU7ZNvMzR
+SQACVWl62Dley2g2eAgcrsIn78MbwNJI2YN5eXIw0K2MiMlGXWOEvkjIIVfjc0/d
+QxLFJwqShZBVO+jnAJ8jti7mP6PgskjtfHNAIphRJ4fm9h/Ns1YMpipBRVBDhbwY
+AOVT4bRw9Q3O5I0pe10ZdViAhexegQ8yGt3pUlKaUf9GRwIFEknjZ5Pc98V/R/wC
+INSIOZzDHj2uyZ3p7ToF1Z6kVVbbyfqDOnxUiV2ykR8ZqQMXNWcEJKH8qRqI+VHf
+oszD2BQvXgkWdrJtHuHjJCdDl03Y+daS5yP8IKTDucHvRv4ZSMghZ34SJTw5MaBP
+-----END RSA PRIVATE KEY-----

docker-compose.yml

@@ -5,25 +5,30 @@ services:
     build:
       context: ./apps/OpenSignServer
       dockerfile: Dockerfile
-    image: OpenSignServer-image
+    image: opensignserver-image
     container_name: OpenSignServer-container
     command: /usr/src/app/node_modules/.bin/nodemon server.js
     volumes:
       - ./apps/OpenSignServer/:/usr/src/app
       - /usr/src/app/node_modules
     ports:
-      - "5000:5000"
+      - "8080:8080"
     depends_on:
       - mongo
-    env_file: ./OpenSignServer/.env
+    env_file: .env
     environment:
       - NODE_ENV=development
     networks:
       - app-network
   mongo:
-    image: mongo
+    build:
+      context: ./apps/mongo
+      dockerfile: Dockerfile
+    container_name: mongo-container
+    image: opensign-mongo
     volumes:
       - data-volume:/data/db
+      - ./apps/mongo/mongo-init.sh:/docker-entrypoint-initdb.d/mongo-init.sh:ro
     ports:
       - "27017:27017"
     networks:
@@ -32,9 +37,10 @@ services:
     build:
       context: ./apps/OpenSign
       dockerfile: Dockerfile
-    image: OpenSign-image
+    image: opensign-image
     container_name: OpenSign-container
     command: npm start
+    env_file: .env
     volumes:
       - ./apps/OpenSign/:/usr/app
       - /usr/app/node_modules
@@ -53,4 +59,4 @@ volumes:
     data-volume:
     node_modules:
     web-root:
-      driver: local
+      driver: local

microfrontends/SignDocuments/.gitignore

@@ -9,7 +9,7 @@
 /coverage
 
 # production
-/build
+/mfbuild
 
 # misc
 .DS_Store

microfrontends/SignDocuments/package-lock.json

@@ -36,6 +36,7 @@
         "react-scrollbars-custom": "^4.1.1",
         "react-signature-canvas": "^1.0.6",
         "reactour": "^1.19.1",
+        "select-dom": "^9.0.0",
         "web-vitals": "^2.1.4"
       }
     },
@@ -18702,6 +18703,20 @@
       "resolved": "https://registry.npmjs.org/scrollparent/-/scrollparent-2.0.1.tgz",
       "integrity": "sha512-HSdN78VMvFCSGCkh0oYX/tY4R3P1DW61f8+TeZZ4j2VLgfwvw0bpRSOv4PCVKisktIwbzHCfZsx+rLbbDBqIBA=="
     },
+    "node_modules/select-dom": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/select-dom/-/select-dom-9.0.0.tgz",
+      "integrity": "sha512-AD1NfASSwJQc1Sy713R1vT9CMmUSUo2tg0j1FtkRGIxllTphDrkuH2pYYvhRlGaoq3pS6tcKkKS/diEZLy+7BQ==",
+      "dependencies": {
+        "typed-query-selector": "^2.11.0"
+      },
+      "engines": {
+        "node": ">=16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/fregante"
+      }
+    },
     "node_modules/select-hose": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/select-hose/-/select-hose-2.0.0.tgz",
@@ -20203,6 +20218,11 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/typed-query-selector": {
+      "version": "2.11.0",
+      "resolved": "https://registry.npmjs.org/typed-query-selector/-/typed-query-selector-2.11.0.tgz",
+      "integrity": "sha512-qBs4sfmnLlPOyo2oSdvHbIFHe2CPgU54/1UGfSNceb7LARpIEVxUaeRX0Doje6oKpuySS2stqy90R3YrynR8Kg=="
+    },
     "node_modules/typedarray-to-buffer": {
       "version": "3.1.5",
       "resolved": "https://registry.npmjs.org/typedarray-to-buffer/-/typedarray-to-buffer-3.1.5.tgz",

microfrontends/SignDocuments/package.json

@@ -2,6 +2,7 @@
   "name": "signmicroapp",
   "version": "0.1.0",
   "private": true,
+  "homepage": "./mfbuild",
   "dependencies": {
     "@radix-ui/themes": "^1.1.2",
     "@react-pdf/renderer": "^3.1.9",
@@ -31,11 +32,12 @@
     "react-scrollbars-custom": "^4.1.1",
     "react-signature-canvas": "^1.0.6",
     "reactour": "^1.19.1",
+    "select-dom": "^9.0.0",
     "web-vitals": "^2.1.4"
   },
   "scripts": {
     "start": "mf-cra start",
-    "build": "CI=false && mf-cra build && mv build ../../apps/OpenSign/public/mfbuild",
+    "build": "CI=false && PUBLIC_URL=./mfbuild BUILD_PATH='./mfbuild' mf-cra build && mv mfbuild ../../apps/OpenSign/public",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },

microfrontends/SignDocuments/src/Component/Certificate/Certificate.js

@@ -1,7 +1,15 @@
 import React, { useEffect, useState } from "react";
 import "./certificate.css";
+import opensignLogo from "../../assests/open-sign-logo.png";
 
-import { Page, Text, View, Document, StyleSheet } from "@react-pdf/renderer";
+import {
+  Page,
+  Text,
+  View,
+  Document,
+  StyleSheet,
+  Image
+} from "@react-pdf/renderer";
 
 function Certificate({ pdfData }) {
   const [isMultiSigners, setIsMultiSigners] = useState();
@@ -33,86 +41,50 @@ function Certificate({ pdfData }) {
     page: {
       borderRadius: "5px",
       padding: "10px",
-      backgroundColor: "white",
+      backgroundColor: "white"
     },
     section1: {
       border: "1px solid rgb(177, 174, 174)",
-      padding: "20px",
+      padding: "20px"
     },
     textStyle: {
       fontWeight: "bold",
       fontSize: "11px",
-      marginBottom: "10px",
+      marginBottom: "10px"
     },
     textStyle2: {
       fontWeight: "600",
       fontSize: "11px",
       marginBottom: "10px",
-      color: "gray",
+      color: "gray"
     },
+    image: {
+      width: "71px",
+      height: "17px"
+    }
   });
 
   const generatedDate = () => {
     const newDate = new Date();
-    const localExpireDate = newDate.toLocaleDateString("en-US", {
-      day: "numeric",
-      month: "long",
-      year: "numeric",
-    });
-
-    var currentOffset = newDate.getTimezoneOffset();
-
-    var ISTOffset = 330; // IST offset UTC +5:30
-
-    var ISTTime = new Date(
-      newDate.getTime() + (ISTOffset + currentOffset) * 60000
-    );
-
-    // ISTTime now represents the time in IST coordinates
-
-    var hoursIST = ISTTime.getHours();
-    var minutesIST = ISTTime.getMinutes();
+    const utcTime = newDate.toUTCString();
 
     return (
       <Text
         style={{
-          textAlign: "right",
           color: "gray",
-          fontSize: "10px",
-          marginBottom: "30px",
+          fontSize: "10px"
         }}
       >
-        Generated On {localExpireDate} {hoursIST}:{minutesIST} IST
+        Generated On {utcTime}
       </Text>
     );
   };
   const changeCompletedDate = () => {
     const completedOn = pdfData[0].updatedAt;
     const newDate = new Date(completedOn);
-    const localExpireDate = newDate.toLocaleDateString("en-US", {
-      day: "numeric",
-      month: "long",
-      year: "numeric",
-    });
+    const utcTime = newDate.toUTCString();
 
-    var currentOffset = newDate.getTimezoneOffset();
-
-    var ISTOffset = 330; // IST offset UTC +5:30
-
-    var ISTTime = new Date(
-      newDate.getTime() + (ISTOffset + currentOffset) * 60000
-    );
-
-    // ISTTime now represents the time in IST coordinates
-
-    var hoursIST = ISTTime.getHours();
-    var minutesIST = ISTTime.getMinutes();
-
-    return (
-      <Text style={styles.textStyle2}>
-        {localExpireDate} {hoursIST}:{minutesIST} IST
-      </Text>
-    );
+    return <Text style={styles.textStyle2}>{utcTime}</Text>;
   };
 
   const signerName = (data) => {
@@ -136,14 +108,26 @@ function Certificate({ pdfData }) {
       )
     );
   };
- 
+
   return (
     isLoad && (
       <Document>
         {/** Page defines a single page of content. */}
         <Page size="A4" style={styles.page}>
           <View style={styles.section1}>
-            {generatedDate()}
+            <View
+              style={{
+                display: "flex",
+                flexDirection: "row",
+                justifyContent: "space-between",
+                alignItems: "center",
+                marginBottom: "30px"
+              }}
+            >
+              <Image src={opensignLogo} style={styles.image} />
+              {generatedDate()}
+            </View>
+
             <View style={{ justifyContent: "center" }}>
               <Text
                 style={{
@@ -151,7 +135,7 @@ function Certificate({ pdfData }) {
                   fontSize: "20px",
                   fontWeight: "bold",
                   color: "#31bceb",
-                  marginBottom: "10px",
+                  marginBottom: "10px"
                 }}
               >
                 {" "}
@@ -165,7 +149,7 @@ function Certificate({ pdfData }) {
                       fontSize: "16px",
                       fontWeight: "bold",
                       color: "#31bceb",
-                      margin: "10px 0px 10px 0px",
+                      margin: "10px 0px 10px 0px"
                     }}
                   >
                     Summary
@@ -182,7 +166,9 @@ function Certificate({ pdfData }) {
                   </Text>
                   <Text style={styles.textStyle}>
                     Organization : &nbsp;
-                    <Text style={styles.textStyle2}>__</Text>
+                    <Text style={styles.textStyle2}>
+                      {pdfData[0].ExtUserPtr.Company}
+                    </Text>
                   </Text>
                   <Text style={styles.textStyle}>
                     Completed on : &nbsp;{changeCompletedDate()}
@@ -203,36 +189,40 @@ function Certificate({ pdfData }) {
                         fontSize: "16px",
                         fontWeight: "bold",
                         color: "#31bceb",
-                        margin: "10px 0px 10px 0px",
+                        margin: "10px 0px 10px 0px"
                       }}
                     >
                       Recipients
                     </Text>
 
                     <View>
-                      {multiSigner && multiSigner.map((data, ind) => {
-                        return (
-                          <View
-                            key={ind}
-                            style={{ display: "flex", flexDirection: "column" }}
-                          >
+                      {multiSigner &&
+                        multiSigner.map((data, ind) => {
+                          return (
                             <View
+                              key={ind}
                               style={{
-                                border: "0.4px solid #bdbbbb",
-                                marginBottom: "10px",
+                                display: "flex",
+                                flexDirection: "column"
                               }}
-                            ></View>
-                            {signerName(data)}
+                            >
+                              <View
+                                style={{
+                                  border: "0.4px solid #bdbbbb",
+                                  marginBottom: "10px"
+                                }}
+                              ></View>
+                              {signerName(data)}
 
-                            <Text style={styles.textStyle}>
-                              Accessed from : &nbsp;
-                              <Text style={styles.textStyle2}>
-                                {data.ipAddress}
+                              <Text style={styles.textStyle}>
+                                Accessed from : &nbsp;
+                                <Text style={styles.textStyle2}>
+                                  {data.ipAddress}
+                                </Text>
                               </Text>
-                            </Text>
-                          </View>
-                        );
-                      })}
+                            </View>
+                          );
+                        })}
                     </View>
                   </View>
                 ) : (
@@ -242,7 +232,7 @@ function Certificate({ pdfData }) {
                         fontSize: "16px",
                         fontWeight: "bold",
                         color: "#31bceb",
-                        margin: "10px 0px 10px 0px",
+                        margin: "10px 0px 10px 0px"
                       }}
                     >
                       Recipients
@@ -256,10 +246,17 @@ function Certificate({ pdfData }) {
                         {pdfData[0].ExtUserPtr.Name}
                       </Text>
                     </Text>
+                    <Text style={styles.textStyle}>
+                      Email : &nbsp;
+                      <Text style={styles.textStyle2}>
+                        {pdfData[0].ExtUserPtr.Email}
+                      </Text>
+                    </Text>
                     <Text style={styles.textStyle}>
                       Accessed from : &nbsp;
                       <Text style={styles.textStyle2}>
-                        {pdfData[0].AuditTrail && pdfData[0].AuditTrail[0].ipAddress}
+                        {pdfData[0].AuditTrail &&
+                          pdfData[0].AuditTrail[0].ipAddress}
                       </Text>
                     </Text>
 

microfrontends/SignDocuments/src/Component/DraftDocument.js

@@ -1,61 +1,47 @@
 import React, { useEffect, useState } from "react";
-import axios from "axios";
 import { useNavigate } from "react-router-dom";
 import Loader from "./component/loader";
-import { getHostUrl } from "../utils/Utils";
+import { contractDocument, getHostUrl } from "../utils/Utils";
 function DraftDocument() {
   const navigate = useNavigate();
   const [pdfDetails, setPdfDetails] = useState([]);
   const [isLoading, setIsLoading] = useState({
     isLoad: true,
-    message: "This might take some time",
+    message: "This might take some time"
   });
 
   const rowLevel =
     localStorage.getItem("rowlevel") &&
     JSON.parse(localStorage.getItem("rowlevel"));
-  const signObjId =
+  const docId =
     rowLevel && rowLevel?.id
       ? rowLevel.id
       : rowLevel?.objectId && rowLevel.objectId;
+
   useEffect(() => {
-    if (signObjId) {
+    if (docId) {
       getDocumentDetails();
     }
   }, []);
 
   //get document details
   const getDocumentDetails = async () => {
-    await axios
-      .get(
-        `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
-          "_appName"
-        )}_Document?where={"objectId":"${signObjId}"}&include=ExtUserPtr,Signers`,
-        {
-          headers: {
-            "Content-Type": "application/json",
-            "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-            "X-Parse-Session-Token": localStorage.getItem("accesstoken"),
-          },
-        }
-      )
-      .then((Listdata) => {
-        const json = Listdata.data;
-        const res = json.results;
-        // console.log("res", res);
-        if (res[0] && res.length > 0) {
-          setPdfDetails(res);
-          const loadObj = {
-            isLoad: false,
-          };
-          setIsLoading(loadObj);
-        } else {
-          alert("No data found!");
-        }
-      })
-      .catch((err) => {
-        console.log("axois err ", err);
-      });
+    //getting document details
+    const documentData = await contractDocument(docId);
+    if (documentData && documentData.length > 0) {
+      setPdfDetails(documentData);
+      const loadObj = {
+        isLoad: false
+      };
+      setIsLoading(loadObj);
+    } else if (
+      documentData === "Error: Something went wrong!" ||
+      (documentData.result && documentData.result.error)
+    ) {
+      alert("Error: Something went wrong!");
+    } else {
+      alert("No data found!");
+    }
   };
 
   //check document type and render on signyour self and placeholder route
@@ -63,31 +49,28 @@ function DraftDocument() {
     const data = pdfDetails[0];
     const checkSignerExist =
       pdfDetails[0] && pdfDetails[0].Signers && pdfDetails[0].Signers;
-  const isPlaceholder =
+    const isPlaceholder =
       pdfDetails[0].Placeholders && pdfDetails[0].Placeholders;
     const isDecline = data.IsDeclined && data.IsDeclined;
     const signUrl = data.SignedUrl && data.SignedUrl;
-    const expireDate = pdfDetails[0] && pdfDetails[0].ExpiryDate.iso &&  pdfDetails[0].ExpiryDate.iso;
+    const expireDate =
+      pdfDetails[0] &&
+      pdfDetails[0].ExpiryDate.iso &&
+      pdfDetails[0].ExpiryDate.iso;
     const expireUpdateDate = new Date(expireDate).getTime();
     const currDate = new Date().getTime();
     const hostUrl = getHostUrl();
 
     //checking document is completed and signer exist then navigate to pdfRequestFiles file
     if (data.IsCompleted && checkSignerExist) {
-      // window.location.hash = `/pdfRequestFiles`;
-
       navigate(`${hostUrl}pdfRequestFiles`);
     }
     //checking document is completed and signer does not exist then navigate to recipientSignPdf file
     else if (data.IsCompleted && !checkSignerExist) {
-      // window.location.hash = `/recipientSignPdf/${data.objectId}/${data.ExtUserPtr.Phone}`;
-      navigate(
-        `${hostUrl}signaturePdf`
-      );
+      navigate(`${hostUrl}signaturePdf`);
     }
     //checking document is declined by someone then navigate to pdfRequestFiles file
     else if (isDecline) {
-      // window.location.hash = `/pdfRequestFiles`;
       navigate(`${hostUrl}pdfRequestFiles`);
     }
     //checking document has expired and signers exist and placeholder does not set yet then navigate to pdfRequestFiles file
@@ -97,7 +80,6 @@ function DraftDocument() {
       checkSignerExist &&
       !isPlaceholder
     ) {
-      // window.location.hash = `/placeHolderSign`;
       navigate(`${hostUrl}placeHolderSign`);
     }
     //checking document has expired and signers does not exist and document not signed yet then navigate to pdfRequestFiles file

microfrontends/SignDocuments/src/Component/LegaDrive/FolderDrive/legaDriveComponent.js

@@ -99,7 +99,7 @@ function PdfFileComponent({
 
   //function for navigate user to microapp-signature component
   const checkPdfStatus = async (data) => {
-    
+
     const hostUrl = getHostUrl();
     const expireDate = data.ExpiryDate.iso;
     const expireUpdateDate = new Date(expireDate).getTime();
@@ -221,13 +221,19 @@ function PdfFileComponent({
         // console.log("download")
         const pdfName = data && data.Name;
         const pdfUrl = data && data.SignedUrl ? data.SignedUrl : data.URL;
-        saveAs(pdfUrl, `${pdfName}_signed_by_OpenSign™.pdf`);
+        saveAs(pdfUrl, `${sanitizeFileName(pdfName)}_signed_by_OpenSign™.pdf`);
       } else if (selectType === "Rename") {
         // console.log("rename")
         setRenameValue(data.Name);
         setRename(data.objectId);
       }
     };
+
+    const sanitizeFileName = (pdfName) => {
+      // Replace spaces with underscore
+      return pdfName.replace(/ /g, '_');
+    }
+
     const handleEnterPress = (e, data) => {
       if (e.key === "Enter") {
         handledRenameDoc(data);

microfrontends/SignDocuments/src/Component/LegaDrive/LegaDrive.js

@@ -6,6 +6,7 @@ import PdfFileComponent from "./FolderDrive/legaDriveComponent";
 import Modal from "react-bootstrap/Modal";
 import ModalHeader from "react-bootstrap/esm/ModalHeader";
 import { themeColor, iconColor } from "../../utils/ThemeColor/backColor";
+import { getDrive } from "../../utils/Utils";
 
 function PdfFile() {
   const scrollRef = useRef(null);
@@ -15,29 +16,18 @@ function PdfFile() {
   const [pdfData, setPdfData] = useState([]);
   const [isFolder, setIsFolder] = useState(false);
   const [newFolderName, setNewFolderName] = useState();
-  // const [parentFolderName, setParentFolderName] = useState();
-  // const [parentFolder, setParentFolder] = useState([]);
   const [error, setError] = useState();
   const [folderLoader, setIsFolderLoader] = useState(false);
   const [isShowSort, setIsShowSort] = useState(false);
   const [isLoading, setIsLoading] = useState({
     isLoad: true,
-    message: "This might take some time",
+    message: "This might take some time"
   });
   const [docId, setDocId] = useState();
   const [handleError, setHandleError] = useState();
 
   const [folderName, setFolderName] = useState([]);
 
-  const senderUser =
-    localStorage.getItem(
-      `Parse/${localStorage.getItem("parseAppId")}/currentUser`
-    ) &&
-    localStorage.getItem(
-      `Parse/${localStorage.getItem("parseAppId")}/currentUser`
-    );
-  const jsonSender = JSON.parse(senderUser);
-
   useEffect(() => {
     if (docId) {
       getPdfFolderDocumentList();
@@ -50,104 +40,59 @@ function PdfFile() {
   const getPdfDocumentList = async () => {
     const load = {
       isLoad: true,
-      message: "This might take some time",
+      message: "This might take some time"
     };
     setIsLoading(load);
-    //?where={"Type":"Folder" }&include=ExtUserPtr,Signers
-    //?where={"$or":[{"Type":{"$exists":true}},{"Folder":{"$exists":false}}]}&include=ExtUserPtr,Signers
-    // "CreatedBy":{"__type":"Pointer","className":"_User","objectId":"${jsonSender.objectId}"}
-    // where={"Folder":{"$exists":false} }&include=ExtUserPtr,Signers`,
-    await axios
-      .get(
-        `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
-          "_appName"
-        )}_Document?where={"Folder":{"$exists":false},"$or":[{"CreatedBy":{"$exists":false}},{"CreatedBy":{"__type":"Pointer","className":"_User","objectId":"${
-          jsonSender.objectId
-        }"}}]}&include=ExtUserPtr,Signers`,
-        {
-          headers: {
-            "Content-Type": "application/json",
-            "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-            "X-Parse-Session-Token": localStorage.getItem("accesstoken"),
-          },
-        }
-      )
-      .then((Listdata) => {
-        const json = Listdata.data;
-        const res = json.results;
-        // console.log("result", res);
-        if (res[0] && res.length > 0) {
-          setPdfData(res);
-        }
+    const driveDetails = await getDrive();
 
-        const data = [
-          {
-            name: "OpenSignDrive™",
-            objectId: "",
-          },
-        ];
-        setFolderName(data);
-        const loadObj = {
-          isLoad: false,
-        };
-        setIsLoading(loadObj);
-      })
-      .catch((err) => {
-        const loadObj = {
-          isLoad: false,
-        };
-        setHandleError("Error: Something went wrong!");
-        setIsLoading(loadObj);
-      });
+    if (driveDetails) {
+      if (driveDetails.length > 0) {
+        setPdfData(driveDetails);
+      }
+      const data = [
+        {
+          name: "OpenSignDrive™",
+          objectId: ""
+        }
+      ];
+      setFolderName(data);
+      const loadObj = {
+        isLoad: false
+      };
+      setIsLoading(loadObj);
+    } else if (driveDetails === "Error: Something went wrong!") {
+      const loadObj = {
+        isLoad: false
+      };
+      setHandleError("Error: Something went wrong!");
+      setIsLoading(loadObj);
+    }
   };
   //function for get parent folder document list
   const getPdfFolderDocumentList = async () => {
     const load = {
       isLoad: true,
-      message: "This might take some time",
+      message: "This might take some time"
     };
     setIsLoading(load);
-    //{"$inQuery":{"where":{"objectId":"${docId}"},"className":"${appName}_Document"}}
-    //"CreatedBy":{"__type":"Pointer","className":"_User","objectId":"${jsonSender.objectId}"}
-    await axios
-      .get(
-        `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
-          "_appName"
-        )}_Document?where={"Folder":{"__type":"Pointer","className":"${localStorage.getItem(
-          "_appName"
-        )}_Document","objectId":"${docId}"},"$or":[{"CreatedBy":{"$exists":false}},{"CreatedBy":{"__type":"Pointer","className":"_User","objectId":"${
-          jsonSender.objectId
-        }"}}]}&include=ExtUserPtr,Signers,Folder`,
-        {
-          headers: {
-            "Content-Type": "application/json",
-            "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-            "X-Parse-Session-Token": localStorage.getItem("accesstoken"),
-          },
-        }
-      )
-      .then((Listdata) => {
-        const json = Listdata.data;
-        const res = json.results;
-
-        if (res[0] && res.length > 0) {
-          setPdfData(res);
-        } else {
-          setPdfData([]);
-        }
-
-        const loadObj = {
-          isLoad: false,
-        };
-        setIsLoading(loadObj);
-      })
-      .catch((err) => {
-        const loadObj = {
-          isLoad: false,
-        };
-        setHandleError("Error: Something went wrong!");
-        setIsLoading(loadObj);
-      });
+    const driveDetails = await getDrive(docId);
+    if (driveDetails) {
+      if (driveDetails.length > 0) {
+        setPdfData(driveDetails);
+      } else {
+        setPdfData([]);
+      }
+      const loadObj = {
+        isLoad: false
+      };
+      setIsLoading(loadObj);
+    } else if (driveDetails === "Error: Something went wrong!") {
+      const loadObj = {
+        isLoad: false
+      };
+      setHandleError("Error: Something went wrong!");
+      setIsLoading(loadObj);
+    }
   };
 
   //function for get all pdf document list
@@ -158,7 +103,7 @@ function PdfFile() {
   const handleRoute = (data) => {
     let loadObj = {
       isLoad: true,
-      message: "This might take some time",
+      message: "This might take some time"
     };
     if (data.name === "LegaDrive™") {
       setIsLoading(loadObj);
@@ -167,7 +112,7 @@ function PdfFile() {
       } else {
         setTimeout(() => {
           const loadObj = {
-            isLoad: false,
+            isLoad: false
           };
           setIsLoading(loadObj);
         }, 1000);
@@ -176,12 +121,11 @@ function PdfFile() {
       setIsLoading(loadObj);
       setTimeout(() => {
         const loadObj = {
-          isLoad: false,
+          isLoad: false
         };
         setIsLoading(loadObj);
       }, 1000);
     } else {
-      // console.log("go here1",data.objectId)
       const findIndex = folderName.findIndex(
         (fold) => fold.objectId === data.objectId
       );
@@ -216,13 +160,13 @@ function PdfFile() {
           Folder: {
             __type: "Pointer",
             className: `${localStorage.getItem("_appName")}_Document`,
-            objectId: isParentId,
-          },
+            objectId: isParentId
+          }
         };
       } else {
         data = {
           Name: newFolderName,
-          Type: "Folder",
+          Type: "Folder"
         };
       }
 
@@ -237,8 +181,8 @@ function PdfFile() {
             headers: {
               "Content-Type": "application/json",
               "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-              "X-Parse-Session-Token": localStorage.getItem("accesstoken"),
-            },
+              "X-Parse-Session-Token": localStorage.getItem("accesstoken")
+            }
           }
         )
 
@@ -388,7 +332,7 @@ function PdfFile() {
                   display: "flex",
                   flexDirection: "column",
                   justifyContent: "center",
-                  alignItems: "center",
+                  alignItems: "center"
                 }}
               >
                 <img
@@ -406,7 +350,7 @@ function PdfFile() {
                   style={{
                     margin: "10px 0px 10px 0px",
                     fontSize: "15px",
-                    fontWeight: "400",
+                    fontWeight: "400"
                   }}
                 >
                   Name*
@@ -428,7 +372,7 @@ function PdfFile() {
                     display: "flex",
                     alignItems: "flex-end",
                     justifyContent: "flex-end",
-                    alignContent: "flex-end",
+                    alignContent: "flex-end"
                   }}
                 >
                   <button
@@ -437,7 +381,7 @@ function PdfFile() {
                       borderRadius: "0px",
                       border: "1.5px solid #e3e2e1",
                       fontWeight: "600",
-                      color: "black",
+                      color: "black"
                     }}
                     className="finishBtn"
                     onClick={() => setIsFolder(false)}
@@ -448,7 +392,7 @@ function PdfFile() {
                   <button
                     onClick={() => handleAddFolder()}
                     style={{
-                      background: themeColor(),
+                      background: themeColor()
                     }}
                     type="button"
                     className="finishBtn"
@@ -469,7 +413,7 @@ function PdfFile() {
               alignItems: "center",
               height: "100vh",
               width: "100%",
-              flexDirection: "column",
+              flexDirection: "column"
             }}
           >
             <img
@@ -488,7 +432,7 @@ function PdfFile() {
               justifyContent: "center",
               alignItems: "center",
               height: "100vh",
-              width: "100%",
+              width: "100%"
             }}
           >
             <span style={{ fontSize: "20px", color: "gray" }}>
@@ -502,7 +446,7 @@ function PdfFile() {
                 onMouseEnter={(e) => handleMouseEnter(e)}
                 ref={scrollRef}
                 style={{
-                  width: "100%",
+                  width: "100%"
                 }}
                 className="folderPath"
               >
@@ -514,7 +458,7 @@ function PdfFile() {
                       style={{
                         color: "#a64b4e",
                         fontWeight: "400",
-                        cursor: "pointer",
+                        cursor: "pointer"
                       }}
                     >
                       {data.name}
@@ -523,7 +467,7 @@ function PdfFile() {
                           color: "#a64b4e",
                           fontWeight: "200",
                           cursor: "pointer",
-                          margin: "0 4px",
+                          margin: "0 4px"
                         }}
                       >
                         &gt;
@@ -545,13 +489,13 @@ function PdfFile() {
                       style={{
                         marginRight: "5px",
                         fontSize: "14px",
-                        color: `${iconColor()}`,
+                        color: `${iconColor()}`
                       }}
                     ></i>
                     <span
                       style={{
                         fontSize: "15px",
-                        color: `${iconColor()}`,
+                        color: `${iconColor()}`
                       }}
                     >
                       {selectedSort}
@@ -694,7 +638,7 @@ function PdfFile() {
                   justifyContent: "center",
                   alignItems: "center",
                   height: "50vh",
-                  width: "100%",
+                  width: "100%"
                 }}
               >
                 <span style={{ fontWeight: "bold" }}>No Data Found!</span>

microfrontends/SignDocuments/src/Component/ManageSign.js

@@ -8,7 +8,7 @@ import "../css/signature.css";
 import axios from "axios";
 import { toDataUrl } from "../utils/toDataUrl";
 
-// console.log("appName ", appName)
+ 
 const ManageSign = () => {
   let appName;
   const [penColor, setPenColor] = useState("blue");
@@ -68,7 +68,6 @@ const ManageSign = () => {
         if (res.data.results.length > 0) {
           setId(res.data.results[0].objectId);
           setSignName(res.data.results[0].SignatureName);
-          // console.log(res.data.results[0].ImageURL);
           setImage(res.data.results[0].ImageURL);
           if (res.data.results[0] && res.data.results[0].Initials) {
             setInitials(res.data.results[0].Initials);
@@ -143,7 +142,7 @@ const ManageSign = () => {
 
     if (!signName) {
       setNameWarning(true);
-      // setTimeout(() => setNameWarning(false), 1000);
+     
     } else if (!isvalue) {
       setWarning(true);
       setTimeout(() => setWarning(false), 1000);
@@ -337,12 +336,8 @@ const ManageSign = () => {
       <div
         className="mainDiv"
         style={{
-          // height: "100%",
-
           width: "100%",
           paddingRight: "10px",
-
-          // maxHeight:"500px",
         }}
       >
         <div style={{ margin: 20 }}>

microfrontends/SignDocuments/src/Component/PageNotFound.js

@@ -0,0 +1,16 @@
+import React from "react";
+
+const PageNotFound = () => {
+  return (
+    <div className="flex items-center justify-center h-screen w-full bg-white rounded">
+      <div className="text-center">
+        <h1 className="text-[60px] lg:text-[120px] font-semibold text-black">
+          404
+        </h1>
+        <p className="text-[30px] lg:text-[50px] text-black">Page Not Found</p>
+      </div>
+    </div>
+  );
+};
+
+export default PageNotFound;

microfrontends/SignDocuments/src/Component/PdfRequestFiles.js

@@ -12,16 +12,18 @@ import { useParams } from "react-router-dom";
 import SignPad from "./component/signPad";
 import RenderAllPdfPage from "./component/renderAllPdfPage";
 import {
-  contactBook,
-  contractUsers,
+  convertPNGtoJPEG,
+  contractDocument,
   getBase64FromIMG,
-  getBase64FromUrl
+  getBase64FromUrl,
+  urlValidator
 } from "../utils/Utils";
 import Loader from "./component/loader";
 import HandleError from "./component/HandleError";
 import Nodata from "./component/Nodata";
 import Header from "./component/header";
 import RenderPdf from "./component/renderPdf";
+import CustomModal from "./component/CustomModal";
 
 function PdfRequestFiles() {
   const { docId } = useParams();
@@ -65,7 +67,9 @@ function PdfRequestFiles() {
   });
   const [isSigned, setIsSigned] = useState(false);
   const [isExpired, setIsExpired] = useState(false);
-
+  const [alreadySign, setAlreadySign] = useState(false);
+  const [containerWH, setContainerWH] = useState({});
+  const divRef = useRef(null);
   const rowLevel =
     localStorage.getItem("rowlevel") &&
     JSON.parse(localStorage.getItem("rowlevel"));
@@ -89,6 +93,7 @@ function PdfRequestFiles() {
     const clientWidth = window.innerWidth;
     const value = docId ? 80 : 30;
     const pdfWidth = clientWidth - 160 - 200 - value;
+
     //160 is width of left side, 200 is width of right side component and 50 is space of middle compoent
     //pdf from left and right component
     setPdfNewWidth(pdfWidth);
@@ -96,153 +101,146 @@ function PdfRequestFiles() {
       getDocumentDetails();
     }
   }, []);
+  useEffect(() => {
+    if (divRef.current) {
+      setContainerWH({
+        width: divRef.current.offsetWidth,
+        height: divRef.current.offsetHeight
+      });
+    }
+  }, [divRef.current]);
 
   //function for get document details for perticular signer with signer'object id
   const getDocumentDetails = async () => {
-    const contractUsersRes = await contractUsers(jsonSender.objectId);
+    //getting document details
+    const documentData = await contractDocument(documentId);
+    if (documentData && documentData.length > 0) {
+      const isCompleted =
+        documentData[0].IsCompleted && documentData[0].IsCompleted;
+      const expireDate = documentData[0].ExpiryDate.iso;
+      const declined = documentData[0].IsDeclined && documentData[0].IsDeclined;
+      const expireUpdateDate = new Date(expireDate).getTime();
+      const currDate = new Date().getTime();
+      const getSigners = documentData[0].Signers;
+      const getCurrentSigner =
+        getSigners &&
+        getSigners.filter(
+          (data) => data.UserId.objectId === jsonSender.objectId
+        );
 
-    if (contractUsersRes && contractUsersRes[0]) {
-      const objId = contractUsersRes[0].objectId;
+      const currUserId = getCurrentSigner[0]
+        ? getCurrentSigner[0].objectId
+        : "";
+      setSignerObjectId(currUserId);
+      if (documentData[0].SignedUrl) {
+        setPdfUrl(documentData[0].SignedUrl);
+      } else {
+        setPdfUrl(documentData[0].URL);
+      }
+      if (isCompleted) {
+        setIsSigned(true);
+        const data = {
+          isCertificate: true,
+          isModal: true
+        };
+        setAlreadySign(true);
+        setIsCompleted(data);
+      } else if (declined) {
+        const currentDecline = {
+          currnt: "another",
+          isDeclined: true
+        };
+        setIsDecline(currentDecline);
+      } else if (currDate > expireUpdateDate) {
+        setIsExpired(true);
+      }
 
-      setSignerObjectId(objId);
-    } else if (contractUsersRes === "Error: Something went wrong!") {
+      if (documentData.length > 0) {
+        const checkDocIdExist =
+          documentData[0].AuditTrail &&
+          documentData[0].AuditTrail.length > 0 &&
+          documentData[0].AuditTrail.filter(
+            (data) => data.Activity === "Signed"
+          );
+
+        const checkAlreadySign =
+          documentData[0].AuditTrail &&
+          documentData[0].AuditTrail.length > 0 &&
+          documentData[0].AuditTrail.filter(
+            (data) =>
+              data.UserPtr.objectId === currUserId && data.Activity === "Signed"
+          );
+        if (
+          checkAlreadySign &&
+          checkAlreadySign[0] &&
+          checkAlreadySign.length > 0
+        ) {
+          setAlreadySign(true);
+        }
+
+        let signers = [];
+        let unSignedSigner = [];
+
+        //check document is signed or not
+        if (checkDocIdExist && checkDocIdExist.length > 0) {
+          setIsDocId(true);
+          const signerRes = documentData[0].Signers;
+          //comparison auditTrail user details with signers user details
+          for (let i = 0; i < signerRes.length; i++) {
+            const signerId = signerRes[i].objectId;
+
+            let isSigned = false;
+            for (let j = 0; j < checkDocIdExist.length; j++) {
+              const signedExist =
+                checkDocIdExist[j] && checkDocIdExist[j].UserPtr.objectId;
+              //checking signerObjId and auditTrail User objId
+              // if match then add signed data in signer array and break loop
+
+              if (signerId === signedExist) {
+                signers.push({ ...signerRes[i], ...signerRes[i] });
+                isSigned = true;
+                break;
+              }
+              // if does not match then add unsigned data in unSignedSigner array
+            }
+            if (!isSigned) {
+              unSignedSigner.push({ ...signerRes[i], ...signerRes[i] });
+            }
+          }
+          setSignedSigners(signers);
+          setUnSignedSigners(unSignedSigner);
+
+          setSignerPos(documentData[0].Placeholders);
+        } else {
+          let unsigned = [];
+          for (let i = 0; i < documentData.length; i++) {
+            unsigned.push(documentData[i].Signers);
+          }
+          setUnSignedSigners(unsigned[0]);
+          setSignerPos(documentData[0].Placeholders);
+        }
+        setPdfDetails(documentData);
+        setIsUiLoading(false);
+      } else {
+        alert("No data found!");
+      }
+    } else if (
+      documentData === "Error: Something went wrong!" ||
+      (documentData.result && documentData.result.error)
+    ) {
       const loadObj = {
         isLoad: false
       };
       setHandleError("Error: Something went wrong!");
       setIsLoading(loadObj);
-    } else if (contractUsersRes.length === 0) {
-      const contractContactBook = await contactBook(jsonSender.objectId);
-      if (contractContactBook && contractContactBook[0]) {
-        const objId = contractUsersRes[0].objectId;
-
-        setSignerObjectId(objId);
-      }
+    } else {
+      setNoData(true);
+      const loadObj = {
+        isLoad: false
+      };
+      setIsLoading(loadObj);
+      setIsUiLoading(false);
     }
-
-    await axios
-      .get(
-        `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
-          "_appName"
-        )}_Document?where={"objectId":"${documentId}"}&include=ExtUserPtr,Signers,UserPtr`,
-        {
-          headers: {
-            "Content-Type": "application/json",
-            "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-            "X-Parse-Session-Token": localStorage.getItem("accesstoken")
-          }
-        }
-      )
-      .then((Listdata) => {
-        const json = Listdata.data;
-        const res = json.results;
-        // console.log("res", res);
-        if (res[0] && res.length > 0) {
-          const isCompleted = res[0].IsCompleted && res[0].IsCompleted;
-          const expireDate = res[0].ExpiryDate.iso;
-          const declined = res[0].IsDeclined && res[0].IsDeclined;
-          const expireUpdateDate = new Date(expireDate).getTime();
-          const currDate = new Date().getTime();
-          if (res[0].SignedUrl) {
-            setPdfUrl(res[0].SignedUrl);
-          } else {
-            setPdfUrl(res[0].URL);
-          }
-          if (isCompleted) {
-            setIsSigned(true);
-            const data = {
-              isCertificate: true,
-              isModal: true
-            };
-            setIsCompleted(data);
-          } else if (declined) {
-            const currentDecline = {
-              currnt: "another",
-              isDeclined: true
-            };
-            setIsDecline(currentDecline);
-          } else if (currDate > expireUpdateDate) {
-            setIsExpired(true);
-          }
-
-          if (res.length > 0) {
-            const checkDocIdExist =
-              json.results[0].AuditTrail &&
-              json.results[0].AuditTrail.length > 0 &&
-              json.results[0].AuditTrail.filter(
-                (data) => data.Activity === "Signed"
-              );
-
-            let signers = [];
-            let unSignedSigner = [];
-
-            //check document is signed or not
-            if (checkDocIdExist && checkDocIdExist.length > 0) {
-              setIsDocId(true);
-              const signerRes = res[0].Signers;
-              //comparison auditTrail user details with signers user details
-              for (let i = 0; i < signerRes.length; i++) {
-                const signerId = signerRes[i].objectId;
-                // console.log("getSigner", getSigner);
-                let isSigned = false;
-                for (let j = 0; j < checkDocIdExist.length; j++) {
-                  const signedExist =
-                    checkDocIdExist[j] && checkDocIdExist[j].UserPtr.objectId;
-                  //checking signerObjId and auditTrail User objId
-                  // if match then add signed data in signer array and break loop
-
-                  if (signerId === signedExist) {
-                    // console.log("signedExist", signedExist);
-                    signers.push({ ...signerRes[i], ...signerRes[i] });
-                    isSigned = true;
-                    break;
-                  }
-                  // if does not match then add unsigned data in unSignedSigner array
-                }
-                if (!isSigned) {
-                  unSignedSigner.push({ ...signerRes[i], ...signerRes[i] });
-                }
-
-                // console.log("check Signers status",signers,unSignedSigner)
-              }
-              setSignedSigners(signers);
-              setUnSignedSigners(unSignedSigner);
-
-              setSignerPos(res[0].Placeholders);
-            } else {
-              let unsigned = [];
-              // console.log("else condition");
-              for (let i = 0; i < res.length; i++) {
-                unsigned.push(res[i].Signers);
-              }
-              setUnSignedSigners(unsigned[0]);
-              setSignerPos(res[0].Placeholders);
-            }
-
-            setPdfDetails(res);
-
-            setIsUiLoading(false);
-          } else {
-            alert("No data found!");
-          }
-        } else {
-          // alert("No data found!");
-          setNoData(true);
-          const loadObj = {
-            isLoad: false
-          };
-          setIsLoading(loadObj);
-          setIsUiLoading(false);
-        }
-      })
-      .catch((err) => {
-        console.log("err", err);
-        const loadObj = {
-          isLoad: false
-        };
-        setHandleError("Error: Something went wrong!");
-        setIsLoading(loadObj);
-      });
     await axios
       .get(
         `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
@@ -279,13 +277,11 @@ function PdfRequestFiles() {
       });
   };
 
-  //  console.log("signer", signerPos, unsignedSigners, isCompleted);
   //function for embed signature or image url in pdf
   async function embedImages() {
     const checkUser = signerPos.filter(
       (data) => data.signerObjId === signerObjectId
     );
-
     if (checkUser && checkUser.length > 0) {
       let checkSignUrl = [];
       const checkSign = checkUser[0].placeHolder.filter(
@@ -320,7 +316,6 @@ function PdfRequestFiles() {
 
         //checking if signature is only one then send image url in jpeg formate to server
         if (pngUrl.length === 1 && pngUrl[0].pos.length === 1) {
-          // console.log("else condition");
           if (isDocId) {
             pdfBase64 = await getBase64FromUrl(url);
           } else {
@@ -330,7 +325,7 @@ function PdfRequestFiles() {
               const fontSize = 10;
               const textContent =
                 documentId && `OpenSign™ DocumentId: ${documentId}`;
-              // console.log("textcontent", documentId);
+
               const pages = pdfDoc.getPages();
               const page = pages[i];
 
@@ -353,38 +348,13 @@ function PdfRequestFiles() {
             imgUrlList.map(async (data) => {
               //cheking signUrl is defau;t signature url of custom url
               let ImgUrl = data.SignUrl;
-              const checkUrl = ImgUrl.includes("https:");
+              const checkUrl = urlValidator(ImgUrl);
 
               //if default signature url then convert it in base 64
               if (checkUrl) {
                 ImgUrl = await getBase64FromIMG(ImgUrl + "?get");
               }
               //function for called convert png signatre to jpeg in base 64
-              const convertPNGtoJPEG = (base64Data) => {
-                return new Promise((resolve, reject) => {
-                  const canvas = document.createElement("canvas");
-                  const img = new Image();
-                  img.src = base64Data;
-
-                  img.onload = () => {
-                    canvas.width = img.width;
-                    canvas.height = img.height;
-
-                    const ctx = canvas.getContext("2d");
-                    ctx.drawImage(img, 0, 0);
-
-                    // Convert to JPEG by using the canvas.toDataURL() method
-                    const jpegBase64Data = canvas.toDataURL("image/jpeg");
-
-                    resolve(jpegBase64Data);
-                  };
-
-                  img.onerror = (error) => {
-                    reject(error);
-                  };
-                });
-              };
-
               convertPNGtoJPEG(ImgUrl)
                 .then((jpegBase64Data) => {
                   const removeBase64Fromjpeg = "data:image/jpeg;base64,";
@@ -440,42 +410,75 @@ function PdfRequestFiles() {
             const images = await Promise.all(
               imgUrlList.map(async (url) => {
                 let signUrl = url.SignUrl;
-
-                const checkUrl = url.SignUrl.includes("https:");
+                if (url.ImageType === "image/png") {
+                  //function for convert signature png base64 url to jpeg base64
+                  const newUrl = await convertPNGtoJPEG(signUrl);
+                  signUrl = newUrl;
+                }   
+                const checkUrl = urlValidator(signUrl);
                 if (checkUrl) {
                   signUrl = signUrl + "?get";
                 }
                 const res = await fetch(signUrl);
-
                 return res.arrayBuffer();
               })
             );
             images.forEach(async (imgData, id) => {
-              let img;
-              if (
-                imgUrlList[id].ImageType &&
-                imgUrlList[id].ImageType === "image/jpeg"
-              ) {
-                img = await pdfDoc.embedJpg(imgData);
-              } else if (
-                imgUrlList[id].ImageType &&
-                imgUrlList[id].ImageType === "image/png"
-              ) {
-                img = await pdfDoc.embedPng(imgData);
-              } else {
-                img = await pdfDoc.embedPng(imgData);
-              }
-
+              let img = await pdfDoc.embedJpg(imgData);
               const imgHeight = imgUrlList[id].Height
                 ? imgUrlList[id].Height
                 : 60;
               const imgWidth = imgUrlList[id].Width
                 ? imgUrlList[id].Width
                 : 150;
-
+              const isMobile = window.innerWidth < 767;
+              const newWidth = window.innerWidth;
+              const scale = isMobile ? pdfOriginalWidth / newWidth : 1;
+              const xPos = (pos) => {
+                //checking both condition mobile and desktop view
+                if (isMobile) {
+                  //if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divided by scale
+                  if (pos.isMobile) {
+                    const x = pos.xPosition * (pos.scale / scale);
+                    return x * scale + 50;
+                  } else {
+                    const x = pos.xPosition / scale;
+                    return x * scale;
+                  }
+                } else {
+                  //else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
+                  if (pos.isMobile) {
+                    const x = pos.xPosition * pos.scale + 50;
+                    return x;
+                  } else {
+                    return pos.xPosition;
+                  }
+                }
+              };
+              const yPos = (pos) => {
+                //checking both condition mobile and desktop view
+                const y = pos.yPosition / scale;
+                if (isMobile) {
+                  //if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divided by scale
+                  if (pos.isMobile) {
+                    const y = pos.yPosition * (pos.scale / scale);
+                    return page.getHeight() - y * scale - imgHeight;
+                  } else {
+                    return page.getHeight() - y * scale - imgHeight;
+                  }
+                } else {
+                  //else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
+                  if (pos.isMobile) {
+                    const y = pos.yPosition * pos.scale;
+                    return page.getHeight() - y - imgHeight;
+                  } else {
+                    return page.getHeight() - pos.yPosition - imgHeight;
+                  }
+                }
+              };
               page.drawImage(img, {
-                x: imgUrlList[id].xPosition,
-                y: page.getHeight() - imgUrlList[id].yPosition - imgHeight,
+                x: xPos(imgUrlList[id]),
+                y: yPos(imgUrlList[id]),
                 width: imgWidth,
                 height: imgHeight
               });
@@ -506,24 +509,91 @@ function PdfRequestFiles() {
     signerData
   ) => {
     let signgleSign;
-
+    const isMobile = window.innerWidth < 767;
+    const newWidth = window.innerWidth;
+    const scale = isMobile ? pdfOriginalWidth / newWidth : 1;
     if (
       signerData &&
       signerData.length === 1 &&
       signerData[0].pos.length === 1
     ) {
       const height = xyPosData.Height ? xyPosData.Height : 60;
-      const bottomY = xyPosData.isDrag
-        ? xyPosData.yBottom - height
-        : xyPosData.yBottom - height + xyPosData.firstYPos;
+
+      const xPos = (pos) => {
+        //checking both condition mobile and desktop view
+        if (isMobile) {
+          //if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divided by scale
+          if (pos.isMobile) {
+            const x = pos.xPosition * (pos.scale / scale);
+            return x * scale + 50;
+          } else {
+            const x = pos.xPosition / scale;
+            return x * scale;
+          }
+        } else {
+          //else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
+          if (pos.isMobile) {
+            const x = pos.xPosition * pos.scale + 50;
+            return x;
+          } else {
+            return pos.xPosition;
+          }
+        }
+      };
+
+      const yBottom = (pos) => {
+        let yPosition;
+        //checking both condition mobile and desktop view
+
+        if (isMobile) {
+          //if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divided by scale
+          if (pos.isMobile) {
+            const y = pos.yBottom * (pos.scale / scale);
+            yPosition = pos.isDrag
+              ? y * scale - height
+              : pos.firstYPos
+                ? y * scale - height + pos.firstYPos
+                : y * scale - height;
+            return yPosition;
+          } else {
+            const y = pos.yBottom / scale;
+
+            yPosition = pos.isDrag
+              ? y * scale - height
+              : pos.firstYPos
+                ? y * scale - height + pos.firstYPos
+                : y * scale - height;
+            return yPosition;
+          }
+        } else {
+          //else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
+          if (pos.isMobile) {
+            const y = pos.yBottom * pos.scale;
+
+            yPosition = pos.isDrag
+              ? y - height
+              : pos.firstYPos
+                ? y - height + pos.firstYPos
+                : y - height;
+            return yPosition;
+          } else {
+            yPosition = pos.isDrag
+              ? pos.yBottom - height
+              : pos.firstYPos
+                ? pos.yBottom - height + pos.firstYPos
+                : pos.yBottom - height;
+            return yPosition;
+          }
+        }
+      };
+      const bottomY = yBottom(xyPosData);
       signgleSign = {
         pdfFile: pdfBase64Url,
         docId: documentId,
+        userId: signerObjectId,
         sign: {
           Base64: base64Url,
-          Left: xyPosData.resizeXPos
-            ? xyPosData.resizeXPos
-            : xyPosData.xPosition,
+          Left: xPos(xyPosData),
           Bottom: bottomY,
           Width: xyPosData.Width ? xyPosData.Width : 150,
           Height: height,
@@ -537,7 +607,8 @@ function PdfRequestFiles() {
     ) {
       signgleSign = {
         pdfFile: base64Url,
-        docId: documentId
+        docId: documentId,
+        userId: signerObjectId
       };
     }
 
@@ -565,7 +636,6 @@ function PdfRequestFiles() {
         }
       })
       .catch((err) => {
-        // this.setState({ loading: false });
         console.log("axois err ", err);
         alert("something went wrong");
       });
@@ -595,17 +665,12 @@ function PdfRequestFiles() {
   //function for image upload or update
   const onImageChange = (event) => {
     if (event.target.files && event.target.files[0]) {
-      // setIsSignPad(false);
-
       const imageType = event.target.files[0].type;
-
       const reader = new FileReader();
       reader.readAsDataURL(event.target.files[0]);
-
       reader.onloadend = function (e) {
         let width, height;
         const image = new Image();
-
         image.src = e.target.result;
         image.onload = function () {
           width = image.width;
@@ -783,8 +848,6 @@ function PdfRequestFiles() {
         return obj;
       });
 
-      // currentSigner[0].placeHolder.splice(i, 1, newUpdateUrl[0]);
-      // console.log("currentSigner sign", currentSigner);
       const newUpdatePos = currentSigner.map((obj, ind) => {
         if (obj.signerObjId === signerObjectId) {
           return { ...obj, placeHolder: newUpdateUrl };
@@ -807,6 +870,7 @@ function PdfRequestFiles() {
 
   //function for set decline true on press decline button
   const declineDoc = async () => {
+    setIsDecline({ isDeclined: false });
     const data = {
       IsDeclined: true
     };
@@ -842,8 +906,6 @@ function PdfRequestFiles() {
       });
   };
 
-  // console.log("unsigned", unsignedSigners, signerObjectId,isExpired);
-
   return (
     <DndProvider backend={HTML5Backend}>
       {isLoading.isLoad ? (
@@ -859,7 +921,7 @@ function PdfRequestFiles() {
               style={{
                 position: "absolute",
                 height: "100vh",
-                width: window.innerWidth,
+                width: "100%",
                 display: "flex",
                 justifyContent: "center",
                 flexDirection: "column",
@@ -880,7 +942,39 @@ function PdfRequestFiles() {
             </div>
           )}
 
-          <div className="signatureContainer">
+          <div className="signatureContainer" ref={divRef}>
+            {/* this modal is used to show decline alert */}
+            <CustomModal
+              containerWH={containerWH}
+              show={isDecline.isDeclined}
+              headMsg="Document Declined Alert!"
+              bodyMssg={
+                isDecline.currnt === "Sure" ? (
+                  <p className="pTagBody">
+                    Are you sure want to decline this document ?
+                  </p>
+                ) : isDecline.currnt === "YouDeclined" ? (
+                  <p className="pTagBody">You have declined this document!</p>
+                ) : (
+                  isDecline.currnt === "another" && (
+                    <p className="pTagBody">
+                      You cannot sign this document as it has been declined by
+                      one or more person(s).
+                    </p>
+                  )
+                )
+              }
+              footerMessage={isDecline.currnt === "Sure"}
+              declineDoc={declineDoc}
+              setIsDecline={setIsDecline}
+            />
+            {/* this modal is used for show expired alert */}
+            <CustomModal
+              containerWH={containerWH}
+              show={isExpired}
+              headMsg="Document Expired!"
+              bodyMssg="This Document is no longer available."
+            />
             {/* this component used to render all pdf pages in left side */}
             <RenderAllPdfPage
               signPdfUrl={pdfDetails[0].URL}
@@ -896,66 +990,6 @@ function PdfRequestFiles() {
                 marginRight: pdfOriginalWidth > 500 && "20px"
               }}
             >
-              <Modal show={isExpired}>
-                <ModalHeader className="bg-danger">
-                  <span className="spanTagHead">Document Expired!</span>
-                </ModalHeader>
-
-                <Modal.Body>
-                  <p className="pTagBody">
-                    This Document is no longer available.
-                  </p>
-                </Modal.Body>
-              </Modal>
-              {/* this modal is used for show decline alert */}
-              <Modal show={isDecline.isDeclined}>
-                <ModalHeader className="bg-danger">
-                  <span className="spanTagHead">Document Declined Alert!</span>
-                </ModalHeader>
-
-                <Modal.Body>
-                  {isDecline.currnt === "Sure" ? (
-                    <p className="pTagBody">
-                      Are you sure want to decline this document ?
-                    </p>
-                  ) : isDecline.currnt === "YouDeclined" ? (
-                    <p className="pTagBody">You have declined this document!</p>
-                  ) : (
-                    isDecline.currnt === "another" && (
-                      <p className="pTagBody">
-                        You cannot sign this document as it has been declined by
-                        one or more person(s).
-                      </p>
-                    )
-                  )}
-                </Modal.Body>
-                <Modal.Footer>
-                  {isDecline.currnt === "Sure" && (
-                    <>
-                      <button
-                        style={{
-                          color: "black"
-                        }}
-                        type="button"
-                        className="finishBtn"
-                        onClick={() => setIsDecline({ isDeclined: false })}
-                      >
-                        Close
-                      </button>
-                      <button
-                        style={{
-                          background: "#de4337"
-                        }}
-                        type="button"
-                        className="finishBtn"
-                        onClick={() => declineDoc()}
-                      >
-                        Yes
-                      </button>
-                    </>
-                  )}
-                </Modal.Footer>
-              </Modal>
               {/* this modal is used show this document is already sign */}
 
               <Modal show={isCompleted.isModal}>
@@ -965,7 +999,7 @@ function PdfRequestFiles() {
 
                 <Modal.Body>
                   <p className="pTagBody">
-                    This document has been signed by all Sigers.
+                    This document has been signed by all Signers.
                   </p>
                 </Modal.Body>
 
@@ -1015,6 +1049,8 @@ function PdfRequestFiles() {
                 setIsDecline={setIsDecline}
                 decline={true}
                 currentSigner={currentSigner}
+                pdfUrl={pdfUrl}
+                alreadySign={alreadySign}
               />
 
               <RenderPdf
@@ -1045,7 +1081,6 @@ function PdfRequestFiles() {
                     <div
                       style={{
                         background: themeColor()
-                        //  color:"white"
                       }}
                       className="signedStyle"
                     >

microfrontends/SignDocuments/src/Component/SignYourselfPdf.js

@@ -15,7 +15,11 @@ import EmailComponent from "./component/emailComponent";
 import FieldsComponent from "./component/fieldsComponent";
 import Modal from "react-bootstrap/Modal";
 import ModalHeader from "react-bootstrap/esm/ModalHeader";
-import { getBase64FromIMG } from "../utils/Utils";
+import {
+  convertPNGtoJPEG,
+  contractDocument,
+  getBase64FromIMG
+} from "../utils/Utils";
 import { useParams } from "react-router-dom";
 import Tour from "reactour";
 import { onSaveImage, onSaveSign } from "../utils/Utils";
@@ -24,11 +28,11 @@ import HandleError from "./component/HandleError";
 import Nodata from "./component/Nodata";
 import Header from "./component/header";
 import RenderPdf from "./component/renderPdf";
-import { contractUsers, contactBook } from "../utils/Utils";
+import { contractUsers, contactBook, urlValidator } from "../utils/Utils";
+import { modalAlign } from "../utils/Utils";
+import { $ } from "select-dom";
 //For signYourself inProgress section signer can add sign and complete doc sign.
 function SignYourSelf() {
-  // pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;
-
   const [pdfDetails, setPdfDetails] = useState([]);
   const [isSignPad, setIsSignPad] = useState(false);
   const [allPages, setAllPages] = useState(null);
@@ -169,61 +173,48 @@ function SignYourSelf() {
     //pdf from left and right component
     setPdfNewWidth(pdfWidth);
     if (documentId) {
-      getDocumentDetails();
+      getDocumentDetails(true);
     }
   }, []);
 
   //function for get document details for perticular signer with signer'object id
-  const getDocumentDetails = async () => {
-    await axios
-      .get(
-        `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
-          "_appName"
-        )}_Document?where={"objectId":"${documentId}"}&include=ExtUserPtr,Signers`,
-        {
-          headers: {
-            "Content-Type": "application/json",
-            "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-            "X-Parse-Session-Token": localStorage.getItem("accesstoken")
-          }
-        }
-      )
-      .then((Listdata) => {
-        const json = Listdata.data;
-        const res = json.results;
+  const getDocumentDetails = async (showComplete) => {
+    //getting document details
+    const documentData = await contractDocument(documentId);
 
-        if (res[0] && res.length > 0) {
-          setPdfDetails(res);
-          const isCompleted = res[0].IsCompleted && res[0].IsCompleted;
-          if (isCompleted) {
-            const docStatus = {
-              isCompleted: isCompleted
-            };
-
-            setDocumentStatus(docStatus);
-            const alreadySign = {
-              status: true,
-              mssg: "You have successfully signed the document!"
-            };
-            setShowAlreadySignDoc(alreadySign);
-            setPdfUrl(res[0].SignedUrl);
-          }
-        } else {
-          setNoData(true);
-
-          const loadObj = {
-            isLoad: false
-          };
-          setIsLoading(loadObj);
-        }
-      })
-      .catch((err) => {
-        const loadObj = {
-          isLoad: false
+    if (documentData && documentData.length > 0) {
+      setPdfDetails(documentData);
+      const isCompleted =
+        documentData[0].IsCompleted && documentData[0].IsCompleted;
+      if (isCompleted && showComplete) {
+        const docStatus = {
+          isCompleted: isCompleted
         };
-        setHandleError("Error: Something went wrong!");
-        setIsLoading(loadObj);
-      });
+
+        setDocumentStatus(docStatus);
+        const alreadySign = {
+          status: true,
+          mssg: "You have successfully signed the document!"
+        };
+        setShowAlreadySignDoc(alreadySign);
+        setPdfUrl(documentData[0].SignedUrl);
+      }
+    } else if (
+      documentData === "Error: Something went wrong!" ||
+      (documentData.result && documentData.result.error)
+    ) {
+      const loadObj = {
+        isLoad: false
+      };
+      setHandleError("Error: Something went wrong!");
+      setIsLoading(loadObj);
+    } else {
+      setNoData(true);
+      const loadObj = {
+        isLoad: false
+      };
+      setIsLoading(loadObj);
+    }
     await axios
       .get(
         `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
@@ -254,13 +245,10 @@ function SignYourSelf() {
         setHandleError("Error: Something went wrong!");
         setIsLoading(loadObj);
       });
-    const contractUsersRes = await contractUsers(jsonSender.objectId);
 
-    if (
-      contractUsersRes !== "Error: Something went wrong!" &&
-      contractUsersRes &&
-      contractUsersRes[0]
-    ) {
+    const contractUsersRes = await contractUsers(jsonSender.email);
+
+    if (contractUsersRes[0] && contractUsersRes.length > 0) {
       setContractName("_Users");
       setSignerUserId(contractUsersRes[0].objectId);
       const tourstatuss =
@@ -287,14 +275,12 @@ function SignYourSelf() {
       setIsLoading(loadObj);
     } else if (contractUsersRes.length === 0) {
       const contractContactBook = await contactBook(jsonSender.objectId);
-      if (contractContactBook && contractContactBook[0]) {
+      if (contractContactBook && contractContactBook.length > 0) {
         setContractName("_Contactbook");
-
         setSignerUserId(contractContactBook[0].objectId);
         const tourstatuss =
           contractContactBook[0].TourStatus &&
           contractContactBook[0].TourStatus;
-
         if (tourstatuss && tourstatuss.length > 0) {
           setTourStatus(tourstatuss);
           const checkTourRecipients = tourstatuss.filter(
@@ -304,58 +290,14 @@ function SignYourSelf() {
             setCheckTourStatus(checkTourRecipients[0].signyourself);
           }
         }
+      } else {
+        setNoData(true);
       }
       const loadObj = {
         isLoad: false
       };
       setIsLoading(loadObj);
     }
-
-    // await axios
-    //   .get(
-    //     `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
-    //       "_appName"
-    //     )}_Contactbook?where={"UserId": {"__type": "Pointer","className": "_User", "objectId":"${
-    //       jsonSender.objectId
-    //     }"}}`,
-    //     {
-    //       headers: {
-    //         "Content-Type": "application/json",
-    //         "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-    //         "X-Parse-Session-Token": localStorage.getItem("accesstoken"),
-    //       },
-    //     }
-    //   )
-    //   .then((Listdata) => {
-    //     const json = Listdata.data;
-    //     const res = json.results;
-
-    //     if (res[0]) {
-    //       setSignerUserId(res[0].objectId);
-    //       const tourstatuss = res[0].TourStatus && res[0].TourStatus;
-
-    //       if (tourstatuss && tourstatuss.length > 0) {
-    //         setTourStatus(tourstatuss);
-    //         const checkTourRecipients = tourstatuss.filter(
-    //           (data) => data.signyourself
-    //         );
-    //         if (checkTourRecipients && checkTourRecipients.length > 0) {
-    //           setCheckTourStatus(checkTourRecipients[0].signyourself);
-    //         }
-    //       }
-    //     }
-    //     const loadObj = {
-    //       isLoad: false,
-    //     };
-    //     setIsLoading(loadObj);
-    //   })
-    //   .catch((err) => {
-    //     const loadObj = {
-    //       isLoad: false,
-    //     };
-    //     setHandleError("Error: Something went wrong!");
-    //     setIsLoading(loadObj);
-    //   });
   };
 
   //function for setting position after drop signature button over pdf
@@ -508,39 +450,13 @@ function SignYourSelf() {
           imgUrlList.map(async (data) => {
             let ImgUrl = data.SignUrl;
             //cheking signUrl is defau;t signature url of custom url
-            const checkUrl = ImgUrl.includes("https:");
+            const checkUrl = urlValidator(ImgUrl);
 
             //if default signature url then convert it in base 64
             if (checkUrl) {
               ImgUrl = await getBase64FromIMG(ImgUrl + "?get");
             }
-
             //function for convert signature png base64 url to jpeg base64
-            const convertPNGtoJPEG = (base64Data) => {
-              return new Promise((resolve, reject) => {
-                const canvas = document.createElement("canvas");
-                const img = new Image();
-                img.src = base64Data;
-
-                img.onload = () => {
-                  canvas.width = img.width;
-                  canvas.height = img.height;
-
-                  const ctx = canvas.getContext("2d");
-                  ctx.drawImage(img, 0, 0);
-
-                  // Convert to JPEG by using the canvas.toDataURL() method
-                  const jpegBase64Data = canvas.toDataURL("image/jpeg");
-
-                  resolve(jpegBase64Data);
-                };
-
-                img.onerror = (error) => {
-                  reject(error);
-                };
-              });
-            };
-
             convertPNGtoJPEG(ImgUrl)
               .then((jpegBase64Data) => {
                 const removeBase64Fromjpeg = "data:image/jpeg;base64,";
@@ -548,7 +464,6 @@ function SignYourSelf() {
                   removeBase64Fromjpeg,
                   ""
                 );
-
                 //function for call to embed signature in pdf and get digital signature pdf
                 signPdfFun(newImgUrl, documentId, data, pdfBase64, pageNo);
               })
@@ -589,7 +504,12 @@ function SignYourSelf() {
             imgUrlList.map(async (url) => {
               let signUrl = url.SignUrl;
 
-              const checkUrl = url.SignUrl.includes("https:");
+              if (url.ImageType === "image/png") {
+                //function for convert signature png base64 url to jpeg base64
+                const newUrl = await convertPNGtoJPEG(signUrl);
+                signUrl = newUrl;
+              }
+              const checkUrl = urlValidator(signUrl);
               if (checkUrl) {
                 signUrl = signUrl + "?get";
               }
@@ -599,41 +519,41 @@ function SignYourSelf() {
             })
           );
           images.forEach(async (imgData, id) => {
-            let img;
-            if (
-              imgUrlList[id].ImageType &&
-              imgUrlList[id].ImageType === "image/jpeg"
-            ) {
-              img = await pdfDoc.embedJpg(imgData);
-            } else if (
-              imgUrlList[id].ImageType &&
-              imgUrlList[id].ImageType === "image/png"
-            ) {
-              img = await pdfDoc.embedPng(imgData);
-            } else {
-              img = await pdfDoc.embedPng(imgData);
-            }
-
+            let img = await pdfDoc.embedJpg(imgData);
             const imgHeight = imgUrlList[id].Height
               ? imgUrlList[id].Height
               : 60;
             const imgWidth = imgUrlList[id].Width ? imgUrlList[id].Width : 150;
-            const isMobile = window.innerWidth < 712;
+            const isMobile = window.innerWidth < 767;
             const newWidth = window.innerWidth;
             const scale = isMobile ? pdfOriginalWidth / newWidth : 1;
+
+            const posY = () => {
+              if (isMobile) {
+                if (id === 0) {
+                  return (
+                    page.getHeight() -
+                    imgUrlList[id].yPosition * scale -
+                    imgHeight
+                  );
+                } else if (id > 0) {
+                  return page.getHeight() - imgUrlList[id].yPosition * scale;
+                }
+              } else {
+                return page.getHeight() - imgUrlList[id].yPosition - imgHeight;
+              }
+            };
             page.drawImage(img, {
               x: isMobile
-                ? imgUrlList[id].xPosition * scale + 50
+                ? imgUrlList[id].xPosition * scale + imgWidth / 2
                 : imgUrlList[id].xPosition,
-              y:
-                page.getHeight() - imgUrlList[id].yPosition * scale - imgHeight,
+              y: posY(),
               width: imgWidth,
               height: imgHeight
             });
           });
         }
         const pdfBytes = await pdfDoc.saveAsBase64({ useObjectStreams: false });
-        // console.log("pdfbyte", pdfBytes);
         signPdfFun(pdfBytes, documentId);
       }
       setIsSignPad(false);
@@ -652,17 +572,18 @@ function SignYourSelf() {
     pageNo
   ) => {
     let singleSign;
-    const isMobile = window.innerWidth < 712;
+
+    const isMobile = window.innerWidth < 767;
     const newWidth = window.innerWidth;
     const scale = isMobile ? pdfOriginalWidth / newWidth : 1;
-
+    const imgWidth = xyPosData ? xyPosData.Width : 150;
     if (xyPostion.length === 1 && xyPostion[0].pos.length === 1) {
       const height = xyPosData.Height ? xyPosData.Height : 60;
       const bottomY = xyPosData.isDrag
         ? xyPosData.yBottom * scale - height
         : xyPosData.firstYPos
-        ? xyPosData.yBottom * scale - height + xyPosData.firstYPos
-        : xyPosData.yBottom * scale - height;
+          ? xyPosData.yBottom * scale - height + xyPosData.firstYPos
+          : xyPosData.yBottom * scale - height;
 
       singleSign = {
         pdfFile: pdfBase64Url,
@@ -670,7 +591,7 @@ function SignYourSelf() {
         sign: {
           Base64: base64Url,
           Left: isMobile
-            ? xyPosData.xPosition * scale + 80
+            ? xyPosData.xPosition * scale + imgWidth / 2
             : xyPosData.xPosition,
           Bottom: bottomY,
           Width: xyPosData.Width ? xyPosData.Width : 150,
@@ -684,14 +605,13 @@ function SignYourSelf() {
         docId: documentId
       };
     }
-    // console.log("data",singleSign)
+
     await axios
       .post(`${localStorage.getItem("baseUrl")}functions/signPdf`, singleSign, {
         headers: {
           "Content-Type": "application/json",
           "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
           sessionToken: localStorage.getItem("accesstoken")
-          // sessiontoken,
         }
       })
       .then((Listdata) => {
@@ -699,15 +619,7 @@ function SignYourSelf() {
         // console.log("json ", json);
         setPdfUrl(json.result.data);
         if (json.result.data) {
-          const docStatus = {
-            isCompleted: true
-          };
-
-          setDocumentStatus(docStatus);
-          const loadObj = {
-            isLoad: false
-          };
-          setIsLoading(loadObj);
+          getDocumentDetails(false);
         }
       })
       .catch((err) => {
@@ -718,7 +630,6 @@ function SignYourSelf() {
 
   //function for save x and y position and show signature  tab on that position
   const handleTabDrag = (key, e) => {
-    // console.log("key", key);
     setDragKey(key);
     setIsDragging(true);
   };
@@ -791,8 +702,6 @@ function SignYourSelf() {
   //function for image upload or update
   const onImageChange = (event) => {
     if (event.target.files && event.target.files[0]) {
-      // setIsSignPad(false);
-
       const imageType = event.target.files[0].type;
 
       const reader = new FileReader();
@@ -825,16 +734,11 @@ function SignYourSelf() {
 
         setImage({ src: image.src, imgType: imageType });
       };
-
-      //const imgUrl = URL.createObjectURL(event.target.files[0]);
-
-      //  const imgData = { width: newWidth, height: newHeight, src: imgUrl };
     }
   };
 
   //function for save button to save signature or image url
   const saveSign = (isDefaultSign) => {
-    // console.log("isDefault sign", isDefaultSign);
     const signatureImg = isDefaultSign ? defaultSignImg : signature;
     setIsSignPad(false);
 
@@ -878,9 +782,6 @@ function SignYourSelf() {
 
     if (updateFilter.length > 0) {
       const getXYdata = xyPostion[index].pos;
-
-      // const updateWidth = getXYdata[key].Width;
-      // const updateHeight = getXYdata[key].Height;
       const getPosData = getXYdata;
       const addSign = getPosData.map((url, ind) => {
         if (url.key === key) {
@@ -937,7 +838,7 @@ function SignYourSelf() {
 
     let filterData = xyPostion[index].pos.filter((data) => data.key !== key);
 
-    //  //delete and update block position
+    //delete and update block position
     if (filterData.length > 0) {
       updateResizeData.push(filterData);
       const newUpdatePos = xyPostion.map((obj, ind) => {
@@ -949,12 +850,10 @@ function SignYourSelf() {
 
       setXyPostion(newUpdatePos);
     } else {
-      // setXyPostion([]);
-
       const getRemainPage = xyPostion.filter(
         (data) => data.pageNumber !== pageNumber
       );
-      // console.log("remainPage",getRemainPage)
+
       if (getRemainPage && getRemainPage.length > 0) {
         setXyPostion(getRemainPage);
       } else {
@@ -996,7 +895,6 @@ function SignYourSelf() {
   };
   const tourConfig = [
     {
-      // updateDelay: 1500,
       selector: '[data-tut="reactourFirst"]',
       content: `Drag the signature or stamp placeholder onto the PDF to choose your desired signing location.`,
       position: "top",
@@ -1046,8 +944,6 @@ function SignYourSelf() {
       )
       .then((Listdata) => {
         // const json = Listdata.data;
-        // const res = json.results;
-        // console.log("res", json);
       })
       .catch((err) => {
         console.log("axois err ", err);
@@ -1095,7 +991,11 @@ function SignYourSelf() {
           >
             {/* this modal is used show this document is already sign */}
 
-            <Modal show={showAlreadySignDoc.status}>
+            <Modal
+              show={showAlreadySignDoc.status}
+              onShow={() => modalAlign()}
+              backdropClassName="signature-backdrop"
+            >
               <ModalHeader style={{ background: themeColor() }}>
                 <span style={{ color: "white" }}> Sign Documents</span>
               </ModalHeader>
@@ -1169,6 +1069,8 @@ function SignYourSelf() {
               pdfDetails={pdfDetails}
               isShowHeader={true}
               currentSigner={true}
+              alreadySign={pdfUrl ? true : false}
+              isSignYourself={true}
             />
 
             {/* className="hidePdf" */}

microfrontends/SignDocuments/src/Component/component/CustomModal.js

@@ -0,0 +1,59 @@
+import React from "react";
+import "../../css/customModal.css";
+import "../../css/signature.css";
+
+function CustomModal({
+  show,
+  headMsg,
+  bodyMssg,
+  footerMessage,
+  declineDoc,
+  setIsDecline,
+  containerWH
+}) {
+  const isMobile = window.innerWidth < 767;
+  return (
+    show && (
+      <div
+        className="parentDiv"
+        style={{
+          width: containerWH && containerWH.width,
+          height: isMobile ? "100%" : containerWH && containerWH.height
+        }}
+      >
+        <div className="childDiv">
+          <div className="modalHeadDiv bg-danger">{headMsg && headMsg}</div>
+          <div className="modalBodyDIv">
+            <p className="pTagBody">{bodyMssg && bodyMssg}</p>
+          </div>
+          {footerMessage && (
+            <div className="modalFooterDiv">
+              <button
+                style={{
+                  color: "black"
+                }}
+                type="button"
+                className="finishBtn"
+                onClick={() => setIsDecline({ isDeclined: false })}
+              >
+                Close
+              </button>
+              <button
+                style={{
+                  background: "#de4337"
+                }}
+                type="button"
+                className="finishBtn"
+                onClick={() => declineDoc()}
+              >
+                Yes
+              </button>
+            </div>
+          )}
+        </div>
+      </div>
+    )
+  );
+}
+
+export default CustomModal;

microfrontends/SignDocuments/src/Component/component/defaultSignature.js

@@ -1,58 +1,18 @@
-import React, { useEffect } from "react";
-import axios from "axios";
+import React from "react";
+ 
 
 function DefaultSignature({
   themeColor,
   defaultSignImg,
   setShowAlreadySignDoc,
-  setDefaultSignImg,
-  userObjectId,
-  setIsLoading,
-  xyPostion,
+  xyPostion
 }) {
-  useEffect(() => {
-    getDefaultSignature(userObjectId);
-  }, []);
-
-  //function for fetch default sigature added bu users
-  const getDefaultSignature = async (userObjectId) => {
-    await axios
-      .get(
-        `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
-          "_appName"
-        )}_Signature?where={"UserId": {"__type": "Pointer","className": "_User", "objectId":"${userObjectId}"}}`,
-        {
-          headers: {
-            "Content-Type": "application/json",
-            "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-            "X-Parse-Session-Token": localStorage.getItem("accesstoken"),
-          },
-        }
-      )
-      .then((Listdata) => {
-        const json = Listdata.data;
-        const res = json.results;
-
-        if (res[0] && res.length > 0) {
-          setDefaultSignImg(res[0].ImageURL);
-        }
-        const loadObj = {
-          isLoad: false,
-        };
-        setIsLoading(loadObj);
-      })
-      .catch((err) => {
-        // this.setState({ loading: false });
-        console.log("axois err ", err);
-      });
-  };
-
   const confirmToaddDefaultSign = () => {
     if (xyPostion.length > 0) {
       const alreadySign = {
         status: true,
         mssg: "Are you sure you want to sign at requested locations?",
-        sure: true,
+        sure: true
       };
       setShowAlreadySignDoc(alreadySign);
     } else {
@@ -67,7 +27,7 @@ function DefaultSignature({
           background: themeColor(),
           color: "white",
           padding: "5px",
-          fontFamily: "sans-serif",
+          fontFamily: "sans-serif"
         }}
       >
         Signature
@@ -78,7 +38,7 @@ function DefaultSignature({
           flexDirection: "column",
           alignItems: "center",
           marginTop: "10px",
-          fontWeight: "600",
+          fontWeight: "600"
         }}
       >
         {defaultSignImg ? (
@@ -90,7 +50,7 @@ function DefaultSignature({
                 style={{
                   width: "100%",
                   height: "100%",
-                  objectFit: "contain",
+                  objectFit: "contain"
                 }}
                 src={defaultSignImg}
               />
@@ -100,7 +60,7 @@ function DefaultSignature({
                 background: themeColor(),
                 color: "white",
                 marginTop: "20px",
-                cursor: "pointer",
+                cursor: "pointer"
               }}
               type="button"
               className="finishBtn finishnHover"
@@ -111,7 +71,9 @@ function DefaultSignature({
           </>
         ) : (
           <div style={{ margin: "10px" }}>
-            <span>Click a signature placeholder to start signing the document!</span>
+            <span>
+              Click a signature placeholder to start signing the document!
+            </span>
           </div>
         )}
       </div>

microfrontends/SignDocuments/src/Component/component/emailComponent.js

@@ -18,7 +18,7 @@ function EmailComponent({
   setSuccessEmail,
   signObjId,
   pdfName,
-  sender,
+  sender
 }) {
   const [emailCount, setEmailCount] = useState([]);
   const [emailValue, setEmailValue] = useState();
@@ -26,30 +26,9 @@ function EmailComponent({
   //function for send email
   const sendEmail = async () => {
     setIsLoading(true);
-    let sendMail, recipent;
+    let sendMail;
     for (let i = 0; i < emailCount.length; i++) {
-      // await axios
-      //   .get(
-      //     `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem("_appName")}_Contactbook?where={"Email":"${emailCount[i]}"}`,
-      //     {
-      //       headers: {
-      //         "Content-Type": "application/json",
-      //         "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-      //         sessionToken: localStorage.getItem("accesstoken"),
-      //       },
-      //     }
-      //   )
-      //   .then((Listdata) => {
-      //     const json = Listdata.data;
-      //     if (json.results[0]) {
-      //       recipent = json.results[0];
-      //     }
-      //   })
-      //   .catch((err) => {
-      //     console.log("axois err ", err);
-      //   });
       try {
-        console.log("recipients", recipent);
         const imgPng =
           "https://qikinnovation.ams3.digitaloceanspaces.com/logo.png";
         // "https://qikinnovation.ams3.digitaloceanspaces.com/mailLogo_2023-08-18T12%3A51%3A31.573Z.png";
@@ -58,15 +37,9 @@ function EmailComponent({
         const headers = {
           "Content-Type": "application/json",
           "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-          sessionToken: localStorage.getItem("accesstoken"),
+          sessionToken: localStorage.getItem("accesstoken")
         };
-        // const serverUrl = localStorage.getItem("baseUrl");
-        // const newServer = serverUrl.replaceAll("/", "%2F");
 
-        // const serverParams = `${newServer}&${localStorage.getItem(
-        //   "parseAppId"
-        // )}&${localStorage.getItem("_appName")}`;
-        // let pdfUrlWeb = `<span><a href=https://qik-ai-org.github.io/Sign-MicroappV2/#/login/${signObjId}/${recipent.Email}/${serverParams} style='cursor: pointer;'>  ${pdfName}</a><span>`;
         const themeBGcolor = themeColor();
         let params = {
           pdfName: pdfName,
@@ -83,8 +56,7 @@ function EmailComponent({
             pdfName +
             " Standard is attached to this email. Kindly download the document from the attachment.</p></div> </div><div><p>This is an automated email from Open Sign. For any queries regarding this email, please contact the sender " +
             sender.email +
-            " directly. If you think this email is inappropriate or spam, you may file a complaint with Open Sign here.</p></div></div></body></html>",
-          //"html":"<html><head><meta http-equiv='Content-Type' content='text/html; charset=UTF-8' /> </head>   <body> <div style='background-color: #f5f5f5; padding: 20px'> <div   style=' box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;background-color: white;padding-bottom: 20px;'> <div><img src="+imgPng +" height='50' style='padding: 20px' /></div>  <div  style=' padding: 2px;font-family: system-ui;background-color: #47a3ad;'><p style='font-size: 20px;font-weight: 400;color: white;padding-left: 20px;' > Digital Signature Request</p></div><div><p style='padding: 20px;font-family: system-ui;font-size: 14px;   margin-bottom: 10px;'> " + recipent.Name + " has requested you to review and sign" +pdfName+"</p><div style='padding: 5px 0px 5px 25px;display: flex;flex-direction: row;justify-content: space-around;'><span>Sender</span><span>" + recipent.Email + " </span></div><div style='display: flex; justify-content: center;margin-top: 10px;'><button style='padding: 8px 15px 8px 15px;background-color: #d46b0f;color: white;  border: 0px;box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px,rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;'>Sign here</button></div></div></div><div><p> This is an automated email from Open Sign. For any queries regarding this email, please contact the sender " + recipent.Email + " directly.If you think this email is inappropriate or spam, you may file a complaint with Open Sign here.</p> </div></div></body> </html>"
+            " directly. If you think this email is inappropriate or spam, you may file a complaint with Open Sign here.</p></div></div></body></html>"
         };
         sendMail = await axios.post(url, params, { headers: headers });
       } catch (error) {
@@ -135,17 +107,38 @@ function EmailComponent({
   const handleToPrint = async (event) => {
     event.preventDefault();
 
-    const base64 = await getBase64FromUrl(pdfUrl);
-    printModule({ printable: base64, type: "pdf", base64: true });
-
-    //  window.print('https://nxgcreator.s3.ap-south-1.amazonaws.com/exported_file_32_2023-08-22T04%3A59%3A13.432Z.pdf',);
+    const pdf = await getBase64FromUrl(pdfUrl);
+    const isAndroidDevice = navigator.userAgent.match(/Android/i);
+    const isAppleDevice =
+      (/iPad|iPhone|iPod/.test(navigator.platform) ||
+        (navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1)) &&
+      !window.MSStream;
+    if (isAndroidDevice || isAppleDevice) {
+      const byteArray = Uint8Array.from(
+        atob(pdf)
+          .split("")
+          .map((char) => char.charCodeAt(0))
+      );
+      const blob = new Blob([byteArray], { type: "application/pdf" });
+      const blobUrl = URL.createObjectURL(blob);
+      window.open(blobUrl, "_blank");
+    } else {
+      printModule({ printable: pdf, type: "pdf", base64: true });
+    }
   };
 
   //handle download signed pdf
   const handleDownloadPdf = () => {
-    saveAs(pdfUrl, `${pdfName}_signed_by_OpenSign™.pdf`);
+    saveAs(pdfUrl, `${sanitizeFileName(pdfName)}_signed_by_OpenSign™.pdf`);
   };
 
+  const sanitizeFileName = (pdfName) => {
+    // Replace spaces with underscore
+    return pdfName.replace(/ /g, "_");
+  };
+
+  const isAndroid = /Android/i.test(navigator.userAgent);
+
   return (
     <div>
       {/* isEmail */}
@@ -162,7 +155,7 @@ function EmailComponent({
               alignItems: "center",
               zIndex: "20",
               backgroundColor: "#e6f2f2",
-              opacity: 0.8,
+              opacity: 0.8
             }}
           >
             <img
@@ -177,30 +170,32 @@ function EmailComponent({
         )}
 
         <ModalHeader style={{ background: themeColor() }}>
-          <span style={{ color: "white" }}>Email Documents</span>
+          <span style={{ color: "white" }}>Successfully signed!</span>
 
           <div style={{ display: "flex", flexDirection: "row" }}>
             <div></div>
-            <button
-              onClick={handleToPrint}
-              style={{
-                display: "flex",
-                flexDirection: "row",
-                alignItems: "center",
-              }}
-              className="btn btn-primary btn-sm"
-            >
-              <i
-                className="fa fa-print"
+            {!isAndroid && (
+              <button
+                onClick={handleToPrint}
                 style={{
-                  fontSize: "15px",
-                  marginRight: "3px",
-                  color: "white",
+                  display: "flex",
+                  flexDirection: "row",
+                  alignItems: "center"
                 }}
-                aria-hidden="true"
-              ></i>
-              Print
-            </button>
+                className="btn btn-primary btn-sm"
+              >
+                <i
+                  className="fa fa-print"
+                  style={{
+                    fontSize: "15px",
+                    marginRight: "3px",
+                    color: "white"
+                  }}
+                  aria-hidden="true"
+                ></i>
+                Print
+              </button>
+            )}
 
             <button
               className="btn btn-danger btn-sm"
@@ -209,7 +204,7 @@ function EmailComponent({
                 display: "flex",
                 flexDirection: "row",
                 alignItems: "center",
-                marginLeft: "10px",
+                marginLeft: "10px"
               }}
             >
               <i
@@ -217,7 +212,7 @@ function EmailComponent({
                 style={{
                   color: "white",
                   fontSize: "15px",
-                  marginRight: "3px",
+                  marginRight: "3px"
                 }}
                 aria-hidden="true"
               ></i>
@@ -231,7 +226,7 @@ function EmailComponent({
             <div
               style={{
                 position: "absolute",
-                marginLeft: "50px",
+                marginLeft: "50px"
               }}
             >
               <img
@@ -249,7 +244,7 @@ function EmailComponent({
               verticalAlign: "baseline",
               fontWeight: "500",
               color: "#403f3e",
-              fontSize: "15px",
+              fontSize: "15px"
             }}
           >
             Recipients added here will get a copy of the signed document.
@@ -261,18 +256,26 @@ function EmailComponent({
                   style={{
                     display: "flex",
                     flexDirection: "row",
-                    width: "450px",
-                    flexWrap: "wrap",
+
+                    flexWrap: "wrap"
                   }}
                 >
                   {emailCount.map((data, ind) => {
                     return (
-                      <div className="emailChip" key={ind}>
+                      <div
+                        className="emailChip"
+                        style={{
+                          display: "flex",
+                          flexDirection: "row",
+                          alignItems: "center"
+                        }}
+                        key={ind}
+                      >
                         <span
                           style={{
                             color: "white",
                             fontSize: "13px",
-                            marginRight: "20px",
+                            marginTop: "2px"
                           }}
                         >
                           {data}
@@ -284,7 +287,7 @@ function EmailComponent({
                           src={close}
                           width={10}
                           height={10}
-                          style={{ fontWeight: "600" }}
+                          style={{ fontWeight: "600", margin: "0 0 10px 2px" }}
                         />
                       </div>
                     );
@@ -317,7 +320,7 @@ function EmailComponent({
           )}
           <span
             style={{
-              cursor: emailValue && "pointer",
+              cursor: emailValue && "pointer"
             }}
             onClick={() => {
               if (emailValue) {
@@ -330,7 +333,7 @@ function EmailComponent({
                 backgroundColor: themeColor(),
                 padding: "2px 10px",
                 marginTop: "10px",
-                color: "white",
+                color: "white"
               }}
               className="fa fa-plus"
               aria-hidden="true"
@@ -342,7 +345,7 @@ function EmailComponent({
               background: "#e3e2e1",
               marginTop: "30px",
               padding: "5px",
-              borderRadius: "3px",
+              borderRadius: "3px"
             }}
           >
             <span style={{ fontWeight: "700" }}>Note:</span>
@@ -356,7 +359,7 @@ function EmailComponent({
         <Modal.Footer>
           <button
             style={{
-              color: "black",
+              color: "black"
             }}
             type="button"
             className="finishBtn"
@@ -368,7 +371,7 @@ function EmailComponent({
             disabled={emailCount.length === 0 && true}
             style={{
               background: themeColor(),
-              color: "white",
+              color: "white"
             }}
             type="button"
             className={emailCount.length === 0 ? "defaultBtn" : "finishBtn"}

microfrontends/SignDocuments/src/Component/component/fieldsComponent.js

@@ -36,8 +36,8 @@ function FieldsComponent({
 }) {
   const signStyle = pdfUrl ? "disableSign" : "signatureBtn";
 
-  const isMobile = window.innerWidth < 712;
-
+  const isMobile = window.innerWidth <767;
+  
   const SelectItem = React.forwardRef(
     ({ children, className, ...props }, forwardedRef) => {
       return (
@@ -107,7 +107,7 @@ function FieldsComponent({
                   }}
                 >
                   <Select.Trigger
-                    className="SelectTrigger"
+                    className={selectedEmail ? "selectEmail": "SelectTrigger"}
                     style={{
                       background: isSelectListId
                         ? color[isSelectListId % color.length]
@@ -115,7 +115,10 @@ function FieldsComponent({
                     }}
                     aria-label="Food"
                   >
-                    <Select.Value placeholder="Select signer.." />
+                    <Select.Value
+                    
+                    placeholder="Select signer.." />
+                    {!selectedEmail && 
                     <Select.Icon className="SelectIcon">
                       <i
                         style={{
@@ -127,7 +130,7 @@ function FieldsComponent({
                         className="fa fa-angle-down"
                         aria-hidden="true"
                       ></i>
-                    </Select.Icon>
+                    </Select.Icon>}
                   </Select.Trigger>
                   <Select.Portal>
                     <Select.Content

microfrontends/SignDocuments/src/Component/component/header.js

@@ -27,16 +27,17 @@ function Header({
   signersdata,
   isMailSend,
   alertSendEmail,
-  isSigned,
   isCompleted,
   isShowHeader,
   decline,
   currentSigner,
   dataTut4,
+  alreadySign,
+  isSignYourself
 }) {
-  const isMobile = window.innerWidth < 712;
+  const isMobile = window.innerWidth < 767;
   const navigate = useNavigate();
-
+  const isGuestSigner = localStorage.getItem("isGuestSigner");
   //for go to previous page
   function previousPage() {
     changePage(-1);
@@ -49,7 +50,7 @@ function Header({
   const handleDeclinePdfAlert = async () => {
     const currentDecline = {
       currnt: "Sure",
-      isDeclined: true,
+      isDeclined: true
     };
     setIsDecline(currentDecline);
   };
@@ -59,27 +60,181 @@ function Header({
     event.preventDefault();
 
     const pdf = await getBase64FromUrl(pdfUrl);
-
-    printModule({ printable: pdf, type: "pdf", base64: true });
+    const isAndroidDevice = navigator.userAgent.match(/Android/i);
+    const isAppleDevice =
+      (/iPad|iPhone|iPod/.test(navigator.platform) ||
+        (navigator.platform === "MacIntel" && navigator.maxTouchPoints > 1)) &&
+      !window.MSStream;
+    if (isAndroidDevice || isAppleDevice) {
+      const byteArray = Uint8Array.from(
+        atob(pdf)
+          .split("")
+          .map((char) => char.charCodeAt(0))
+      );
+      const blob = new Blob([byteArray], { type: "application/pdf" });
+      const blobUrl = URL.createObjectURL(blob);
+      window.open(blobUrl, "_blank");
+    } else {
+      printModule({ printable: pdf, type: "pdf", base64: true });
+    }
   };
 
   //handle download signed pdf
   const handleDownloadPdf = () => {
     const pdfName = pdfDetails[0] && pdfDetails[0].Name;
-
-    saveAs(pdfUrl, `${pdfName}_signed_by_OpenSign™.pdf`);
+    saveAs(pdfUrl, `${sanitizeFileName(pdfName)}_signed_by_OpenSign™.pdf`);
   };
 
+  const sanitizeFileName = (pdfName) => {
+    // Replace spaces with underscore
+    return pdfName.replace(/ /g, "_");
+  };
+  //certificate generate and download component in mobile view
+  const CertificateDropDown = () => {
+    //after generate download certifcate pdf
+    const handleDownload = (pdfBlob, fileName) => {
+      if (pdfBlob) {
+        const url = window.URL.createObjectURL(pdfBlob);
+        // Create a temporary anchor element
+        const link = document.createElement("a");
+        link.href = url;
+        link.download = fileName;
+        // Append the anchor to the body
+        document.body.appendChild(link);
+        // Programmatically click the anchor to trigger the download
+        link.click();
+        // Remove the anchor from the body
+        document.body.removeChild(link);
+        // Release the object URL to free up resources
+        window.URL.revokeObjectURL(url);
+      }
+    };
+
+    return (
+      <PDFDownloadLink
+        onClick={(e) => e.preventDefault()}
+        style={{ textDecoration: "none", zIndex: "35" }}
+        document={<Certificate pdfData={pdfDetails} />}
+      >
+        {({ blob, url, loading, error }) => (
+          <>
+            {loading ? (
+              <div
+                style={{
+                  border: "none",
+                  backgroundColor: "#fff"
+                }}
+              >
+                <i
+                  className="fa fa-certificate"
+                  style={{
+                    marginRight: "2px"
+                  }}
+                  aria-hidden="true"
+                ></i>
+                Certificate
+              </div>
+            ) : (
+              <div
+                style={{
+                  border: "none",
+                  backgroundColor: "#fff"
+                }}
+                onClick={() =>
+                  handleDownload(
+                    blob,
+                    `completion certificate-${
+                      pdfDetails[0] && pdfDetails[0].Name
+                    }.pdf`
+                  )
+                }
+              >
+                <i
+                  className="fa fa-certificate"
+                  style={{
+                    marginRight: "2px"
+                  }}
+                  aria-hidden="true"
+                ></i>
+                Certificate
+              </div>
+            )}
+          </>
+        )}
+      </PDFDownloadLink>
+    );
+  };
+  const CertificateComponent = () => {
+    return (
+      <PDFDownloadLink
+        style={{ textDecoration: "none" }}
+        document={<Certificate pdfData={pdfDetails} />}
+        fileName={`completion certificate-${
+          pdfDetails[0] && pdfDetails[0].Name
+        }.pdf`}
+      >
+        {({ blob, url, loading, error }) =>
+          loading ? (
+            <button
+              type="button"
+              className="defaultBtn certificateBtn"
+              style={{
+                display: "flex",
+                flexDirection: "row",
+                alignItems: "center"
+              }}
+            >
+              <i
+                className="fa fa-certificate"
+                style={{
+                  color: "white",
+                  fontSize: "15px",
+                  marginRight: "3px"
+                }}
+                aria-hidden="true"
+              ></i>
+              Certificate
+            </button>
+          ) : (
+            <button
+              type="button"
+              className="defaultBtn certificateBtn"
+              style={{
+                display: "flex",
+                flexDirection: "row",
+                alignItems: "center"
+              }}
+            >
+              <i
+                className="fa fa-certificate"
+                style={{
+                  color: "white",
+                  fontSize: "15px",
+                  marginRight: "3px"
+                }}
+                aria-hidden="true"
+              ></i>
+              Certificate
+            </button>
+          )
+        }
+      </PDFDownloadLink>
+    );
+  };
   return (
     <div
-      style={{ paddingBottom: "5px", paddingTop: "5px" }}
+      style={{ padding: !isGuestSigner && "5px 0px 5px 0px" }}
       className="mobileHead"
     >
       {isMobile && isShowHeader ? (
         <div
           id="navbar"
-          className="stickyHead"
-          style={{ width: window.innerWidth - 30 + "px" }}
+          className={isGuestSigner ? "stickySignerHead" : "stickyHead"}
+          style={{
+            width: isGuestSigner
+              ? window.innerWidth
+              : window.innerWidth - 30 + "px"
+          }}
         >
           <div className="preBtn2">
             <div
@@ -108,7 +263,7 @@ function Header({
                   fontSize: "13px",
                   fontWeight: "600",
                   marginLeft: "10px",
-                  marginRight: "10px",
+                  marginRight: "10px"
                 }}
               >
                 {pageNumber || (allPages ? 1 : "--")} of {allPages || "--"}
@@ -123,16 +278,16 @@ function Header({
                 style={{ color: "gray", cursor: "pointer" }}
               ></i>
             </div>
-            {pdfUrl ? (
+            {pdfUrl && alreadySign ? (
               <DropdownMenu.Root>
                 <DropdownMenu.Trigger asChild>
                   <div
-                    // onClick={() => handleDownloadPdf()}
                     style={{
                       color: themeColor(),
                       border: "none",
                       fontWeight: "650",
                       fontSize: "16px",
+                      padding: "0px 3px 0px 5px"
                     }}
                   >
                     <i className="fa fa-ellipsis-v" aria-hidden="true"></i>
@@ -151,7 +306,7 @@ function Header({
                       <div
                         style={{
                           display: "flex",
-                          flexDirection: "row",
+                          flexDirection: "row"
                         }}
                       >
                         <i
@@ -162,39 +317,41 @@ function Header({
                         Download
                       </div>
                     </DropdownMenu.Item>
-                    <DropdownMenu.Item className="DropdownMenuItem">
-                      <PDFDownloadLink
-                        document={<Certificate pdfData={pdfDetails} />}
-                        fileName={`completion certificate-${
-                          pdfDetails[0] && pdfDetails[0].Name
-                        }.pdf`}
+                    {recipient && pdfDetails[0] && pdfDetails.length > 0 ? (
+                      <DropdownMenu.Item className="DropdownMenuItem">
+                        <CertificateDropDown />
+                      </DropdownMenu.Item>
+                    ) : isPdfRequestFiles &&
+                      alreadySign &&
+                      isCompleted.isCertificate ? (
+                      <DropdownMenu.Item className="DropdownMenuItem">
+                        <CertificateDropDown />
+                      </DropdownMenu.Item>
+                    ) : (
+                      isSignYourself && (
+                        <DropdownMenu.Item className="DropdownMenuItem">
+                          <CertificateDropDown />
+                        </DropdownMenu.Item>
+                      )
+                    )}
+                    <DropdownMenu.Item
+                      className="DropdownMenuItem"
+                      onClick={handleToPrint}
+                    >
+                      <div
+                        style={{
+                          display: "flex",
+                          flexDirection: "row"
+                        }}
                       >
-                        {({ blob, url, loading, error }) => (
-                          <>
-                            {console.log("error", error)}
-                            {loading ? (
-                              "Loading document..."
-                            ) : (
-                              <div
-                                style={{
-                                  display: "flex",
-                                  flexDirection: "row",
-                                }}
-                              >
-                                <i
-                                  className="fa fa-certificate"
-                                  style={{
-                                    fontSize: "15px",
-                                    marginRight: "3px",
-                                  }}
-                                  aria-hidden="true"
-                                ></i>
-                                Certificate
-                              </div>
-                            )}
-                          </>
-                        )}
-                      </PDFDownloadLink>
+                        {" "}
+                        <i
+                          className="fa fa-print"
+                          aria-hidden="true"
+                          style={{ marginRight: "2px" }}
+                        ></i>
+                        Print
+                      </div>
                     </DropdownMenu.Item>
                   </DropdownMenu.Content>
                 </DropdownMenu.Portal>
@@ -216,7 +373,7 @@ function Header({
                           border: "none",
                           fontWeight: "650",
                           fontSize: "16px",
-                          marginRight: "10px",
+                          marginRight: "10px"
                         }}
                       >
                         Decline
@@ -224,18 +381,16 @@ function Header({
                     )}
                     {isPlaceholder ? (
                       <div
-                     
                         onClick={() => {
                           if (!isMailSend) {
                             alertSendEmail();
                           }
                         }}
-                      
                         style={{
                           color: isMailSend ? "gray" : themeColor(),
                           border: "none",
                           fontWeight: "650",
-                          fontSize: "16px",
+                          fontSize: "16px"
                         }}
                         data-tut={dataTut4}
                       >
@@ -243,17 +398,19 @@ function Header({
                       </div>
                     ) : (
                       <div
-                      data-tut="reactourThird"
+                        data-tut="reactourThird"
                         onClick={() => {
                           if (!pdfUrl) {
                             embedImages();
+                          } else if (isPdfRequestFiles) {
+                            embedImages();
                           }
                         }}
                         style={{
                           color: themeColor(),
                           border: "none",
                           fontWeight: "650",
-                          fontSize: "16px",
+                          fontSize: "16px"
                         }}
                       >
                         Finish
@@ -277,49 +434,14 @@ function Header({
             pdfUrl || isAlreadySign.mssg ? (
               <div style={{ display: "flex", flexDirection: "row" }}>
                 {pdfDetails[0] && pdfDetails.length > 0 && (
-                  //    <Certificate
-                  //    pdfData={completePdfData}
-                  // />
-                  <PDFDownloadLink
-                    document={<Certificate pdfData={pdfDetails} />}
-                    fileName={`completion certificate-${
-                      pdfDetails[0] && pdfDetails[0].Name
-                    }.pdf`}
-                  >
-                    {({ blob, url, loading, error }) =>
-                      loading ? (
-                        "Loading document..."
-                      ) : (
-                        <button
-                          type="button"
-                          className="defaultBtn certificateBtn"
-                          style={{
-                            display: "flex",
-                            flexDirection: "row",
-                            alignItems: "center",
-                          }}
-                        >
-                          <i
-                            className="fa fa-certificate"
-                            style={{
-                              color: "white",
-                              fontSize: "15px",
-                              marginRight: "3px",
-                            }}
-                            aria-hidden="true"
-                          ></i>
-                          Certificate
-                        </button>
-                      )
-                    }
-                  </PDFDownloadLink>
+                  <CertificateComponent />
                 )}
                 <button
                   onClick={handleToPrint}
                   style={{
                     display: "flex",
                     flexDirection: "row",
-                    alignItems: "center",
+                    alignItems: "center"
                   }}
                   className="defaultBtn printBtn"
                 >
@@ -328,7 +450,7 @@ function Header({
                     style={{
                       fontSize: "15px",
                       marginRight: "3px",
-                      color: "white",
+                      color: "white"
                     }}
                     aria-hidden="true"
                   ></i>
@@ -340,7 +462,7 @@ function Header({
                   style={{
                     display: "flex",
                     flexDirection: "row",
-                    alignItems: "center",
+                    alignItems: "center"
                   }}
                   className="defaultBtn downloadBtn"
                   onClick={() => handleDownloadPdf()}
@@ -350,7 +472,7 @@ function Header({
                     style={{
                       color: "white",
                       fontSize: "15px",
-                      marginRight: "3px",
+                      marginRight: "3px"
                     }}
                     aria-hidden="true"
                   ></i>
@@ -361,7 +483,7 @@ function Header({
               <div style={{ display: "flex", flexDirection: "row" }}>
                 <button
                   style={{
-                    background: "#de4337",
+                    background: "#de4337"
                   }}
                   className="finishBtn hoverCss"
                   onClick={() => {
@@ -374,7 +496,7 @@ function Header({
                 <button
                   data-tut="reactourThird"
                   style={{
-                    background: !pdfUrl ? "#188ae2" : "#d3edeb",
+                    background: !pdfUrl ? "#188ae2" : "#d3edeb"
                   }}
                   className="finishBtn sendHover"
                   onClick={() => {
@@ -387,85 +509,6 @@ function Header({
                 </button>
               </div>
             )
-          ) : pdfUrl || (documentStatus && documentStatus.isCompleted) ? (
-            <div style={{ display: "flex", flexDirection: "row" }}>
-              <PDFDownloadLink
-                document={<Certificate pdfData={pdfDetails} />}
-                fileName={`completion certificate-${
-                  pdfDetails[0] && pdfDetails[0].Name
-                }.pdf`}
-              >
-                {({ blob, url, loading, error }) =>
-                  loading ? (
-                    "Loading document..."
-                  ) : (
-                    <button
-                      type="button"
-                      style={{
-                        display: "flex",
-                        flexDirection: "row",
-                        alignItems: "center",
-                      }}
-                      className="defaultBtn certificateBtn"
-                    >
-                      <i
-                        className="fa fa-certificate"
-                        style={{
-                          color: "white",
-                          fontSize: "15px",
-                          marginRight: "3px",
-                        }}
-                        aria-hidden="true"
-                      ></i>
-                      Certificate
-                    </button>
-                  )
-                }
-              </PDFDownloadLink>
-              <button
-                onClick={handleToPrint}
-                type="button"
-                style={{
-                  display: "flex",
-                  flexDirection: "row",
-                  alignItems: "center",
-                }}
-                className="defaultBtn printBtn"
-              >
-                <i
-                  className="fa fa-print"
-                  style={{
-                    fontSize: "15px",
-                    marginRight: "3px",
-                    color: "white",
-                  }}
-                  aria-hidden="true"
-                ></i>
-                Print
-              </button>
-              <button
-                type="button"
-                className="defaultBtn downloadBtn"
-                style={{
-                  display: "flex",
-                  flexDirection: "row",
-                  alignItems: "center",
-                  marginLeft: "10px",
-                }}
-                onClick={() => handleDownloadPdf()}
-              >
-                <i
-                  className="fa fa-download"
-                  style={{
-                    color: "white",
-                    fontSize: "15px",
-                    marginRight: "3px",
-                  }}
-                  aria-hidden="true"
-                ></i>
-                Download
-              </button>
-            </div>
           ) : isPlaceholder ? (
             <>
               {!isMailSend &&
@@ -502,7 +545,7 @@ function Header({
                   data-tut="reactourFour"
                   style={{
                     background: isMailSend ? "rgb(203, 203, 203)" : "#188ae2",
-                    color: isMailSend && "rgb(77, 75, 75)",
+                    color: isMailSend && "rgb(77, 75, 75)"
                   }}
                   onClick={() => {
                     alertSendEmail();
@@ -514,43 +557,9 @@ function Header({
               </div>
             </>
           ) : isPdfRequestFiles ? (
-            isSigned ? (
+            alreadySign ? (
               <div style={{ display: "flex", flexDirection: "row" }}>
-                {isCompleted.isCertificate && (
-                  <PDFDownloadLink
-                    document={<Certificate pdfData={pdfDetails} />}
-                    fileName={`completion certificate-${
-                      pdfDetails[0] && pdfDetails[0].Name
-                    }.pdf`}
-                  >
-                    {({ blob, url, loading, error }) =>
-                      loading ? (
-                        "Loading document..."
-                      ) : (
-                        <button
-                          type="button"
-                          className="defaultBtn certificateBtn"
-                          style={{
-                            display: "flex",
-                            flexDirection: "row",
-                            alignItems: "center",
-                          }}
-                        >
-                          <i
-                            className="fa fa-certificate"
-                            style={{
-                              color: "white",
-                              fontSize: "15px",
-                              marginRight: "3px",
-                            }}
-                            aria-hidden="true"
-                          ></i>
-                          Certificate
-                        </button>
-                      )
-                    }
-                  </PDFDownloadLink>
-                )}
+                {isCompleted.isCertificate && <CertificateComponent />}
                 <button
                   onClick={handleToPrint}
                   type="button"
@@ -558,7 +567,7 @@ function Header({
                   style={{
                     display: "flex",
                     flexDirection: "row",
-                    alignItems: "center",
+                    alignItems: "center"
                   }}
                 >
                   <i
@@ -566,7 +575,7 @@ function Header({
                     style={{
                       fontSize: "15px",
                       marginRight: "3px",
-                      color: "white",
+                      color: "white"
                     }}
                     aria-hidden="true"
                   ></i>
@@ -579,7 +588,7 @@ function Header({
                   style={{
                     display: "flex",
                     flexDirection: "row",
-                    alignItems: "center",
+                    alignItems: "center"
                   }}
                   onClick={() => handleDownloadPdf()}
                 >
@@ -588,7 +597,7 @@ function Header({
                     style={{
                       color: "white",
                       fontSize: "15px",
-                      marginRight: "3px",
+                      marginRight: "3px"
                     }}
                     aria-hidden="true"
                   ></i>
@@ -610,7 +619,7 @@ function Header({
                   <>
                     <button
                       style={{
-                        background: "#de4337",
+                        background: "#de4337"
                       }}
                       className="finishBtn hoverCss"
                       onClick={() => {
@@ -621,7 +630,7 @@ function Header({
                     </button>
                     <button
                       style={{
-                        background: "#188ae2",
+                        background: "#188ae2"
                       }}
                       type="button"
                       className="finishBtn sendHover"
@@ -635,6 +644,53 @@ function Header({
                 )}
               </div>
             )
+          ) : pdfUrl || (documentStatus && documentStatus.isCompleted) ? (
+            <div style={{ display: "flex", flexDirection: "row" }}>
+              <CertificateComponent />
+              <button
+                onClick={handleToPrint}
+                type="button"
+                style={{
+                  display: "flex",
+                  flexDirection: "row",
+                  alignItems: "center"
+                }}
+                className="defaultBtn printBtn"
+              >
+                <i
+                  className="fa fa-print"
+                  style={{
+                    fontSize: "15px",
+                    marginRight: "3px",
+                    color: "white"
+                  }}
+                  aria-hidden="true"
+                ></i>
+                Print
+              </button>
+              <button
+                type="button"
+                className="defaultBtn downloadBtn"
+                style={{
+                  display: "flex",
+                  flexDirection: "row",
+                  alignItems: "center",
+                  marginLeft: "10px"
+                }}
+                onClick={() => handleDownloadPdf()}
+              >
+                <i
+                  className="fa fa-download"
+                  style={{
+                    color: "white",
+                    fontSize: "15px",
+                    marginRight: "3px"
+                  }}
+                  aria-hidden="true"
+                ></i>
+                Download
+              </button>
+            </div>
           ) : (
             <div>
               <button
@@ -649,7 +705,7 @@ function Header({
 
               <button
                 style={{
-                  background: "#188ae2",
+                  background: "#188ae2"
                 }}
                 type="button"
                 className="finishBtn sendHover"

microfrontends/SignDocuments/src/Component/component/renderPdf.js

@@ -5,8 +5,6 @@ import { Rnd } from "react-rnd";
 import { themeColor } from "../../utils/ThemeColor/backColor";
 import { Document, Page, pdfjs } from "react-pdf";
 
-// import Draggable from "react-draggable";
-
 pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;
 
 function RenderPdf({
@@ -41,19 +39,98 @@ function RenderPdf({
   placeholder,
   pdfLoadFail
 }) {
-  const isMobile = window.innerWidth < 712;
+  const isMobile = window.innerWidth < 767;
+  const newWidth = window.innerWidth;
+  const scale = isMobile ? pdfOriginalWidth / newWidth : 1;
+ //check isGuestSigner is present in local if yes than handle login flow header in mobile view
+ const isGuestSigner = localStorage.getItem("isGuestSigner");
+  // handle signature block width and height according to screen
+  const posWidth = (pos) => {
+    let width;
+    if (isMobile) {
+      if (!pos.isMobile) {
+        width = pos.Width / scale ? pos.Width / scale : 150 / scale;
+        return width;
+      } else {
+        width = pos.Width ? pos.Width : 150;
+        return width;
+      }
+    } else {
+      width = pos.Width ? pos.Width : 150;
+      return width;
+    }
+  };
+  const posHeight = (pos) => {
+    let width;
+    if (isMobile) {
+      if (!pos.isMobile) {
+        width = pos.Height / scale ? pos.Height / scale : 60 / scale;
+        return width;
+      } else {
+        width = pos.Height ? pos.Height : 60;
+        return width;
+      }
+    } else {
+      width = pos.Height ? pos.Height : 60;
+      return width;
+    }
+  };
+   
 
   //function for render placeholder block over pdf document
-
   const checkSignedSignes = (data) => {
-    // console.log("data",data)
     const checkSign = signedSigners.filter(
       (sign) => sign.objectId === data.signerObjId
     );
     if (data.signerObjId === signerObjectId) {
       setCurrentSigner(true);
     }
+    const xPos = (pos) => {
+      //checking both condition mobile and desktop view
+      if (isMobile) {
+        //if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divided by scale
+        if (!pos.isMobile) {
+          return pos.xPosition / scale - 20;
+        }
+        //pos.isMobile true -- placeholder save from mobile view(small device)  handle position in mobile view(small screen) view divided by scale
+        else {
+          return pos.xPosition * (pos.scale / scale);
+        }
+      } else {
+        //else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
 
+        if (pos.isMobile) {
+          return pos.scale && pos.xPosition * pos.scale + 50;
+        }
+        //else placeholder save from desktop(bigscreen) and show in desktop(bigscreen)
+        else {
+          return pos.xPosition;
+        }
+      }
+    };
+    const yPos = (pos) => {
+      //checking both condition mobile and desktop view
+      if (isMobile) {
+        //if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divided by scale
+        if (!pos.isMobile) {
+          return pos.yPosition / scale;
+        }
+        //pos.isMobile true -- placeholder save from mobile view(small device)  handle position in mobile view(small screen) view divided by scale
+        else {
+          return pos.yPosition * (pos.scale / scale);
+        }
+      } else {
+        //else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
+
+        if (pos.isMobile) {
+          return pos.scale && pos.yPosition * pos.scale + 50;
+        }
+        //else placeholder save from desktop(bigscreen) and show in desktop(bigscreen)
+        else {
+          return pos.yPosition;
+        }
+      }
+    };
     return (
       checkSign.length === 0 &&
       data.placeHolder.map((placeData, key) => {
@@ -91,15 +168,13 @@ function RenderPdf({
                         borderWidth: "0.2px"
                       }}
                       size={{
-                        width: pos.Width ? pos.Width : 150,
-                        height: pos.Height ? pos.Height : 60
+                        width: posWidth(pos),
+                        height: posHeight(pos)
                       }}
                       lockAspectRatio={pos.Width && 2.5}
                       default={{
-                        x: pos.scale
-                          ? pos.xPosition * pos.scale
-                          : pos.xPosition,
-                        y: pos.scale ? pos.yPosition * pos.scale : pos.yPosition
+                        x: xPos(pos),
+                        y: yPos(pos)
                       }}
                       onClick={() => {
                         setIsSignPad(true);
@@ -160,12 +235,12 @@ function RenderPdf({
                       borderWidth: "0.2px"
                     }}
                     default={{
-                      x: pos.scale ? pos.xPosition * pos.scale : pos.xPosition,
-                      y: pos.scale ? pos.yPosition * pos.scale : pos.yPosition
+                      x: xPos(pos),
+                      y: yPos(pos)
                     }}
                     size={{
-                      width: pos.Width ? pos.Width : 150,
-                      height: pos.Height ? pos.Height : 60
+                      width: posWidth(pos),
+                      height: posHeight(pos)
                     }}
                     lockAspectRatio={pos.Width ? pos.Width / pos.Height : 2.5}
                   >
@@ -174,7 +249,7 @@ function RenderPdf({
                         fontSize: "12px",
                         color: "black",
                         fontWeight: "600",
-                        // justifyContent: "center",
+
                         marginTop: "0px"
                       }}
                     >
@@ -191,26 +266,11 @@ function RenderPdf({
 
   return (
     <>
-      {isMobile ? (
-        // <RSC
-        //   style={{
-        //     position: "relative",
-        //     boxShadow: "rgba(17, 12, 46, 0.15) 0px 48px 100px 0px",
-        //     width:
-        //       pdfOriginalWidth > pdfNewWidth ? pdfNewWidth : pdfOriginalWidth,
-        //     height: window.innerHeight - 110 + "px",
-        //     marginTop: "50px",
-        //   }}
-        //   noScrollY={false}
-        //   noScrollX={pdfNewWidth < pdfOriginalWidth ? false : true}
-        // >
+      {isMobile && scale ? (
         <div
           style={{
-            border: "0.1px solid #ebe8e8"
-            // marginTop: "50px",
-
-            //  height:window.innerHeight-100+'px',
-            // width:window.innerWidth
+            border: "0.1px solid #ebe8e8",
+            marginTop: isGuestSigner && "30px"
           }}
           ref={drop}
           id="container"
@@ -269,13 +329,20 @@ function RenderPdf({
                                 borderWidth: "0.2px"
                               }}
                               size={{
-                                width: pos.Width ? pos.Width : 150,
-                                height: pos.Height ? pos.Height : 60
+                                width: posWidth(pos),
+                                height: posHeight(pos)
                               }}
                               lockAspectRatio={pos.Width && 2.5}
+                              //if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divide by scale
+                              //else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
                               default={{
-                                x: pos.xPosition,
-                                y: pos.yPosition
+                                x: !pos.isMobile
+                                  ? pos.xPosition / scale
+                                  : pos.xPosition * (pos.scale / scale) - 50,
+
+                                y: !pos.isMobile
+                                  ? pos.yPosition / scale
+                                  : pos.yPosition * (pos.scale / scale)
                               }}
                               onClick={() => {
                                 setIsSignPad(true);
@@ -328,13 +395,20 @@ function RenderPdf({
                                 borderWidth: "0.2px"
                               }}
                               size={{
-                                width: pos.Width ? pos.Width : 150,
-                                height: pos.Height ? pos.Height : 60
+                                width: posWidth(pos),
+                                height: posHeight(pos)
                               }}
                               disableDragging={true}
                               default={{
-                                x: pos.xPosition,
-                                y: pos.yPosition
+                                //if pos.isMobile false -- placeholder saved from desktop view then handle position in mobile view divide by scale
+                                //else if pos.isMobile true -- placeholder saved from mobile or tablet view then handle position in desktop view divide by scale
+                                x: !pos.isMobile
+                                  ? pos.xPosition / scale
+                                  : pos.xPosition * (pos.scale / scale) - 50,
+
+                                y: !pos.isMobile
+                                  ? pos.yPosition / scale
+                                  : pos.yPosition * (pos.scale / scale)
                               }}
                               onClick={() => {
                                 setIsSignPad(true);
@@ -409,7 +483,14 @@ function RenderPdf({
                                       right: { display: "none" },
                                       bottomRight: { display: "block" }
                                     }}
-                                    onDragStop={handleStop}
+                                    onDragStop={(event, dragElement) =>
+                                      handleStop(
+                                        event,
+                                        dragElement,
+                                        data.signerObjId,
+                                        pos.key
+                                      )
+                                    }
                                     default={{
                                       x: pos.xPosition,
                                       y: pos.yPosition
@@ -437,13 +518,6 @@ function RenderPdf({
                                           data.signerObjId
                                         );
                                       }}
-                                      // onClick={(e) => {
-                                      //   e.stopPropagation();
-                                      //   handleDeleteSign(
-                                      //     pos.key,
-                                      //     data.signerObjId
-                                      //   );
-                                      // }}
                                       style={{
                                         position: "absolute",
                                         right: 0,
@@ -461,7 +535,7 @@ function RenderPdf({
                                         fontSize: "12px",
                                         color: "black",
                                         fontWeight: "600",
-                                        // justifyContent: "center",
+
                                         marginTop: "0px"
                                       }}
                                     >
@@ -532,8 +606,7 @@ function RenderPdf({
                             >
                               {" "}
                               <div
-                                // className="dragElm"
-                                onTouchStart={(e) => {
+                                onTouchEnd ={(e) => {
                                   if (!isDragging) {
                                     setTimeout(() => {
                                       e.stopPropagation();
@@ -545,18 +618,12 @@ function RenderPdf({
                                 }}
                               >
                                 <div
-                                  // className="dragElm"
                                   ref={nodeRef}
                                   onTouchStart={(e) => {
                                     e.stopPropagation();
                                     handleDeleteSign(pos.key);
                                     setIsStamp(false);
                                   }}
-                                  // onClick={(e) => {
-                                  //   e.stopPropagation();
-                                  //   handleDeleteSign(pos.key);
-                                  //   setIsStamp(false);
-                                  // }}
                                   style={{
                                     position: "absolute",
                                     right: 0,
@@ -573,6 +640,7 @@ function RenderPdf({
                                     alt="signimg"
                                     onClick={(e) => {
                                       setSignKey(pos.key);
+                                      console.log("Drag 2");
                                       setIsSignPad(true);
                                       setIsStamp(pos.isStamp);
                                     }}
@@ -590,10 +658,8 @@ function RenderPdf({
                             <>
                               <Rnd
                                 allowAnyClick
-                                // cancel=".dragElm"
                                 ref={nodeRef}
                                 key={pos.key}
-                                // lockAspectRatio={2.5}
                                 lockAspectRatio={
                                   pos.Width ? pos.Width / pos.Height : 2.5
                                 }
@@ -616,53 +682,21 @@ function RenderPdf({
                                 onDrag={(e) => {
                                   handleTabDrag(pos.key, e);
                                 }}
-                                // onMouseUp={(e) => handleTabDrag(pos.key, e)}
                                 onDragStop={handleStop}
                                 size={{
                                   width: pos.Width ? pos.Width : 150,
                                   height: pos.Height ? pos.Height : 60
                                 }}
-                                // onMouseDown={(e) => {
-
-                                //   if (!isDragging) {
-                                //     console.log("child m=event",isDragging);
-                                //     setTimeout(() => {
-                                //       if(isDeleted){
-                                //         setIsSignPad(true);
-                                //         // setIsSignPad(false)
-                                //         setSignKey(pos.key);
-                                //         setIsStamp(pos.isStamp);
-
-                                //       }else{
-                                //          setIsSignPad(true);
-                                //         // setIsSignPad(false)
-                                //         setSignKey(pos.key);
-                                //         setIsStamp(pos.isStamp);
-                                //       }
-
-                                //     }, 500);
-                                //   }
-                                // }}
                                 default={{
                                   x: pos.xPosition,
                                   y: pos.yPosition
                                 }}
-
-                                // onClick={(e) => {
-                                //   if (!isDragging) {
-                                //     e.stopPropagation();
-                                //     setIsSignPad(true);
-                                //     setSignKey(pos.key);
-                                //     setIsStamp(pos.isStamp);
-                                //   }
-                                // }}
                               >
                                 <div
-                                  onTouchStart={(e) => {
+                                  onTouchEnd ={(e) => {
                                     if (!isDragging) {
                                       setTimeout(() => {
                                         setIsSignPad(true);
-                                        //setIsSignPad(false)
                                         setSignKey(pos.key);
                                         setIsStamp(pos.isStamp);
                                       }, 500);
@@ -686,21 +720,9 @@ function RenderPdf({
                                   }}
                                 >
                                   <div
-                                    //  onMouseDown={(e) => {
-                                    //    console.log("child m=event")
-                                    //    e.preventDefault();
-                                    //    setIsDragging(true)
-
-                                    //    handleDeleteSign(pos.key);
-                                    //    setIsStamp(false);
-                                    //    setTimeout(()=>{
-                                    //      setIsDragging(false)
-                                    //    },2000)
-                                    //  }}
                                     onTouchStart={(e) => {
                                       e.stopPropagation();
                                       e.preventDefault();
-                                      // setIsDragging(true);
 
                                       handleDeleteSign(pos.key);
                                       setIsStamp(false);
@@ -755,8 +777,13 @@ function RenderPdf({
               }}
               onLoadSuccess={pageDetails}
               ref={pdfRef}
-              file={pdfUrl ? pdfUrl : pdfDetails[0] && pdfDetails[0].URL}
-              //   file="https://qikinnovation.ams3.digitaloceanspaces.com/exported_file_2068_2023-08-30T05%3A04%3A26.334Z.pdf" //  "https://api.printnode.com/static/test/pdf/multipage.pdf" //  {pdfUrl ? pdfUrl : signPdfUrl}
+              file={
+                pdfUrl
+                  ? pdfUrl
+                  : pdfDetails[0] && pdfDetails[0].SignedUrl
+                  ? pdfDetails[0].SignedUrl
+                  : pdfDetails[0].URL
+              }
             >
               {Array.from(new Array(numPages), (el, index) => (
                 <Page
@@ -764,7 +791,6 @@ function RenderPdf({
                   pageNumber={pageNumber}
                   width={window.innerWidth}
                   height={window.innerHeight}
-                  // scale={1}
                   renderAnnotationLayer={false}
                   renderTextLayer={false}
                   onGetAnnotationsError={(error) => {
@@ -776,7 +802,6 @@ function RenderPdf({
           </div>
         </div>
       ) : (
-        // </RSC>
         <RSC
           style={{
             position: "relative",
@@ -854,12 +879,15 @@ function RenderPdf({
                                   height: pos.Height ? pos.Height : 60
                                 }}
                                 lockAspectRatio={pos.Width && 2.5}
+                                //if pos.isMobile false -- placeholder saved from mobile view then handle position in desktop view to multiply by scale
+
                                 default={{
-                                  x: pos.scale
-                                    ? pos.xPosition * pos.scale
+                                  x: pos.isMobile
+                                    ? pos.scale &&
+                                      pos.xPosition * pos.scale + 20
                                     : pos.xPosition,
-                                  y: pos.scale
-                                    ? pos.yPosition * pos.scale
+                                  y: pos.isMobile
+                                    ? pos.scale && pos.yPosition * pos.scale
                                     : pos.yPosition
                                 }}
                                 onClick={() => {
@@ -917,12 +945,15 @@ function RenderPdf({
                                   height: pos.Height ? pos.Height : 60
                                 }}
                                 disableDragging={true}
+                                //if pos.isMobile false -- placeholder saved from mobile view then handle position in desktop view to multiply by scale
+
                                 default={{
-                                  x: pos.scale
-                                    ? pos.xPosition * pos.scale
+                                  x: pos.isMobile
+                                    ? pos.scale &&
+                                      pos.xPosition * pos.scale + 20
                                     : pos.xPosition,
-                                  y: pos.scale
-                                    ? pos.yPosition * pos.scale
+                                  y: pos.isMobile
+                                    ? pos.scale && pos.yPosition * pos.scale
                                     : pos.yPosition
                                 }}
                                 onClick={() => {
@@ -998,7 +1029,14 @@ function RenderPdf({
                                         right: { display: "none" },
                                         bottomRight: { display: "block" }
                                       }}
-                                      onDragStop={handleStop}
+                                      onDragStop={(event, dragElement) =>
+                                        handleStop(
+                                          event,
+                                          dragElement,
+                                          data.signerObjId,
+                                          pos.key
+                                        )
+                                      }
                                       default={{
                                         x: pos.xPosition,
                                         y: pos.yPosition
@@ -1043,7 +1081,7 @@ function RenderPdf({
                                           fontSize: "12px",
                                           color: "black",
                                           fontWeight: "600",
-                                          // justifyContent: "center",
+
                                           marginTop: "0px"
                                         }}
                                       >
@@ -1067,7 +1105,6 @@ function RenderPdf({
                               <Rnd
                                 ref={nodeRef}
                                 key={pos.key}
-                                // lockAspectRatio={2.5}
                                 lockAspectRatio={
                                   pos.Width ? pos.Width / pos.Height : 2.5
                                 }
@@ -1158,7 +1195,6 @@ function RenderPdf({
                               <Rnd
                                 ref={nodeRef}
                                 key={pos.key}
-                                // lockAspectRatio={2.5}
                                 lockAspectRatio={
                                   pos.Width ? pos.Width / pos.Height : 2.5
                                 }
@@ -1263,14 +1299,18 @@ function RenderPdf({
               }}
               onLoadSuccess={pageDetails}
               ref={pdfRef}
-              file={pdfUrl ? pdfUrl : pdfDetails[0] && pdfDetails[0].URL}
-              //   file="https://qikinnovation.ams3.digitaloceanspaces.com/exported_file_2068_2023-08-30T05%3A04%3A26.334Z.pdf" //  "https://api.printnode.com/static/test/pdf/multipage.pdf" //  {pdfUrl ? pdfUrl : signPdfUrl}
+              file={
+                pdfUrl
+                  ? pdfUrl
+                  : pdfDetails[0] && pdfDetails[0].SignedUrl
+                  ? pdfDetails[0].SignedUrl
+                  : pdfDetails[0].URL
+              }
             >
               {Array.from(new Array(numPages), (el, index) => (
                 <Page
                   key={index}
                   pageNumber={pageNumber}
-                  // width={pdfNewWidth}
                   renderAnnotationLayer={false}
                   renderTextLayer={false}
                   onGetAnnotationsError={(error) => {
@@ -1286,4 +1326,4 @@ function RenderPdf({
   );
 }
 
-export default RenderPdf;
+export default RenderPdf;

microfrontends/SignDocuments/src/Component/login.js

@@ -6,77 +6,60 @@ import { useParams } from "react-router-dom";
 import { themeColor } from "../utils/ThemeColor/backColor";
 import { useEffect } from "react";
 import { useNavigate } from "react-router-dom";
-// import { useHistory } from "react-router-dom/cjs/react-router-dom.min";
-function Login() {
-  const { id, userMail,contactBookId, serverUrl } = useParams();
-  let navigate = useNavigate();
-  //   const history = useHistory();
 
+function Login() {
+  const { id, userMail, contactBookId, serverUrl } = useParams();
+  let navigate = useNavigate();
   const [email, setEmail] = useState(userMail);
   const [OTP, setOTP] = useState("");
   const [EnterOTP, setEnterOtp] = useState(false);
   const [loading, setLoading] = useState(false);
-  
   const [isLoading, setIsLoading] = useState(true);
 
   useEffect(() => {
     handleServerUrl();
   }, []);
-  //https://qik-ai-org.github.io/Sign-MicroappV2/#/login/LqgGeZHd17/raktima.c@qik.ai/https:%2F%2Fserver3.qik.ai%2Fdefaultssty%2F&defaultssty&contracts
-  // login/LqgGeZHd17/raktima.c@qik.ai/https:%2F%2Fserver3.qik.ai%2Fdefaultssty&defaultssty&contracts
+
   //function generate serverUrl and parseAppId from url and save it in local storage
   const handleServerUrl = () => {
-    // console.log("params", serverUrl);
     //split url in array from '&'
     localStorage.clear();
     const checkSplit = serverUrl.split("&");
     const server = checkSplit[0];
     const parseId = checkSplit[1];
     const appName = checkSplit[2];
-    // console.log("appName", appName);
 
     const newServer = server.replaceAll("%2F", "/");
     localStorage.setItem("baseUrl", newServer);
     localStorage.setItem("parseAppId", parseId);
     localStorage.setItem("_appName", appName);
     setIsLoading(false);
-    // console.log("checkSPlit", newServer, parseId, appName);
   };
 
   const handleChange = (event) => {
     const { value } = event.target;
-
     setOTP(value);
   };
 
   //send email OTP function
-
   const SendOtp = async (e) => {
     const serverUrl =
       localStorage.getItem("baseUrl") && localStorage.getItem("baseUrl");
-
     const parseId =
       localStorage.getItem("parseAppId") && localStorage.getItem("parseAppId");
-    // console.log("server",serverUrl)
     if (serverUrl && localStorage) {
       setLoading(true);
       e.preventDefault();
       setEmail(email);
 
       try {
-        //   const { baseUrl, parseAppId, mobile } = this.state;
         let url = `${serverUrl}functions/SendOTPMailV1/`;
         const headers = {
           "Content-Type": "application/json",
-          "X-Parse-Application-Id": parseId,
+          "X-Parse-Application-Id": parseId
         };
         let body = {
-          email: email.toString(),
-          // appId: {
-          //   __type: "Pointer",
-          //   className: "w_appinfo",
-          //   objectId: localStorage.getItem("_app_objectId"),
-          // },
+          email: email.toString()
         };
         let Otp = await axios.post(url, body, { headers: headers });
 
@@ -85,7 +68,7 @@ function Login() {
           setEnterOtp(true);
         }
       } catch (error) {
-        //   this.setState({ loading: false });
+        alert("something went wrong!");
       }
     } else {
       alert("something went wrong!");
@@ -97,47 +80,38 @@ function Login() {
     e.preventDefault();
     const serverUrl =
       localStorage.getItem("baseUrl") && localStorage.getItem("baseUrl");
-
     const parseId =
       localStorage.getItem("parseAppId") && localStorage.getItem("parseAppId");
-
     if (OTP) {
       setLoading(true);
-
       try {
-        //	AuthLoginAs
         let url = `${serverUrl}functions/AuthLoginAsMail/`;
         const headers = {
           "Content-Type": "application/json",
-          "X-Parse-Application-Id": parseId,
+          "X-Parse-Application-Id": parseId
         };
         let body = {
           email: email,
-          // email,
-          otp: OTP,
+          otp: OTP
         };
         let user = await axios.post(url, body, { headers: headers });
-        // console.log("user", user.data.result);
         if (user.data.result === "Invalid Otp") {
           alert("Invalid Otp");
           setLoading(false);
-        }else if(user.data.result === "user not found!"){
+        } else if (user.data.result === "user not found!") {
           alert("User not found!");
           setLoading(false);
-        }
-         else {
+        } else {
           let _user = user.data.result;
-
           localStorage.setItem("UserInformation", JSON.stringify(_user));
-          // localStorage.setItem("userEmail", email);
           localStorage.setItem("username", _user.name);
-          // console.log("session token", _user.sessionToken);
           localStorage.setItem("accesstoken", _user.sessionToken);
-
+          //save isGuestSigner true in local to handle login flow header in mobile view
+          localStorage.setItem("isGuestSigner", true);
           setLoading(false);
-          //navigate user to on signature page
-          //  history.push(`/recipientSignPdf/${id}/${_user.phone}`);
-          navigate(`/recipientSignPdf/${id}/${contactBookId}`);
+          navigate(
+            `/loadmf/signmicroapp/recipientSignPdf/${id}/${contactBookId}`
+          );
         }
       } catch (error) {}
     } else {
@@ -146,7 +120,7 @@ function Login() {
   };
 
   return (
-    <React.Fragment>
+    <div style={{ padding: "2rem" }}>
       {isLoading ? (
         <div
           style={{
@@ -154,7 +128,7 @@ function Login() {
             justifyContent: "center",
             alignItems: "center",
             height: "100vh",
-            flexDirection: "column",
+            flexDirection: "column"
           }}
         >
           <img
@@ -172,137 +146,131 @@ function Login() {
             margin: "10px",
             border: "0.5px solid #c5c7c9",
             padding: "30px",
-            boxShadow: "rgba(99, 99, 99, 0.2) 0px 2px 8px 0px",
-            // box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
+            boxShadow: "rgba(99, 99, 99, 0.2) 0px 2px 8px 0px"
           }}
         >
           <div className="main_head">
             <div className="main-logo">
-              <img alt="sign img" src="https://qikinnovation.ams3.digitaloceanspaces.com/logo.png" width="100%" />
+              <img
+                alt="sign img"
+                src="https://qikinnovation.ams3.digitaloceanspaces.com/logo.png"
+                width="100%"
+              />
             </div>
           </div>
 
           {!EnterOTP ? (
-            <form>
-              <div className="row">
-                <div className="col-sm-6 KLO">
-                  <h2>Welcome Back !</h2>
-                  <span className="KNLO">
-                    Verification code is sent to your email
-                  </span>
-                  <div className="card card-box">
-                    <div className="card-body">
-                      <input
-                        type="email"
-                        className="form-control"
-                        name="mobile"
-                        value={email}
-                        disabled
-                        height={30}
-                        style={{ fontSize: "20px", fontWeight: "600" }}
-                      />
-                      <br />
-                    </div>
-                  </div>
-                  <div
-                    className="col-md-4 col-sm-4"
-                    style={{
-                      textAlign: "center",
-                      display: "flex",
-                      alignItems: "center",
-                      justifyContent: "center",
-                    }}
-                  >
-                    {loading ? (
-                      <button
-                        className="btn btn-info loadinBtn "
-                        type="button"
-                        style={{ marginBottom: "4px", width: "210px" }}
-                        disabled
-                      >
-                        <span
-                          className="spinner-border spinner-border-sm "
-                          role="status"
-                          aria-hidden="true"
-                        ></span>
-                        Loading...
-                      </button>
-                    ) : (
-                      <button
-                        className="btn btn-sm otpButton"
-                        onClick={(e) => SendOtp(e)}
-                        style={{
-                          marginBottom: "4px",
-                          width: "210px",
-                          background: themeColor(),
-                          color: "white",
-                          fontWeight: "600",
-                        }}
-                      >
-                        Send OTP
-                      </button>
-                    )}
+            <div className="row">
+              <div className="col-sm-6 KLO">
+                <span className="welcomeText">Welcome Back !</span>
+                <br />
+                <span className="KNLO">
+                  Verification code is sent to your email
+                </span>
+                <div className="card card-box" style={{ borderRadius: "0px" }}>
+                  <div className="card-body">
+                    <input
+                      type="email"
+                      name="mobile"
+                      value={email}
+                      disabled
+                      className="loginInput"
+                    />
+                    <br />
                   </div>
                 </div>
+                <div className="btnContainer">
+                  {loading ? (
+                    <button
+                      type="button"
+                      style={{
+                        background: themeColor(),
+                        color: "white"
+                      }}
+                      className="verifyBtn"
+                      disabled
+                    >
+                      <span
+                        className="spinner-border spinner-border-sm "
+                        role="status"
+                        aria-hidden="true"
+                      ></span>
+                      Loading...
+                    </button>
+                  ) : (
+                    <button
+                      className="verifyBtn"
+                      style={{
+                        background: themeColor(),
+                        color: "white",
+                        marginLeft: "0px !important"
+                      }}
+                      onClick={(e) => SendOtp(e)}
+                    >
+                      Send OTP
+                    </button>
+                  )}
+                </div>
               </div>
-            </form>
+            </div>
           ) : (
-            <form>
-              <div className="row">
-                <div className="col-sm-6 KLO">
-                  <h2>Welcome Back !</h2>
-                  <span className="KNLO">You will get a OTP via Email</span>
-                  <div className="card card-box">
-                    <div className="card-body">
-                      <label>Enter Verification Code</label>
-                      <input
-                        type="number"
-                        className="form-control"
-                        name="OTP"
-                        value={OTP}
-                        min="4"
-                        max="4"
-                        onChange={handleChange}
-                      />
+            <div className="row">
+              <div className="col-sm-6 KLO">
+                <span className="welcomeText">Welcome Back !</span>
+                <br />
+                <span className="KNLO">You will get a OTP via Email</span>
+                <div className="card card-box">
+                  <div className="card-body">
+                    <label>Enter Verification Code</label>
+                    <input
+                      type="number"
+                      className="loginInput"
+                      name="OTP"
+                      value={OTP}
+                      onChange={handleChange}
+                    />
 
-                      <br />
-                    </div>
-                  </div>
-                  <div
-                    className="col-md-4 col-sm-4"
-                    style={{ textAlign: "center" }}
-                  >
-                    {loading ? (
-                      <button
-                        className="btn btn-info "
-                        type="button"
-                        style={{ marginBottom: "4px", width: "210px" }}
-                        disabled
-                      >
-                        <span
-                          className="spinner-border spinner-border-sm "
-                          role="status"
-                          aria-hidden="true"
-                        ></span>
-                        Loading...
-                      </button>
-                    ) : (
-                      <button
-                        type="button"
-                        onClick={(e) => VerifyOTP(e)}
-                        className="btn btn-info login-btn"
-                      >
-                        Verify
-                      </button>
-                    )}
+                    <br />
                   </div>
                 </div>
+                <div>
+                  {loading ? (
+                    <button
+                      style={{
+                        background: themeColor(),
+                        color: "white"
+                      }}
+                      className="verifyBtn"
+                      type="button"
+                      disabled
+                    >
+                      <span
+                        className="spinner-border spinner-border-sm "
+                        role="status"
+                        aria-hidden="true"
+                      ></span>
+                      Loading...
+                    </button>
+                  ) : (
+                    <button
+                      type="button"
+                      onClick={(e) => VerifyOTP(e)}
+                      style={{
+                        background: themeColor(),
+                        color: "white"
+                      }}
+                      className="verifyBtn"
+                    >
+                      Verify
+                    </button>
+                  )}
+                </div>
               </div>
-            </form>
+            </div>
           )}
         </div>
       )}
-    </React.Fragment>
+    </div>
   );
 }
 

microfrontends/SignDocuments/src/Component/placeHolderSign.js

@@ -17,11 +17,18 @@ import HandleError from "./component/HandleError";
 import Nodata from "./component/Nodata";
 import SignerListPlace from "./component/signerListPlace";
 import Header from "./component/header";
-import { contactBook, contractUsers } from "../utils/Utils";
+import {
+  contactBook,
+  contractDocument,
+  contractUsers,
+  getHostUrl
+} from "../utils/Utils";
 import RenderPdf from "./component/renderPdf";
 import ModalComponent from "./component/modalComponent";
+import { useNavigate } from "react-router-dom";
 
 function PlaceHolderSign() {
+  const navigate = useNavigate();
   const [pdfDetails, setPdfDetails] = useState([]);
   const [isMailSend, setIsMailSend] = useState(false);
   const [allPages, setAllPages] = useState(null);
@@ -74,7 +81,9 @@ function PlaceHolderSign() {
     "#66ccff",
     "#ffffcc"
   ];
-
+  const isMobile = window.innerWidth < 767;
+  const newWidth = window.innerWidth;
+  const scale = pdfOriginalWidth / newWidth;
   const [{ isOver }, drop] = useDrop({
     accept: "BOX",
     drop: (item, monitor) => addPositionOfSignature(item, monitor),
@@ -119,7 +128,7 @@ function PlaceHolderSign() {
       isDragSignatureSS: !!monitor.isDragging()
     })
   });
-  const isMobile = window.innerWidth < 712;
+
   const [{ isDragStampSS }, dragStampSS] = useDrag({
     type: "BOX",
 
@@ -165,56 +174,40 @@ function PlaceHolderSign() {
 
   //function for get document details
   const getDocumentDetails = async () => {
-    await axios
-      .get(
-        `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
-          "_appName"
-        )}_Document?where={"objectId":"${documentId}"}&include=ExtUserPtr,Signers`,
-        {
-          headers: {
-            "Content-Type": "application/json",
-            "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-            "X-Parse-Session-Token": localStorage.getItem("accesstoken")
-          }
-        }
-      )
-      .then((Listdata) => {
-        const json = Listdata.data;
-        const res = json.results;
+    //getting document details
+    const documentData = await contractDocument(documentId);
+    if (documentData && documentData.length > 0) {
+      setPdfDetails(documentData);
 
-        if (res[0] && res.length > 0) {
-          setPdfDetails(res);
+      const currEmail = documentData[0].ExtUserPtr.Email;
+      const filterCurrEmail = documentData[0].Signers.filter(
+        (data) => data.Email === currEmail
+      );
 
-          const currEmail = res[0].ExtUserPtr.Email;
-          const filterCurrEmail = res[0].Signers.filter(
-            (data) => data.Email === currEmail
-          );
+      setCurrentEmail(filterCurrEmail);
+      setSignersData(documentData[0]);
 
-          setCurrentEmail(filterCurrEmail);
-          setSignersData(res[0]);
-
-          setSignerObjId(res[0].Signers[0].objectId);
-          setContractName(res[0].Signers[0].className);
-          setIsSelectId(0);
-        } else {
-          setNoData(true);
-          const loadObj = {
-            isLoad: false
-          };
-          setIsLoading(loadObj);
-        }
-      })
-      .catch((err) => {
-        console.log("axois err ", err);
-        const loadObj = {
-          isLoad: false
-        };
-        setHandleError("Error: Something went wrong!");
-        setIsLoading(loadObj);
-      });
-
-    const res = await contractUsers(jsonSender.objectId);
+      setSignerObjId(documentData[0].Signers[0].objectId);
+      setContractName(documentData[0].Signers[0].className);
+      setIsSelectId(0);
+    } else if (
+      documentData === "Error: Something went wrong!" ||
+      (documentData.result && documentData.result.error)
+    ) {
+      const loadObj = {
+        isLoad: false
+      };
+      setHandleError("Error: Something went wrong!");
+      setIsLoading(loadObj);
+    } else {
+      setNoData(true);
 
+      const loadObj = {
+        isLoad: false
+      };
+      setIsLoading(loadObj);
+    }
+    const res = await contractUsers(jsonSender.email);
     if (res[0] && res.length) {
       setSignerUserId(res[0].objectId);
       const tourstatus = res[0].TourStatus && res[0].TourStatus;
@@ -238,75 +231,17 @@ function PlaceHolderSign() {
       setHandleError("Error: Something went wrong!");
       setIsLoading(loadObj);
     } else if (res.length === 0) {
-      const res = await contactBook(jsonSender.objectId);
-      if (res[0] && res.length) {
-        setSignerUserId(res[0].objectId);
-        const tourstatus = res[0].TourStatus && res[0].TourStatus;
-        if (tourstatus && tourstatus.length > 0) {
-          setTourStatus(tourstatus);
-          const checkTourRecipients = tourstatus.filter(
-            (data) => data.placeholder
-          );
-          if (checkTourRecipients && checkTourRecipients.length > 0) {
-            setCheckTourStatus(checkTourRecipients[0].placeholder);
-          }
-        }
-        const loadObj = {
-          isLoad: false
-        };
-        setIsLoading(loadObj);
-      }
-    }
-    // await axios
-    //   .get(
-    //     `${localStorage.getItem("baseUrl")}classes/${localStorage.getItem(
-    //       "_appName"
-    //     )}_Contactbook?where={"UserId": {"__type": "Pointer","className": "_User", "objectId":"${
-    //       jsonSender.objectId
-    //     }"}}`,
-    //     {
-    //       headers: {
-    //         "Content-Type": "application/json",
-    //         "X-Parse-Application-Id": localStorage.getItem("parseAppId"),
-    //         "X-Parse-Session-Token": localStorage.getItem("accesstoken"),
-    //       },
-    //     }
-    //   )
-    //   .then((Listdata) => {
-    //     const json = Listdata.data;
-    //     const res = json.results;
+      setNoData(true);
 
-    //     if (res[0] && res.length) {
-    //       setSignerUserId(res[0].objectId);
-    //       const tourstatus = res[0].TourStatus && res[0].TourStatus;
-    //       if (tourstatus && tourstatus.length > 0) {
-    //         setTourStatus(tourstatus);
-    //         const checkTourRecipients = tourstatus.filter(
-    //           (data) => data.placeholder
-    //         );
-    //         if (checkTourRecipients && checkTourRecipients.length > 0) {
-    //           setCheckTourStatus(checkTourRecipients[0].placeholder);
-    //         }
-    //       }
-    //       const loadObj = {
-    //         isLoad: false,
-    //       };
-    //       setIsLoading(loadObj);
-    //     }
-    //   })
-    //   .catch((err) => {
-    //     const loadObj = {
-    //       isLoad: false,
-    //     };
-    //     setHandleError("Error: Something went wrong!");
-    //     setIsLoading(loadObj);
-    //   });
+      const loadObj = {
+        isLoad: false
+      };
+      setIsLoading(loadObj);
+    }
   };
 
   //function for setting position after drop signature button over pdf
   const addPositionOfSignature = (item, monitor) => {
-    const isMobile = window.innerWidth < 712;
-
     if (isMobile) {
       if (selectedEmail) {
         getSignerPos(item, monitor);
@@ -319,9 +254,6 @@ function PlaceHolderSign() {
   };
 
   const getSignerPos = (item, monitor) => {
-    const isMobile = window.innerWidth < 712;
-    const newWidth = window.innerWidth;
-    const scale = pdfOriginalWidth / newWidth;
     const key = Math.floor(1000 + Math.random() * 9000);
     let filterSignerPos = signerPos.filter(
       (data) => data.signerObjId === signerObjId
@@ -336,7 +268,8 @@ function PlaceHolderSign() {
         isStamp: monitor,
         key: key,
         isDrag: false,
-        scale: isMobile && scale,
+        scale: scale,
+        isMobile: isMobile,
         yBottom: window.innerHeight / 2 - 60
       };
       dropData.push(dropObj);
@@ -365,7 +298,8 @@ function PlaceHolderSign() {
         firstXPos: signBtnPosition[0] && signBtnPosition[0].xPos,
         firstYPos: signBtnPosition[0] && signBtnPosition[0].yPos,
         yBottom: ybottom,
-        scale: isMobile && scale
+        scale: scale,
+        isMobile: isMobile
       };
 
       dropData.push(dropObj);
@@ -394,16 +328,12 @@ function PlaceHolderSign() {
       //add entry of position for same signer on multiple page
       if (getPageNumer.length > 0) {
         const getPos = getPageNumer[0].pos;
-
-        //if (updateData.length > dropData.length) {
         const newSignPos = getPos.concat(dropData);
-
         let xyPos = {
           pageNumber: pageNumber,
           pos: newSignPos
         };
         updatePlace.push(xyPos);
-
         let placeHolderPos = {
           blockColor: color[isSelectListId],
           signerObjId: signerObjId,
@@ -417,7 +347,6 @@ function PlaceHolderSign() {
 
         signerPos.splice(colorIndex, 1, placeHolderPos);
       } else {
-        // const newSignPos = getPlaceHolder.push(xyPosArr[0]);
         const newSignPoss = getPlaceHolder.concat(xyPosArr[0]);
 
         let placeHolderPos = {
@@ -467,17 +396,19 @@ function PlaceHolderSign() {
   };
 
   //function for set and update x and y postion after drag and drop signature tab
-  const handleStop = (event, dragElement) => {
+  const handleStop = (event, dragElement, signerId, key) => {
     const containerRect = document
       .getElementById("container")
       .getBoundingClientRect();
-
+    const signId = signerId ? signerId : signerObjId;
+    const keyValue = key ? key : dragKey;
     const ybottom = containerRect.height - dragElement.y;
 
-    if (dragKey >= 0) {
+    if (keyValue >= 0) {
       const filterSignerPos = signerPos.filter(
-        (data) => data.signerObjId === signerObjId
+        (data) => data.signerObjId === signId
       );
+
       if (filterSignerPos.length > 0) {
         const getPlaceHolder = filterSignerPos[0].placeHolder;
 
@@ -490,7 +421,7 @@ function PlaceHolderSign() {
 
           const getPosData = getXYdata;
           const addSignPos = getPosData.map((url, ind) => {
-            if (url.key === dragKey) {
+            if (url.key === keyValue) {
               return {
                 ...url,
                 xPosition: dragElement.x,
@@ -509,16 +440,15 @@ function PlaceHolderSign() {
             return obj;
           });
           const newUpdateSigner = signerPos.map((obj, ind) => {
-            if (obj.signerObjId === signerObjId) {
+            if (obj.signerObjId === signId) {
               return { ...obj, placeHolder: newUpdateSignPos };
             }
             return obj;
           });
+
           setSignerPos(newUpdateSigner);
         }
       }
-
-      // }
     }
   };
 
@@ -556,6 +486,7 @@ function PlaceHolderSign() {
             }
             return obj;
           });
+
           setSignerPos(newUpdateSigner);
         } else {
           const updateFilter = signerPos.filter(
@@ -577,6 +508,7 @@ function PlaceHolderSign() {
               (data) => data.signerObjId !== signerId
             );
             signerupdate.push(newUpdatePos[0]);
+
             setSignerPos(signerupdate);
           } else {
             setSignerPos(updateFilter);
@@ -621,12 +553,14 @@ function PlaceHolderSign() {
             }
             return obj;
           });
+
           const newUpdateSigner = signerPos.map((obj, ind) => {
             if (obj.signerObjId === signerId) {
               return { ...obj, placeHolder: newUpdateSignPos };
             }
             return obj;
           });
+
           setSignerPos(newUpdateSigner);
         } else {
           const getXYdata = getPageNumer[0].pos;
@@ -650,12 +584,14 @@ function PlaceHolderSign() {
             }
             return obj;
           });
+
           const newUpdateSigner = signerPos.map((obj, ind) => {
             if (obj.signerObjId === signerId) {
               return { ...obj, placeHolder: newUpdateSignPos };
             }
             return obj;
           });
+
           setSignerPos(newUpdateSigner);
         }
       }
@@ -670,8 +606,6 @@ function PlaceHolderSign() {
 
   //function for capture position on hover signature button
   const handleDivClick = (e) => {
-    // if (signBtnPosition.length == 0) {
-
     const divRect = e.currentTarget.getBoundingClientRect();
     const mouseX = e.clientX - divRect.left;
     const mouseY = e.clientY - divRect.top;
@@ -721,17 +655,13 @@ function PlaceHolderSign() {
       month: "long",
       year: "numeric"
     });
-
     let sender = signersdata.ExtUserPtr.Email;
-    //  let sender ="raktima.c@qik.ai"
     const signerMail = signersdata.Signers;
 
     for (let i = 0; i < signerMail.length; i++) {
       try {
         const imgPng =
           "https://qikinnovation.ams3.digitaloceanspaces.com/logo.png";
-        // "https://qikinnovation.ams3.digitaloceanspaces.com/mailLogo_2023-08-18T12%3A51%3A31.573Z.png";
-
         let url = `${localStorage.getItem("baseUrl")}functions/sendmailv3/`;
         const headers = {
           "Content-Type": "application/json",
@@ -745,7 +675,8 @@ function PlaceHolderSign() {
           "parseAppId"
         )}&${localStorage.getItem("_appName")}`;
 
-        let signPdf = `https://qik-ai-org.github.io/Sign-MicroappV2/#/login/${signersdata.objectId}/${signerMail[i].Email}/${objectId}/${serverParams}`;
+        const hostUrl = window.location.origin + "/loadmf/signmicroapp";
+        let signPdf = `${hostUrl}/login/${signersdata.objectId}/${signerMail[i].Email}/${objectId}/${serverParams}`;
 
         const themeBGcolor = themeColor();
         let params = {
@@ -800,14 +731,12 @@ function PlaceHolderSign() {
             }
           )
           .then((result) => {
-            //   const res = result.data;
             setIsSend(true);
             setIsMailSend(true);
             const loadObj = {
               isLoad: false
             };
             setIsLoading(loadObj);
-            // console.log("save res", res);
           })
           .catch((err) => {
             console.log("axois err ", err);
@@ -889,6 +818,12 @@ function PlaceHolderSign() {
         console.log("axois err ", err);
       });
   };
+  const handleRecipientSign = () => {
+    const hostUrl = getHostUrl();
+    navigate(
+      `${hostUrl}recipientSignPdf/${documentId}/${currentEmail[0].objectId}`
+    );
+  };
   return (
     <DndProvider backend={HTML5Backend}>
       {isLoading.isLoad ? (
@@ -993,9 +928,8 @@ function PlaceHolderSign() {
                 style={{
                   background: themeColor()
                 }}
-                // className="bg-danger"
               >
-                <span style={{ color: "white" }}>Send Mail </span>
+                <span style={{ color: "white" }}>Mails Sent</span>
               </Modal.Header>
 
               {/* signature modal */}
@@ -1023,21 +957,19 @@ function PlaceHolderSign() {
                       No
                     </button>
 
-                    <a
-                      style={{ color: "white" }}
-                      href={`https://qik-ai-org.github.io/Sign-MicroappV2/#/recipientSignPdf/${documentId}/${currentEmail[0].objectId}`}
+                    <button
+                      onClick={() => {
+                        handleRecipientSign();
+                      }}
+                      style={{
+                        background: themeColor(),
+                        color: "white"
+                      }}
+                      type="button"
+                      className="finishBtn"
                     >
-                      <button
-                        style={{
-                          background: themeColor(),
-                          color: "white"
-                        }}
-                        type="button"
-                        className="finishBtn"
-                      >
-                        Yes
-                      </button>
-                    </a>
+                      Yes
+                    </button>
                   </>
                 ) : (
                   <button
@@ -1160,8 +1092,6 @@ function PlaceHolderSign() {
                     dragRef={dragRef}
                     isDragStamp={isDragStamp}
                     isSignYourself={false}
-                    // xyPostion={xyPostion}
-                    //  isSigners={false}
                     addPositionOfSignature={addPositionOfSignature}
                   />
                 </div>

microfrontends/SignDocuments/src/Routes.js

@@ -8,6 +8,7 @@ import Login from "./Component/login";
 import DraftDocument from "./Component/DraftDocument";
 import PdfRequestFiles from "./Component/PdfRequestFiles";
 import LegaDrive from "./Component/LegaDrive/LegaDrive";
+import PageNotFound from "./Component/PageNotFound";
 
 // `AppRoutes` is used to define route path of app and
 // it expose to host app, check moduleFederation.config.js for more
@@ -33,7 +34,10 @@ function AppRoutes() {
         {/*Add default signature of user route */}
         <Route path="/managesign" element={<ManageSign />} />
         {/* login page route */}
-        <Route path="/login/:id/:userMail/:contactBookId/:serverUrl" element={<Login />} />
+        <Route
+          path="/login/:id/:userMail/:contactBookId/:serverUrl"
+          element={<Login />}
+        />
         {/* draft document route to handle and navigate route page accordiing to document status */}
         <Route path="/draftDocument" element={<DraftDocument />} />
         {/* for user signature (need your sign route) with row level data */}
@@ -42,6 +46,8 @@ function AppRoutes() {
         <Route path="/pdfRequestFiles/:docId" element={<PdfRequestFiles />} />
         {/* lega drive route */}
         <Route path="/legadrive" element={<LegaDrive />} />
+        {/* Page Not Found */}
+        <Route path="*" element={<PageNotFound />} />
       </Routes>
     </div>
   );