form-craft-package 1.10.4 → 1.10.5

package/package.json

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

package/src/components/form/layout-renderer/3-element/1-dynamic-button/use-send-notification.hook.ts

@@ -5,7 +5,14 @@ import { IOnSuccessFunctions } from '.'
 import { useNotification } from '../../../../common/custom-hooks'
 import { useFormPreservedItemValues } from '../../../../common/custom-hooks/use-preserved-form-items.hook'
 import { MongoDbExtendedJsonObjectKeys, REGEX_PATTERNS } from '../../../../../constants'
-import { buildImageTag, isNewFormDataPage, renderData, replaceTemplateReportAndUpload, safeNormalizeForEmail } from '../../../../../functions'
+import {
+  buildImageTag,
+  extractNotFoundBlobNames,
+  isNewFormDataPage,
+  renderData,
+  replaceTemplateReportAndUpload,
+  safeNormalizeForEmail,
+} from '../../../../../functions'
 import {
   CountryEnum,
   DataRenderTypeEnum,
@@ -147,7 +154,6 @@ export const useSendNotificationAction = ({
           typeof notifConfigRes.data.data === 'string' &&
           formNotif.replacements
         ) {
-
           let notifConfig = notifConfigRes.data.data || ''
 
           for (const [placeholderKey, placeholderReplacement] of Object.entries(formNotif.replacements)) {
@@ -209,7 +215,7 @@ export const useSendNotificationAction = ({
             ) || []
 
           const notifRes = await Promise.all(
-            notifTypes.map((type) => {
+            notifTypes.map(async (type) => {
               let endpoint = '/api/notification/email'
               if (type === NotificationTypeEnum.Push) endpoint = '/api/notification/push'
               else if (type === NotificationTypeEnum.Text) endpoint = '/api/notification/text'
@@ -230,14 +236,23 @@ export const useSendNotificationAction = ({
                   typeReqData.body = safeNormalizeForEmail(typeReqData.body[selectedLanguage])
                 }
 
-                if (Array.isArray(typeReqData.attachments))
-                  typeReqData.attachments = [...typeReqData.attachments, ...formTemplateReportAttachments].map(
-                    (att: IEmail_Attachment) => {
-                      const { type, ...restAtt } = att
-                      return restAtt
-                    },
-                  )
+                if (Array.isArray(typeReqData.attachments)) {
+                  console.log('typeReqData.attachments', typeReqData.attachments)
 
+                  const blobsNotFound = await extractNotFoundBlobNames(
+                    typeReqData.attachments.map((att: IEmail_Attachment) => att.blobName),
+                  )
+                  console.log('blobsNotFound', blobsNotFound)
+                  typeReqData.attachments = [
+                    ...typeReqData.attachments.filter(
+                      (att: IEmail_Attachment) => !blobsNotFound.includes(att.blobName),
+                    ),
+                    ...formTemplateReportAttachments,
+                  ].map((att: IEmail_Attachment) => {
+                    const { type, ...restAtt } = att
+                    return restAtt
+                  })
+                }
                 const emailFields = ['to', 'from', 'cc', 'bcc']
                 emailFields.forEach((f) => {
                   typeReqData[f] = Array.isArray(typeReqData[f])
@@ -292,5 +307,3 @@ export const useSendNotificationAction = ({
 
   return onSendNotification
 }
-
-

package/src/components/form/layout-renderer/3-element/12-picker-field.tsx

@@ -1,6 +1,6 @@
 import { LayoutRenderer_FieldElement } from './2-field-element'
 import { IFormContext } from '../1-row'
-import { IPickerElement } from '../../../../types'
+import { IDatePickerElement, ITimePickerElement } from '../../../../types'
 import { IElementBaseProps } from '.'
 import { getElementGeneralizedProps } from '../../../../functions/forms/get-element-props'
 import { ElementTypeEnum, TranslationTextSubTypeEnum, TranslationTextTypeEnum } from '../../../../enums'
@@ -41,7 +41,12 @@ function LayoutRenderer_PickerField({ formContext, formItem, elementData, isDisa
   })
 
   return (
-    <LayoutRenderer_FieldElement formRef={formContext.formRef} elementKey={elementData.key} formId={formContext.formId} formContext={formContext}>
+    <LayoutRenderer_FieldElement
+      formRef={formContext.formRef}
+      elementKey={elementData.key}
+      formId={formContext.formId}
+      formContext={formContext}
+    >
       {() => ({
         ...props,
         label,
@@ -68,7 +73,5 @@ export default memo(LayoutRenderer_PickerField)
 
 type ILayoutRenderer_PickerField = {
   formContext: IFormContext
-  elementData: IPickerElement
+  elementData: IDatePickerElement | ITimePickerElement
 } & IElementBaseProps
-
-

package/src/components/form/layout-renderer/3-element/14-auto-complete.tsx

@@ -12,7 +12,7 @@ import { extractConditionalFieldDependencies } from '../../../../functions/forms
 import { mapToFormItemRules } from '../../../../functions'
 import { DisabledFieldIndicator } from '../../../common/disabled-field-indicator'
 
-function LayoutRenderer_AutoComplete({ formContext, formItem, elementData, isDisabled }: ILayoutRenderer_PickerField) {
+function LayoutRenderer_AutoComplete({ formContext, formItem, elementData, isDisabled }: ILayoutRenderer_AutoComplete) {
   const { formRef, formId, formDataId } = formContext
   const { t } = useTranslation(formId)
   const currentBreakpoint = useGetCurrentBreakpoint()
@@ -102,7 +102,7 @@ function LayoutRenderer_AutoComplete({ formContext, formItem, elementData, isDis
 
 export default memo(LayoutRenderer_AutoComplete)
 
-type ILayoutRenderer_PickerField = {
+type ILayoutRenderer_AutoComplete = {
   formContext: IFormContext
   elementData: IInputElement
-} & IElementBaseProps
+} & IElementBaseProps

package/src/components/form/layout-renderer/3-element/2-field-element.tsx

@@ -10,10 +10,23 @@ import { IFormContext } from '../1-row'
 import CurrencyField from '../../../common/currency-field'
 import useGetCurrentBreakpoint from '../../../common/custom-hooks/use-window-width.hook'
 import { ELEMENTS_DEFAULT_CLASS } from '../../../../constants'
-import { Checkbox, Form, Input, Select, Radio, InputNumber, DatePicker, Modal, Switch, FormInstance } from 'antd'
+import { IntRange } from 'rc-picker/lib/interface'
 import { useBlurEventPublisher } from '../../../common/duplicate-entry-checker/blur-event-bus-provider'
 import { Rule } from 'antd/es/form'
 import { translationStore } from '../../../common/custom-hooks/use-translation.hook/store'
+import {
+  Checkbox,
+  Form,
+  Input,
+  Select,
+  Radio,
+  InputNumber,
+  DatePicker,
+  Modal,
+  Switch,
+  FormInstance,
+  TimePicker,
+} from 'antd'
 import {
   CountryEnum,
   DataSanitizationTypeEnum,
@@ -107,7 +120,7 @@ const FieldFormItemWrapper = ({
           },
           formId,
         ) || 'The new password that you entered do not match!'
-        
+
       baseRules = [
         ...baseRules,
         ({ getFieldValue }) => ({
@@ -307,14 +320,23 @@ const fieldRenderers: Partial<Record<ElementTypeEnum, FieldRenderer>> = {
       allowEmpty
     />
   ),
-  [ElementTypeEnum.TimePicker]: ({ disabled }) => (
-    <DatePicker.TimePicker
-      format={datepickerFormats}
-      disabled={disabled}
-      className={`${ELEMENTS_DEFAULT_CLASS.TimePicker} w-full`}
-      allowClear
-    />
-  ),
+  [ElementTypeEnum.TimePicker]: ({ disabled, use12Hours, includeSeconds, hourStep, minuteStep, secondStep }) => {
+    const baseFormat = includeSeconds ? 'HH:mm:ss' : 'HH:mm'
+    return (
+      <TimePicker
+        format={baseFormat + (use12Hours ? ' A' : '')}
+        use12Hours={use12Hours}
+        disabled={disabled}
+        className={`${ELEMENTS_DEFAULT_CLASS.TimePicker} w-full`}
+        allowClear
+        changeOnScroll
+        needConfirm={false}
+        hourStep={hourStep}
+        minuteStep={minuteStep}
+        secondStep={secondStep}
+      />
+    )
+  },
   [ElementTypeEnum.ShortInput]: ({ placeholder, disabled, name, onBlur }) => (
     <Input
       id={name as string}
@@ -358,6 +380,12 @@ interface IMapperFieldObj {
   decimalPoint?: number
   mode?: 'multiple' | 'tags'
   confirmPwdField?: string
+  // Time picker props
+  use12Hours?: boolean
+  includeSeconds?: boolean
+  hourStep?: IntRange<1, 23>
+  minuteStep?: IntRange<1, 59>
+  secondStep?: IntRange<1, 59>
   disabledDate?: (date: Dayjs) => boolean
   onBlur?: (currentValue: any) => void
 }

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

@@ -25,7 +25,7 @@ function LayoutRenderer_Signature({
   const { t } = useTranslation(formId)
   const sigCanvasRef = useRef<SignatureCanvas>(null)
   const savedSignatureBlobName = Form.useWatch(formItem.path, formRef)
-  const { isGeneratingPdf, baseServerUrl } = useFormPreservedItemValues(formRef)
+  const { isGeneratingPdf, baseServerUrl, signatureFields } = useFormPreservedItemValues(formRef)
   const currentBreakpoint = useGetCurrentBreakpoint()
   const [isReady, setIsReady] = useState(false)
   const savedSignatureBlobNameRef = useRef<string>('')
@@ -48,10 +48,22 @@ function LayoutRenderer_Signature({
     else sigCanvasRef.current?.on()
   }, [isDisabled])
 
-  const fieldKeyJoined = useMemo(
-    () => (Array.isArray(formItem.path) ? formItem.path.join('.') : formItem.path),
-    [formItem.path],
-  )
+  const fieldKeyJoined = useMemo(
+    () => (Array.isArray(formItem.path) ? formItem.path.join('.') : formItem.path),
+    [formItem.path],
+  )
+
+  useEffect(() => {
+    if (!isNewFormDataPage(formDataId) || !fieldKeyJoined) return
+    const stored = signatureFields?.[fieldKeyJoined]
+    if (typeof stored === 'string' && stored) {
+      if (stored !== savedSignatureBlobNameRef.current) savedSignatureBlobNameRef.current = stored
+      if (isReady) sigCanvasRef.current?.fromDataURL(stored)
+    } else {
+      savedSignatureBlobNameRef.current = ''
+      if (isReady) sigCanvasRef.current?.clear()
+    }
+  }, [fieldKeyJoined, formDataId, isReady, signatureFields])
 
   useEffect(() => {
     setTimeout(() => setIsReady(true), 2000)
@@ -98,11 +110,12 @@ function LayoutRenderer_Signature({
             {(!elementProps.showClearWhenNew || isNewFormDataPage(formDataId)) && (
               <Button_FillerPortal
                 link
-                onClick={() => {
-                  sigCanvasRef.current?.clear()
-                  if (fieldKeyJoined)
-                    formRef?.setFieldsValue({ [FormPreservedItemKeys.SignatureFields]: { [fieldKeyJoined]: null } })
-                }}
+                onClick={() => {
+                  sigCanvasRef.current?.clear()
+                  savedSignatureBlobNameRef.current = ''
+                  if (fieldKeyJoined)
+                    formRef?.setFieldsValue({ [FormPreservedItemKeys.SignatureFields]: { [fieldKeyJoined]: null } })
+                }}
               >
                 {clearBtnLabel || 'Clear'}
               </Button_FillerPortal>

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

@@ -30,11 +30,12 @@ import {
   ISelectElement,
   IRadioElement,
   ICurrencyInputElement,
-  IPickerElement,
+  IDatePickerElement,
   IInputElementProps,
   IInputElement,
   ICustomComponentProps,
   IUserRoleElement,
+  ITimePickerElement,
 } from '../../../../types'
 
 const LayoutRenderer_ReadFieldData = lazy(() => import('./3-read-field-data'))
@@ -269,7 +270,7 @@ function LayoutRendererElement({
 
     [ElementTypeEnum.DatePicker]: () => (
       <LayoutRenderer_PickerField
-        elementData={{ ...(elementData as IPickerElement), validations: validationsAfterIsHidden }}
+        elementData={{ ...(elementData as IDatePickerElement), validations: validationsAfterIsHidden }}
         formContext={formContext}
         {...elementBaseProps}
       />
@@ -277,7 +278,7 @@ function LayoutRendererElement({
 
     [ElementTypeEnum.TimePicker]: () => (
       <LayoutRenderer_PickerField
-        elementData={{ ...(elementData as IPickerElement), validations: validationsAfterIsHidden }}
+        elementData={{ ...(elementData as ITimePickerElement), validations: validationsAfterIsHidden }}
         formContext={formContext}
         {...elementBaseProps}
       />
@@ -285,7 +286,7 @@ function LayoutRendererElement({
 
     [ElementTypeEnum.RangePicker]: () => (
       <LayoutRenderer_PickerField
-        elementData={{ ...(elementData as IPickerElement), validations: validationsAfterIsHidden }}
+        elementData={{ ...(elementData as IDatePickerElement), validations: validationsAfterIsHidden }}
         formContext={formContext}
         {...elementBaseProps}
       />

package/src/functions/forms/get-element-props.ts

@@ -1,5 +1,5 @@
 import { ButtonElementSizeEnum, ButtonElementTypeEnum, ElementTypeEnum } from '../../enums'
-import { IButtonPropsBase, IDndLayoutElement, IPickerElementProps } from '../../types'
+import { IButtonPropsBase, IDndLayoutElement, IDatePickerElementProps } from '../../types'
 
 // since all the field elements have different type, this function is generalizing the types
 export const getElementGeneralizedProps = (props: Record<string, any> | undefined): Record<string, any> => ({
@@ -23,7 +23,7 @@ export const getPickerFieldsWithOriginalTz = (elements: { [key: string]: IDndLay
   Object.values(elements).reduce((curr: string[], el) => {
     if (
       [ElementTypeEnum.DatePicker, ElementTypeEnum.TimePicker].includes(el.elementType) &&
-      (el.props as IPickerElementProps)?.displayInOriginalTz
+      (el.props as IDatePickerElementProps)?.displayInOriginalTz
     )
       return [...curr, el.key]
 

package/src/functions/forms/index.ts

@@ -7,7 +7,7 @@ export * from './linked-form-joins'
 export * from './convert-number-into-words'
 export * from './deep-swap-form-ids'
 export * from './email-body-helpers'
-import { CancelToken } from 'axios'
+import axios, { CancelToken } from 'axios'
 import client from '../../api/client'
 import { renderData } from '..'
 import { translationStore } from '../../components/common/custom-hooks/use-translation.hook/store'
@@ -21,6 +21,7 @@ import {
   DataRenderTypeEnum,
   ElementTypeEnum,
   FieldElementOptionSourceEnum,
+  LOCAL_STORAGE_KEYS_ENUM,
   TemplateDataReplacementFieldTypesEnum,
   TranslationTextTypeEnum,
 } from '../../enums'
@@ -368,4 +369,25 @@ export const replaceTemplateReportAndUpload = async ({
 
 /** ---------------------------------------------------------------------------------------------------------  */
 
+export const extractNotFoundBlobNames = async (blobNames: string[]): Promise<string[]> => {
+  const baseUrl = import.meta.env.VITE_API_BASE_URL
+  const domain = localStorage.getItem(LOCAL_STORAGE_KEYS_ENUM.Domain)
+  const blobsNotFound: string[] = []
+  for await (const blobName of blobNames) {
+    if (!blobName) continue
+
+    const fetchBlobStatus = await axios
+      .get(`${baseUrl}/api/attachment/${domain}/${blobName}`)
+      .then((res) => res.status)
+      .catch((err) => err.status)
+
+    if (fetchBlobStatus !== 200) {
+      blobsNotFound.push(blobName)
+    }
+  }
+
+  console.log('BLOBS NOT FOUND:', blobsNotFound.join(', '))
+  return blobsNotFound
+}
+
 /** ---------------------------------------------------------------------------------------------------------  */

package/src/types/forms/layout-elements/index.ts

@@ -14,6 +14,7 @@ import { IValidationRule } from './validation'
 import { IFormLayoutElementConditions } from './conditions'
 import { IDataSanitization } from './sanitization'
 import { ReportPageBreakEnum } from '../../../enums/report.enum'
+import { IntRange } from 'rc-picker/lib/interface'
 import {
   IButtonElementProps,
   ICssStyle,
@@ -133,11 +134,11 @@ export type IRadioElementProps = IOptionElementProps_Base & {
 
 /** -------------------------------------------------------------------------------------------- */
 
-export interface IPickerElement extends BaseFormLayoutElement {
-  elementType: ElementTypeEnum.DatePicker | ElementTypeEnum.RangePicker | ElementTypeEnum.TimePicker
-  props: IPickerElementProps
+export interface IDatePickerElement extends BaseFormLayoutElement {
+  elementType: ElementTypeEnum.DatePicker | ElementTypeEnum.RangePicker
+  props: IDatePickerElementProps
 }
-export interface IPickerElementProps {
+export interface IDatePickerElementProps {
   hasNoLabel?: boolean
   allowClear?: boolean
   filter?: IFilterConfig
@@ -146,6 +147,20 @@ export interface IPickerElementProps {
 
 /** -------------------------------------------------------------------------------------------- */
 
+export interface ITimePickerElement extends BaseFormLayoutElement {
+  elementType: ElementTypeEnum.TimePicker
+  props: ITimePickerElementProps
+}
+export interface ITimePickerElementProps {
+  use12Hours?: boolean
+  includeSeconds?: boolean
+  hourStep?: IntRange<1, 23>
+  minuteStep?: IntRange<1, 59>
+  secondStep?: IntRange<1, 59>
+}
+
+/** -------------------------------------------------------------------------------------------- */
+
 export interface IFileUploadElement extends BaseFormLayoutElement {
   elementType: ElementTypeEnum.FileUpload
   props: IFileUploadElementProps

package/src/types/index.ts

@@ -18,7 +18,7 @@ import {
   ILanguageSelector,
   IListElement,
   INumberInputElement,
-  IPickerElement,
+  IDatePickerElement,
   IPlaceholderElement,
   IRadioElement,
   IReadFieldDataElement,
@@ -31,6 +31,7 @@ import {
   ITextElement,
   IUserPasswordElement,
   IUserRoleElement,
+  ITimePickerElement,
 } from './forms'
 
 export * from './companies'
@@ -70,7 +71,8 @@ export type IDndLayoutElement =
   | ISearchElement
   | ISelectElement
   | IRadioElement
-  | IPickerElement
+  | IDatePickerElement
+  | ITimePickerElement
   | IDividerElement
   | IReadFieldDataElement
   | IBooleanElement