v1.3.2-beta

.env.local_dev

@@ -20,7 +20,7 @@ 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
+MONGODB_URI=mongodb://localhost: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)

apps/OpenSign/Dockerhubfile

@@ -14,6 +14,9 @@ RUN npm install
 COPY apps/OpenSign/ .
 COPY apps/OpenSign/.husky .
 
+# build
+RUN npm run build
+
 # Make port 3000 available to the world outside this container
 EXPOSE 3000
 

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

@@ -0,0 +1,47 @@
+import React from "react";
+import "../../styles/loader.css";
+import { useNavigate } from "react-router-dom";
+import { openInNewTab } from "../../constant/Utils";
+
+const DashboardButton = (props) => {
+  const navigate = useNavigate();
+
+  function openReport() {
+    if (props.Data && props.Data.Redirect_type) {
+      const Redirect_type = props.Data.Redirect_type;
+      const id = props.Data.Redirect_id;
+      if (Redirect_type === "Form") {
+        navigate(`/form/${id}`);
+      } else if (Redirect_type === "Report") {
+        navigate(`/report/${id}`);
+      } else if (Redirect_type === "Url") {
+        openInNewTab(id);
+      }
+    }
+  }
+  return (
+    <div
+      onClick={() => openReport()}
+      className={`${
+        props.Data && props.Data.Redirect_type
+          ? "cursor-pointer"
+          : "cursor-default"
+      } w-full px-3 py-2 flex text-white rounded-md shadow overflow-hidden`}
+    >
+      <div className="flex items-center justify-start gap-5">
+        <span className="rounded-full bg-black bg-opacity-20 w-[60px] h-[60px]  self-start flex justify-center items-center">
+          <i
+            className={`${
+              props.Icon ? props.Icon : "fa fa-solid fa-info"
+            } text-[25px] lg:text-[30px]`}
+          ></i>
+        </span>
+        <div className="">
+          <div className="text-base lg:text-lg text-black"> {props.Label}</div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default DashboardButton;

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

@@ -1,14 +1,51 @@
 import React, { Suspense, lazy } from "react";
+const DashboardButton = lazy(() => import("./DashboardButton"));
 const DashboardCard = lazy(() => import("./DashboardCard"));
 const DashboardReport = lazy(() => import("./DashboardReport"));
-
+const buttonList = [
+  {
+    label: "Sign yourself",
+    redirectId: "sHAnZphf69",
+    redirectType: "Form"
+  },
+  {
+    label: "Request signature",
+    redirectId: "8mZzFxbG1z",
+    redirectType: "Form"
+  }
+];
 const GetDashboard = (props) => {
+  const Button = ({ label, redirectId, redirectType }) => (
+    <div className={"bg-white rounded-md shadow  w-full"}>
+      <Suspense
+        fallback={
+          <div style={{ height: "300px" }}>
+            <div
+              style={{
+                marginLeft: "45%",
+                marginTop: "150px",
+                fontSize: "45px",
+                color: "#3dd3e0"
+              }}
+              className="loader-37"
+            ></div>
+          </div>
+        }
+      >
+        <DashboardButton
+          Icon={"fa-solid fa-plus"}
+          Label={label}
+          Data={{ Redirect_type: redirectType, Redirect_id: redirectId }}
+        />
+      </Suspense>
+    </div>
+  );
   const renderSwitchWithTour = (col) => {
     switch (col.widget.type) {
       case "Card":
         return (
           <div
-            className={"bg-[#2ed8b6] rounded-md shadow mb-4 md:mb-0"}
+            className={"bg-[#2ed8b6] rounded-md shadow mb-3 md:mb-0"}
             data-tut={col.widget.data.tourSection}
             style={{ background: col.widget.bgColor }}
           >
@@ -42,7 +79,7 @@ const GetDashboard = (props) => {
         return (
           <div data-tut={col.widget.data.tourSection}>
             <Suspense fallback={<div>please wait</div>}>
-              <div className="mb-4 md:mb-0">
+              <div className="mb-3 md:mb-0">
                 <DashboardReport Record={col.widget} />
               </div>
             </Suspense>
@@ -58,7 +95,7 @@ const GetDashboard = (props) => {
       case "Card":
         return (
           <div
-            className={"bg-[#2ed8b6] rounded-md shadow mb-4 md:mb-0"}
+            className={"bg-[#2ed8b6] rounded-md shadow mb-3 md:mb-0"}
             style={{ background: col.widget.bgColor }}
           >
             <Suspense fallback={<div>please wait</div>}>
@@ -76,7 +113,7 @@ const GetDashboard = (props) => {
       case "report": {
         return (
           <Suspense fallback={<div>please wait</div>}>
-            <div className="mb-4 md:mb-0">
+            <div className="mb-3 md:mb-0">
               <DashboardReport Record={col.widget} />
             </div>
           </Suspense>
@@ -88,6 +125,21 @@ const GetDashboard = (props) => {
   };
   return (
     <div>
+      <div className="mb-3">
+        <div
+          data-tut={"tourbutton"}
+          className="flex flex-col md:flex-row gap-6 md:gap-8"
+        >
+          {buttonList.map((btn) => (
+            <Button
+              key={btn.label}
+              label={btn.label}
+              redirectType={btn.redirectType}
+              redirectId={btn.redirectId}
+            />
+          ))}
+        </div>
+      </div>
       {props.dashboard.map((val, key) => (
         <div key={"a" + key} className="row">
           {val.columns.map((col, i) =>

apps/OpenSign/src/components/pdf/DropdownWidgetOption.js

@@ -377,7 +377,7 @@ function DropdownWidgetOption(props) {
                   />
 
                   <label className="ml-1" htmlFor="ishidelabel">
-                    Hide label
+                    Hide labels
                   </label>
                 </div>
               </div>

apps/OpenSign/src/components/pdf/Placeholder.js

@@ -215,7 +215,8 @@ function Placeholder(props) {
       "company",
       "job title",
       "date",
-      "email"
+      "email",
+      textWidget
     ].includes(props.pos.type);
 
     if (widgetTypeExist) {
@@ -594,7 +595,7 @@ function Placeholder(props) {
       disableDragging={
         props.isNeedSign
           ? true
-          : props.isPlaceholder && props.pos.type !== "date"
+          : props.isPlaceholder && ![textWidget].includes(props.pos.type)
             ? false
             : !isDraggingEnabled
       }
@@ -652,8 +653,18 @@ function Placeholder(props) {
           style={{
             left: props.xPos(props.pos, props.isSignYourself),
             top: props.yPos(props.pos, props.isSignYourself),
-            width: "auto", //props.posWidth(props.pos, props.isSignYourself),
+            width:
+              props.pos.type === radioButtonWidget ||
+              props.pos.type === "checkbox"
+                ? "auto"
+                : props.posWidth(props.pos, props.isSignYourself),
+            //  "auto", //props.posWidth(props.pos, props.isSignYourself),
             // height: props.posHeight(props.pos, props.isSignYourself),
+            height:
+              props.pos.type === radioButtonWidget ||
+              props.pos.type === "checkbox"
+                ? "auto"
+                : props.posHeight(props.pos, props.isSignYourself),
             zIndex: "10"
           }}
           onTouchEnd={() => handleOnClickPlaceholder()}

apps/OpenSign/src/components/pdf/PlaceholderBorder.js

@@ -4,7 +4,8 @@ import {
   defaultWidthHeight,
   isMobile,
   radioButtonWidget,
-  resizeBorderExtraWidth
+  resizeBorderExtraWidth,
+  textWidget
 } from "../../constant/Utils";
 function PlaceholderBorder(props) {
   const getResizeBorderExtraWidth = resizeBorderExtraWidth();
@@ -31,7 +32,10 @@ function PlaceholderBorder(props) {
   };
   return (
     <div
-      onMouseEnter={!isMobile && props?.setDraggingEnabled(true)}
+      onMouseEnter={() => !isMobile && props?.setDraggingEnabled(true)}
+      onTouchEnd={() =>
+        props.pos.type === textWidget && props?.setDraggingEnabled(true)
+      }
       className="borderResize"
       style={{
         borderColor: themeColor,

apps/OpenSign/src/components/pdf/PlaceholderType.js

@@ -2,6 +2,7 @@ import React, { useEffect, useState, forwardRef, useRef } from "react";
 import {
   getMonth,
   getYear,
+  isMobile,
   onChangeInput,
   radioButtonWidget,
   range,
@@ -741,6 +742,7 @@ function PlaceholderType(props) {
           placeholder="Enter label"
           rows={1}
           value={textValue}
+          onBlur={handleInputBlur}
           onChange={(e) => {
             setTextValue(e.target.value);
             onChangeInput(
@@ -753,7 +755,11 @@ function PlaceholderType(props) {
               false
             );
           }}
-          className="labelTextArea"
+          className={
+            isMobile
+              ? "labelTextArea labelWidthMobile"
+              : "labelTextArea labelWidthDesktop"
+          }
           style={{ whiteSpace: "pre-wrap" }}
           cols="50"
         />

apps/OpenSign/src/components/pdf/WidgetComponent.js

@@ -239,8 +239,8 @@ function WidgetComponent({
   const updateWidgets = isSignYourself
     ? filterWidgets
     : isTemplateFlow
-      ? textWidgetData
-      : widget;
+    ? textWidgetData
+    : widget;
 
   return (
     <>
@@ -264,11 +264,7 @@ function WidgetComponent({
                   alignItems: "center",
                   justifyContent: "center"
                 }}
-                onClick={() => {
-                  // if (signersdata?.length) {
-                  handleModal();
-                  // }
-                }}
+                onClick={() => handleModal()}
               >
                 <span
                   style={{
@@ -346,7 +342,7 @@ function WidgetComponent({
                   display: "flex",
                   overflowX: "scroll",
                   whiteSpace: "nowrap",
-                  padding: "10px"
+                  padding: "10px 5px 10px 1px"
                 }}
               >
                 <WidgetList

apps/OpenSign/src/components/pdf/WidgetList.js

@@ -4,7 +4,7 @@ import { getWidgetType } from "../../constant/Utils";
 function WidgetList(props) {
   return props.updateWidgets.map((item, ind) => {
     return (
-      <div key={ind} style={{ marginBottom: "10px" }}>
+      <div key={ind} style={{ marginBottom: "5px" }}>
         <div
           className="widgets"
           onClick={() => {

apps/OpenSign/src/components/pdf/WidgetNameModal.js

@@ -129,27 +129,15 @@ const WidgetNameModal = (props) => {
               >
                 <div style={{ width: "100%", position: "relative" }}>
                   <input
-                    style={{
-                      padding: "0.5rem 0.75rem",
-                      width: "92%",
-                      borderWidth: "1px",
-                      borderColor: "#d1d5db",
-                      borderTopLeftRadius: "0.375rem",
-                      borderBottomLeftRadius: "0.375rem",
-                      outline: "none",
-                      fontSize: "0.75rem",
-                      position: "relative",
-                      zIndex: 2
-                    }}
+                    className="relative z-20 w-[87%] md:w-[92%] p-2.5 border-[1px] border-[#d1d5db] rounded-l-md outline-none text-xs"
                     name="textvalidate"
                     placeholder="Enter custom expression"
                     value={formdata.textvalidate}
                     onChange={(e) => handleChange(e)}
                     // onBlur={() => handleBlurRegex()}
                   />
                   <select
-                    style={{ position: "absolute", left: 0, zIndex: 1 }}
-                    className="addUserInput"
+                    className="validationlist addUserInput"
                     name="textvalidate"
                     value={formdata.textvalidate}
                     onChange={(e) => handleChange(e)}

apps/OpenSign/src/components/shared/fields/SelectFolder.js

@@ -93,7 +93,7 @@ const SelectFolder = ({ required, onSuccess, folderCls, isReset }) => {
 
   // `handleSubmit` is used to pass folderPtr to parent component
   const handleSubmit = () => {
-    let url = "Root";
+    let url = "OpenSign™ Drive";
     tabList.forEach((t) => {
       url = url + " / " + t.Name;
     });
@@ -180,7 +180,9 @@ const SelectFolder = ({ required, onSuccess, folderCls, isReset }) => {
         <div className="font-semibold ">
           <div className="flex items-center gap-2">
             <p>
-              {selectFolder && selectFolder.Name ? selectFolder.Name : "Root"}
+              {selectFolder && selectFolder.Name
+                ? selectFolder.Name
+                : "OpenSign™ Drive"}
             </p>
             <div className="text-black text-sm" onClick={() => SetIsOpen(true)}>
               <i
@@ -207,14 +209,14 @@ const SelectFolder = ({ required, onSuccess, folderCls, isReset }) => {
         isOpen={isOpen}
         handleClose={handleCancel}
       >
-        <div className="w-full min-w-[300px] md:min-w-[500px] px-3">
+        <div className="w-full min-w-[300px] md:min-w-[500px] max-w-[500px] px-3">
           <div className="py-2 text-[#ac4848] text-[14px] font-[500]">
             <span
               className="cursor-pointer"
-              title="Root"
+              title="OpenSign™ Drive"
               onClick={(e) => removeTabListItem(e)}
             >
-              Root /{" "}
+              OpenSign™ Drive /{" "}
             </span>
             {tabList &&
               tabList.map((tab, i) => (