@solidstarters/solid-core-ui 1.1.62 → 1.1.64

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@solidstarters/solid-core-ui",
-  "version": "1.1.62",
+  "version": "1.1.64",
   "scripts": {
     "prebuild": "npm run copy-styles",
     "build": "tsc && tsc-alias",

package/src/components/core/common/SolidGlobalSearchElement.tsx

@@ -699,7 +699,6 @@ export const SolidGlobalSearchElement = forwardRef(({ viewData, handleApplyCusto
         </>
     );
 
-
     const [showOverlay, setShowOverlay] = useState(false);
 
     return (

package/src/components/core/filter/SolidSelectionDynamicFilterElement.tsx

@@ -17,7 +17,7 @@ export const SolidSelectionDynamicFilterElement = ({ value, updateInputs, index,
             offset: 0,
             limit: 10,
             query: event.query,
-            id: fieldMetadata.id
+            fieldId: fieldMetadata.id
         };
 
         const sdQs = qs.stringify(queryData, {

package/src/components/core/form/SolidFormView.tsx

@@ -59,6 +59,7 @@ export type SolidFormViewProps = {
     customCreateHandler?: any
     inlineCreateAutoSave?: boolean,
     customLayout?: any,
+    populateData?: any,
 };
 
 
@@ -150,7 +151,7 @@ const fieldFactory = (type: string, fieldContext: SolidFieldProps, setLightboxUr
 }
 
 // solidFieldsMetadata={solidFieldsMetadata} solidView={solidView}
-const SolidField = ({ formik, field, fieldMetadata, initialEntityData, solidFormViewMetaData, modelName, readOnly, viewMode, onChange, onBlur, setLightboxUrls, setOpenLightbox }: any) => {
+const SolidField = ({ formik, field, fieldMetadata, initialEntityData, solidFormViewMetaData, modelName, readOnly, viewMode, onChange, onBlur, populateData, setLightboxUrls, setOpenLightbox }: any) => {
     const fieldContext: SolidFieldProps = {
         // field metadata - coming from the field-metadata table.
         fieldMetadata: fieldMetadata,
@@ -166,6 +167,9 @@ const SolidField = ({ formik, field, fieldMetadata, initialEntityData, solidForm
         onChange: onChange,
         onBlur: onBlur
     }
+    if (populateData) {
+        fieldContext.populateData = populateData;
+    }
     const solidField = fieldFactory(fieldMetadata?.type, fieldContext, setLightboxUrls, setOpenLightbox);
 
     return solidField?.render(formik);
@@ -932,13 +936,14 @@ const SolidFormView = (params: SolidFormViewProps) => {
                             field={element}
                             formik={formik}
                             fieldMetadata={fieldMetadata}
-                            initialEntityData={solidFormViewData ? solidFormViewData.data : null}
+                            initialEntityData={solidFormViewData ? solidFormViewData.data : {}}
                             solidFormViewMetaData={solidFormViewMetaData}
                             modelName={params.modelName}
                             readOnly={readOnlyPermission}
                             viewMode={viewMode}
                             onChange={formFieldOnXXX}
                             onBlur={formFieldOnXXX}
+                            populateData={params.populateData}
                             setLightboxUrls={setLightboxUrls}
                             setOpenLightbox={setOpenLightbox}
                         />;

package/src/components/core/form/fields/ISolidField.tsx

@@ -11,7 +11,8 @@ export type SolidFieldProps = {
     readOnly?: any,
     viewMode? :any
     onChange?: any,
-    onBlur?: any
+    onBlur?: any,
+    populateData?: any
 };
 
 export type FormikObject = {
@@ -64,6 +65,6 @@ export type FormikObject = {
 export interface ISolidField {
     initialValue(): any;
     validationSchema(): Schema;
-    render(formik: FormikObject): React.JSX.Element;
+    render(formik: FormikObject): React.JSX.Element | null;
     updateFormData(value: any, formData: FormData): any;
 }

package/src/components/core/form/fields/SolidDateField.tsx

@@ -32,7 +32,7 @@ export class SolidDateField implements ISolidField {
     }
 
     validationSchema(): Schema {
-        let schema: Yup.DateSchema = Yup.date();
+        let schema: Yup.DateSchema<Date | null | undefined> = Yup.date();
         const fieldMetadata = this.fieldContext.fieldMetadata;
         const fieldLayoutInfo = this.fieldContext.field;
         const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;
@@ -40,6 +40,8 @@ export class SolidDateField implements ISolidField {
         // 1. required 
         if (fieldMetadata.required) {
             schema = schema.required(`${fieldLabel} is required.`);
+        } else {
+            schema = schema.nullable();
         }
         return schema;
     }

package/src/components/core/form/fields/SolidDateTimeField.tsx

@@ -32,7 +32,7 @@ export class SolidDateTimeField implements ISolidField {
     }
 
     validationSchema(): Schema {
-        let schema: Yup.DateSchema = Yup.date();
+        let schema: Yup.DateSchema<Date | null | undefined>  = Yup.date();
         const fieldMetadata = this.fieldContext.fieldMetadata;
         const fieldLayoutInfo = this.fieldContext.field;
         const fieldLabel = fieldLayoutInfo.attrs.label ?? fieldMetadata.displayName;
@@ -40,6 +40,8 @@ export class SolidDateTimeField implements ISolidField {
         // 1. required 
         if (fieldMetadata.required) {
             schema = schema.required(`${fieldLabel} is required.`);
+        } else {
+            schema = schema.nullable();
         }
         return schema;
     }

package/src/components/core/form/fields/relations/SolidRelationManyToOneField.tsx

@@ -3,7 +3,7 @@ import { createSolidEntityApi } from "@/redux/api/solidEntityApi";
 import { AutoComplete, AutoCompleteCompleteEvent } from "primereact/autocomplete";
 import { Message } from "primereact/message";
 import qs from "qs";
-import { useState } from "react";
+import { useState, useEffect } from "react";
 import * as Yup from 'yup';
 import { Schema } from "yup";
 import { FormikObject, ISolidField, SolidFieldProps } from "../ISolidField";
@@ -25,15 +25,22 @@ export class SolidRelationManyToOneField implements ISolidField {
     }
 
     initialValue(): any {
-
-        const manyToOneFieldData = this.fieldContext.data[this.fieldContext.field.attrs.name];
-        const fieldMetadata = this.fieldContext.fieldMetadata;
+        const manyToOneFieldData = this.fieldContext?.data[this.fieldContext?.field?.attrs?.name];
+        const fieldMetadata = this.fieldContext?.fieldMetadata;
         const userKeyField = fieldMetadata?.relationModel?.userKeyField?.name;
         const manyToOneColVal = manyToOneFieldData ? manyToOneFieldData[userKeyField] : '';
         if (manyToOneColVal) {
             return { label: manyToOneColVal || '', value: manyToOneFieldData?.id || '' };
         }
-        return {}
+        
+        if (this.fieldContext.populateData) {
+            const [key, value]: any = Object.entries(this.fieldContext.populateData)[0] || [];
+            if (key && value !== undefined) {
+                return { label: value.label, value: value.value };
+            }
+        }
+        
+        return {};
     }
 
     updateFormData(value: any, formData: FormData): any {
@@ -68,7 +75,19 @@ export class SolidRelationManyToOneField implements ISolidField {
         const readOnlyPermission = this.fieldContext.readOnly;
         const [visibleCreateRelationEntity, setvisibleCreateRelationEntity] = useState(false);
 
-        // auto complete specific code. 
+        useEffect(() => {
+            const newValue = this.initialValue();
+            if (this.fieldContext.populateData) {
+                formik.setFieldValue(fieldLayoutInfo.attrs.name, newValue);
+            }
+        }, [this.fieldContext.populateData]);
+
+        const isVisible = fieldLayoutInfo.attrs?.visible !== false && !this.fieldContext.populateData;
+
+        if (!isVisible) {
+            return null;
+        }
+
         const entityApi = createSolidEntityApi(fieldMetadata.relationCoModelSingularName);
         const { useLazyGetSolidEntitiesQuery } = entityApi;
         const [triggerGetSolidEntities] = useLazyGetSolidEntitiesQuery();

package/src/components/core/form/fields/relations/SolidRelationOneToManyField.tsx

@@ -68,6 +68,7 @@ export class SolidRelationOneToManyField implements ISolidField {
         const readOnlyPermission = this.fieldContext.readOnly;
         const pathname = usePathname();
         const lastPathSegment = pathname.split('/').pop();
+        const userKeyField: any = Object.entries(this.fieldContext.solidFormViewMetaData.data.solidFieldsMetadata).find(([_, value]: any) => value.isUserKey)?.[0];
 
         const handlePopupOpen = (id: any) => {
             const formviewparams = {
@@ -76,6 +77,7 @@ export class SolidRelationOneToManyField implements ISolidField {
                 embeded: true,
                 isCustomCreate: false,
                 customLayout: fieldLayoutInfo?.attrs?.inlineCreateLayout,
+                populateData: userKeyField ? {[userKeyField] : {label: this.fieldContext.data[userKeyField], value: this.fieldContext.data['id']}} : {},
                 modelName: camelCase(this.fieldContext.fieldMetadata.relationCoModelSingularName)
             }
             setformViewParams(formviewparams);
@@ -130,6 +132,7 @@ export class SolidRelationOneToManyField implements ISolidField {
                 embeded: true,
                 isCustomCreate: false,
                 customLayout: fieldLayoutInfo?.attrs?.inlineCreateLayout,
+                populateData: userKeyField ? {[userKeyField] : {label: this.fieldContext.data[userKeyField], value: this.fieldContext.data['id']}} : {},
                 modelName: camelCase(this.fieldContext.fieldMetadata.relationCoModelSingularName),
             }
             setformViewParams(formviewparams)

package/src/components/core/form/fields/widgets/SolidBooleanCheckboxFieldWidget.tsx

@@ -17,7 +17,6 @@ export const SolidBooleanFieldCheckboxWidget = ({ formik, fieldContext }: SolidB
     // Set default value to false on mount
     useEffect(() => {
         if (formik.values[fieldLayoutInfo.attrs.name] === undefined) {
-            console.log("Setting default value:", false);
             formik.setFieldValue(fieldLayoutInfo.attrs.name, false);
         }
     }, []);

package/src/components/core/kanban/SolidKanbanView.tsx

@@ -499,7 +499,7 @@ export const SolidKanbanView = (params: SolidKanbanViewParams) => {
 
 
   // Handle drag-and-drop functionality
-  const onDragEnd = (result: DropResult): void => {
+  const onDragEnd = async (result: DropResult): void => {
     const { source, destination } = result;
     if (!destination) return;
 

package/src/components/core/kanban/kanban-fields/SolidMediaSingleKanbanField.tsx

@@ -11,7 +11,8 @@ import { PDFSvg } from '@/components/Svg/PDFSvg';
 import Image from 'next/image';
 import FileImage from '../../../../resources/images/fileTypes/File.png'
 import { ExcelSvg } from '@/components/Svg/ExcelSvg';
-
+import MP3Image from '../../../../resources/images/fileTypes/Mp3.png'
+import MP4Image from '../../../../resources/images/fileTypes/Mp4.png'
 
 pdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.mjs`;
 
@@ -83,11 +84,53 @@ const SolidMediaSingleKanbanField = ({ solidKanbanViewMetaData, fieldMetadata, f
                     </a>
                 </div>
             )}
+
+            {mimeType && mimeType.includes("audio") && (
+                <div className='flex align-items-end gap-2 my-2' onClick={(e) => e.stopPropagation()}>
+                    <a href={url} download target="_blank" rel="noopener noreferrer">
+                        <Image
+                            src={MP3Image}
+                            alt={fileName}
+                            className="relative"
+                            height={50}
+                            width={50}
+                        />
+                    </a>
+                    <a href={url} download target="_blank" rel="noopener noreferrer" className='text-color flex align-items-start gap-2' style={{ textDecoration: 'none' }}>
+                        <p className="text-sm mb-1" style={{ wordWrap: 'break-word', overflowWrap: 'break-word' }}>
+                            {fileName}
+                        </p>
+                        <span className='pi pi-cloud-download'></span>
+                    </a>
+                </div>
+            )}
+            {mimeType && mimeType.includes("video") && (
+                <div className='flex align-items-end gap-2 my-2' onClick={(e) => e.stopPropagation()}>
+                    <a href={url} download target="_blank" rel="noopener noreferrer">
+                        <Image
+                            src={MP4Image}
+                            alt={fileName}
+                            className="relative"
+                            height={50}
+                            width={50}
+                        />
+                    </a>
+                    <a href={url} download target="_blank" rel="noopener noreferrer" className='text-color flex align-items-start gap-2' style={{ textDecoration: 'none' }}>
+                        <p className="text-sm mb-1" style={{ wordWrap: 'break-word', overflowWrap: 'break-word' }}>
+                            {fileName}
+                        </p>
+                        <span className='pi pi-cloud-download'></span>
+                    </a>
+                </div>
+            )}
+
             {mimeType &&
                 !mimeType.includes("image/") &&
                 !mimeType.includes("pdf") &&
                 !mimeType.includes("excel") &&
-                !mimeType.includes("spreadsheet") && (
+                !mimeType.includes("spreadsheet") &&
+                !mimeType.includes("audio") &&
+                !mimeType.includes("video") && (
                     <div className='flex align-items-end gap-2 my-2' onClick={(e) => e.stopPropagation()}>
                         <a href={url} download target="_blank" rel="noopener noreferrer">
                             <Image