form-craft-package 1.9.4 → 1.9.6-dev.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "form-craft-package",
-  "version": "1.9.4",
+  "version": "1.9.6-dev.0",
   "main": "index.ts",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",

package/src/components/form/layout-renderer/3-element/6-signature.tsx

@@ -1,5 +1,5 @@
 import { Form } from 'antd'
-import { memo, useEffect, useMemo, useRef } from 'react'
+import { memo, useEffect, useMemo, useRef, useState } from 'react'
 import SignatureCanvas from 'react-signature-canvas'
 import { FormPreservedItemKeys, TranslationTextTypeEnum } from '../../../../enums'
 import { Button_FillerPortal } from '../../../common/button'
@@ -24,6 +24,7 @@ function LayoutRenderer_Signature({
   const sigCanvasRef = useRef<SignatureCanvas>(null)
   const savedSignatureBlobName = Form.useWatch(formItem.path, formRef)
   const { isGeneratingPdf, baseServerUrl } = useFormPreservedItemValues(formRef)
+  const [isReady, setIsReady] = useState(false)
 
   useEffect(() => {
     if (isDisabled) sigCanvasRef.current?.off()
@@ -35,6 +36,10 @@ function LayoutRenderer_Signature({
     [formItem.path],
   )
 
+  useEffect(() => {
+    setTimeout(() => setIsReady(true), 2000)
+  }, [])
+
   return (
     <Form.Item
       name={formItem.name}
@@ -60,7 +65,11 @@ function LayoutRenderer_Signature({
       }
       labelAlign="left"
     >
-      {isNewFormDataPage(formDataId) && !isGeneratingPdf ? (
+      {isNewFormDataPage(formDataId) && !isReady ? (
+        <div className="h-[300px] rounded-md border-2 border-[#f0f0f0] text-center bg-gray-100 flex justify-center p-2">
+          Loading the signature canvas...
+        </div>
+      ) : isNewFormDataPage(formDataId) && !isGeneratingPdf ? (
         <SignatureCanvas
           ref={sigCanvasRef}
           canvasProps={{

package/src/components/form/layout-renderer/3-element/9-form-data-render.tsx

@@ -30,7 +30,7 @@ function LayoutRenderer_LoadFormData({ formContext, elementProps }: ILayoutRende
 
   const [dataList, setDataList] = useState<{ data: IFormDataListData[]; total: number }>({ data: [], total: 0 })
   const dataProjectRef = useRef<{ [key: string]: string }>({})
-  const reportDataApiCancelFuncRef = useRef<() => void | undefined>(undefined)
+  const reportDataApiCancelFuncRef = useRef<() => void | undefined>()
   const formJoinsRef = useRef<IFormJoin[]>([])
   const m2mForeignKeysRef = useRef<{ currentForm: string; otherForm: string } | undefined>()
 

package/src/functions/forms/get-data-list-option-value.ts

@@ -1,8 +1,9 @@
 import { fetchFormDataAsLookup } from '.'
-import { FieldElementOptionSourceEnum } from '../../enums'
+import { FieldElementOptionSourceEnum, TranslationTextTypeEnum } from '../../enums'
 import { IFormDataListColumn } from '../../types'
 import client from '../../api/client'
 import { REACT_QUERY_CLIENT } from '../../constants'
+import { translationStore } from '../../components/common/custom-hooks/use-translation.hook/store'
 
 export async function processOptions(options: IFormDataListColumn[]): Promise<{ [key: string]: any }> {
   const groupedRequests = new Map<string, { [key: string]: number }>()
@@ -26,7 +27,7 @@ export async function processOptions(options: IFormDataListColumn[]): Promise<{
   groupedRequests.forEach((paths, formId) => {
     const cachedConfig = REACT_QUERY_CLIENT.getQueryData(['layoutConfig', String(formId)])
 
-    if (cachedConfig) apiCallPromises.push(Promise.resolve({ _id: '-1', Data: extractByDotPaths(paths, cachedConfig) }))
+    if (cachedConfig) apiCallPromises.push(Promise.resolve({ _id: formId, Data: extractByDotPaths(paths, cachedConfig) }))
     else
       apiCallPromises.push(
         client.post(`/api/form/${formId}`, { project: JSON.stringify(paths) }).then((res) => res.data),
@@ -38,7 +39,7 @@ export async function processOptions(options: IFormDataListColumn[]): Promise<{
   const finalResult: { [key: string]: any } = {}
   const dynamicApiPromises: Promise<void>[] = []
 
-  apiResults.forEach(({ Data }) => {
+  apiResults.forEach(({ _id, Data }) => {
     const elements = Data?.detailsConfig?.elements
     if (!elements) return
 
@@ -50,8 +51,15 @@ export async function processOptions(options: IFormDataListColumn[]): Promise<{
       if (optionSource.type === FieldElementOptionSourceEnum.Static) {
         const optionsArray = optionSource.options
         if (Array.isArray(optionsArray)) {
-          optionsArray.forEach((opt: { id: string; value: any }) => {
-            finalResult[opt.id] = opt.value
+          optionsArray.forEach((opt: { id: string }) => {
+            finalResult[opt.id] = translationStore.translate(
+              {
+                key: element.key,
+                type: TranslationTextTypeEnum.OptionValue,
+                subType: opt.id,
+              },
+              Number(_id),
+            )
           })
         }
       } else if (optionSource.type === FieldElementOptionSourceEnum.DynamicForm) {