feat: add widgets in API

apps/OpenSign/src/pages/Form.js

@@ -300,7 +300,7 @@ const Forms = (props) => {
               <div className="flex gap-2 justify-center items-center">
                 <div className="flex justify-between items-center px-2 py-2 w-full font-bold rounded border-[1px] border-[#ccc] text-gray-500 bg-white text-[13px]">
                   <div className="break-all">
-                    file selected : {getFileName(fileload)}
+                    file selected : {getFileName(fileupload)}
                   </div>
                   <div
                     onClick={() => setFileUpload([])}

apps/OpenSignServer/Utils.js

@@ -150,3 +150,96 @@ export const updateMailCount = async extUserId => {
     console.log('Error updating EmailCount in contracts_users: ' + error.message);
   }
 };
+
+export function formatWidgetOptions(type, options) {
+  const status = options?.required === true ? 'required' : 'optional' || 'required';
+  const defaultValue = options?.default || '';
+  const values = options?.values || [];
+  switch (type) {
+    case 'signature':
+      return { name: 'signature', status: 'required' };
+    case 'stamp':
+      return { status: status, name: 'stamp' };
+    case 'initials':
+      return { status: status, name: options.name || 'initials' };
+    case 'image':
+      return { status: status, name: options.name || 'image' };
+    case 'email':
+      return { status: status, name: options.name || 'email', validation: { type: 'email' } };
+    case 'name':
+      return { status: status, name: options.name || 'name' };
+    case 'job title':
+      return { status: status, name: options.name || 'job title' };
+    case 'company':
+      return { status: status, name: options.name || 'company' };
+    case 'date': {
+      let today = new Date();
+      let dd = String(today.getDate()).padStart(2, '0');
+      let mm = String(today.getMonth() + 1).padStart(2, '0'); // January is 0!
+      let yyyy = today.getFullYear();
+      today = dd + '-' + mm + '-' + yyyy;
+      let dateFormat = options?.format;
+      dateFormat = dateFormat.replace(/m/g, 'M');
+      return {
+        status: status,
+        name: options.name || 'date',
+        response: defaultValue || today,
+        validation: { format: dateFormat || 'dd-MM-yyyy', type: 'date-format' },
+      };
+    }
+    case 'textbox':
+      return {
+        status: status,
+        name: 'textbox',
+        defaultValue: defaultValue,
+        hint: options.hint,
+        validation: { type: 'regex', pattern: options?.regularexpression || '/^[a-zA-Z0-9s]+$/' },
+      };
+    case 'checkbox': {
+      const arr = options?.values;
+      let selectedvalues = [];
+      for (const obj of options.selectedvalues) {
+        const index = arr.indexOf(obj);
+        selectedvalues.push(index);
+      }
+      return {
+        status: status,
+        name: options.name || 'checkbox',
+        values: values,
+        isReadOnly: options?.readonly || false,
+        isHideLabel: options?.hidelabel || false,
+        validation: {
+          minRequiredCount: options?.validation?.minselections || 0,
+          maxRequiredCount: options?.validation?.maxselections || 0,
+        },
+        defaultValue: selectedvalues || [],
+      };
+    }
+    case 'radio button': {
+      return {
+        status: status,
+        name: options.name || 'radio',
+        values: values,
+        isReadOnly: options?.readonly || false,
+        isHideLabel: options?.hidelabel || false,
+        defaultValue: defaultValue,
+      };
+    }
+    case 'dropdown':
+      return {
+        status: status,
+        name: options.name || 'dropdown',
+        values: values,
+        defaultValue: defaultValue,
+      };
+    default:
+      break;
+  }
+}
+
+export function sanitizeFileName(fileName) {
+  // Remove spaces and invalid characters
+  const file = fileName.replace(/[^a-zA-Z0-9._-]/g, '');
+  const removedot = file.replace(/\.(?=.*\.)/g, '');
+  return removedot.replace(/[^a-zA-Z0-9._-]/g, '');
+}

apps/OpenSignServer/cloud/customRoute/v1/routes/createDocumentwithCoordinate.js

@@ -1,5 +1,12 @@
 import axios from 'axios';
-import { color, customAPIurl, replaceMailVaribles, saveFileUsage } from '../../../../Utils.js';
+import {
+  color,
+  customAPIurl,
+  replaceMailVaribles,
+  saveFileUsage,
+  formatWidgetOptions,
+  sanitizeFileName,
+} from '../../../../Utils.js';
 
 // `sendDoctoWebhook` is used to send res data of document on webhook
 async function sendDoctoWebhook(doc, WebhookUrl, userId) {
@@ -92,9 +99,8 @@ export default async function createDocumentwithCoordinate(request, response) {
           const buffer = Buffer.from(base64, 'base64');
           saveFileUsage(buffer.length, fileUrl, parseUser.userId.objectId);
         } else {
-          const file = new Parse.File(`${name}.pdf`, {
-            base64: base64File,
-          });
+          const filename = sanitizeFileName(`${name}.pdf`);
+          const file = new Parse.File(filename, { base64: base64File }, 'application/pdf');
           await file.save({ useMasterKey: true });
           fileUrl = file.url();
           const buffer = Buffer.from(base64File, 'base64');
@@ -177,17 +183,17 @@ export default async function createDocumentwithCoordinate(request, response) {
 
             for (const widget of signer.widgets) {
               const pageNumber = widget.page;
+              const options = formatWidgetOptions(widget.type, widget.options);
               const page = placeHolder.find(page => page.pageNumber === pageNumber);
-              const signOpt = { name: 'signature', status: 'required' };
               const widgetData = {
-                isStamp: widget.type === 'stamp'||  widget.type === 'image',
+                isStamp: widget.type === 'stamp' || widget.type === 'image',
                 key: randomId(),
                 isDrag: false,
                 scale: 1,
                 isMobile: false,
                 zIndex: 1,
-                type: widget.type,
-                options: widget.type === 'signature' ? signOpt : widget.options,
+                type: widget.type === 'textbox' ? 'text input' : widget.type,
+                options: options,
                 Width: widget.w,
                 Height: widget.h,
                 xPosition: widget.x,

apps/OpenSignServer/cloud/customRoute/v1/routes/createTemplatewithCoordinate.js

@@ -1,5 +1,11 @@
 import axios from 'axios';
-import { color, customAPIurl, saveFileUsage } from '../../../../Utils.js';
+import {
+  color,
+  customAPIurl,
+  saveFileUsage,
+  formatWidgetOptions,
+  sanitizeFileName,
+} from '../../../../Utils.js';
 
 const randomId = () => Math.floor(1000 + Math.random() * 9000);
 export default async function createTemplatewithCoordinate(request, response) {
@@ -43,9 +49,8 @@ export default async function createTemplatewithCoordinate(request, response) {
           const buffer = Buffer.from(base64, 'base64');
           saveFileUsage(buffer.length, fileUrl, parseUser.userId.objectId);
         } else {
-          const file = new Parse.File(`${name}.pdf`, {
-            base64: base64File,
-          });
+          const filename = sanitizeFileName(`${name}.pdf`);
+          const file = new Parse.File(filename, { base64: base64File }, 'application/pdf');
           await file.save({ useMasterKey: true });
           fileUrl = file.url();
           const buffer = Buffer.from(base64File, 'base64');
@@ -134,16 +139,16 @@ export default async function createTemplatewithCoordinate(request, response) {
             for (const widget of signer.widgets) {
               const pageNumber = widget.page;
               const page = placeHolder.find(page => page.pageNumber === pageNumber);
-              const signOpt = { name: 'signature', status: 'required' };
+              const options = formatWidgetOptions(widget.type, widget.options);
               const widgetData = {
-                isStamp: widget.type === 'stamp'||  widget.type === 'image',
+                isStamp: widget.type === 'stamp' || widget.type === 'image',
                 key: randomId(),
                 isDrag: false,
                 scale: 1,
                 isMobile: false,
                 zIndex: 1,
-                type: widget.type,
-                options: widget.type === 'signature' ? signOpt : widget.options,
+                type: widget.type === 'textbox' ? 'text input' : widget.type,
+                options: options,
                 Width: widget.w,
                 Height: widget.h,
                 xPosition: widget.x,