@visns-studio/visns-components 4.10.43 → 4.10.45

package/package.json

@@ -1,7 +1,7 @@
 {
     "dependencies": {
         "@emotion/is-prop-valid": "^1.3.1",
-        "@fontsource/barlow": "^5.1.0",
+        "@fontsource/barlow": "^5.1.1",
         "@inovua/reactdatagrid-community": "^5.10.2",
         "@inovua/reactdatagrid-enterprise": "^5.10.2",
         "@nivo/bar": "^0.88.0",
@@ -14,45 +14,45 @@
         "akar-icons": "^1.9.31",
         "array-move": "^4.0.0",
         "awesome-debounce-promise": "^2.1.0",
-        "axios": "^1.7.8",
+        "axios": "^1.7.9",
         "browser-image-compression": "^2.0.2",
         "dayjs": "^1.11.13",
-        "fabric": "^6.5.1",
+        "fabric": "^6.5.4",
         "file-saver": "^2.0.5",
-        "framer-motion": "^11.12.0",
-        "html-react-parser": "^5.1.18",
+        "framer-motion": "^11.16.0",
+        "html-react-parser": "^5.2.2",
         "lodash": "^4.17.21",
         "lodash.debounce": "^4.0.8",
         "moment": "^2.30.1",
-        "motion": "^11.12.0",
+        "motion": "^11.16.0",
         "numeral": "^2.0.6",
         "pluralize": "^8.0.0",
         "quill-image-uploader": "^1.3.0",
         "react-color": "^2.19.3",
         "react-confirm-alert": "^3.0.6",
         "react-copy-to-clipboard": "^5.1.0",
-        "react-datepicker": "^7.5.0",
+        "react-datepicker": "^7.6.0",
         "react-dropzone": "^14.3.5",
         "react-grid-gallery": "^1.0.1",
-        "react-number-format": "^5.4.2",
+        "react-number-format": "^5.4.3",
         "react-password-strength-bar": "^0.4.1",
         "react-promise-tracker": "^2.1.1",
         "react-quill": "^2.0.0",
         "react-reveal": "^1.2.2",
-        "react-router-dom": "^6.27.0",
-        "react-select": "^5.8.3",
-        "react-signature-pad-wrapper": "^4.0.4",
+        "react-router-dom": "^6.28.1",
+        "react-select": "^5.9.0",
+        "react-signature-pad-wrapper": "^4.1.0",
         "react-slugify": "^4.0.1",
         "react-sortable-hoc": "^2.0.0",
-        "react-to-print": "^3.0.2",
+        "react-to-print": "^3.0.4",
         "react-toastify": "^10.0.6",
         "react-toggle": "^4.1.3",
         "react-tooltip": "^5.28.0",
-        "react-window": "^1.8.10",
+        "react-window": "^1.8.11",
         "reactjs-popup": "^2.0.6",
         "style-loader": "^4.0.0",
         "truncate": "^3.0.0",
-        "uuid": "^11.0.3",
+        "uuid": "^11.0.4",
         "validator": "^13.12.0",
         "vite": "^5.4.11",
         "yarn": "^1.22.22"
@@ -61,7 +61,7 @@
         "@babel/core": "^7.26.0",
         "@babel/plugin-transform-runtime": "^7.25.9",
         "@babel/preset-env": "^7.26.0",
-        "@babel/preset-react": "^7.25.9",
+        "@babel/preset-react": "^7.26.3",
         "babel-loader": "^9.2.1",
         "copy-webpack-plugin": "^12.0.2",
         "css-loader": "^7.1.2",
@@ -69,15 +69,15 @@
         "mini-css-extract-plugin": "^2.9.2",
         "react": "^18.3.1",
         "react-dom": "^18.3.1",
-        "sass": "^1.81.0",
-        "sass-loader": "^16.0.3"
+        "sass": "^1.83.1",
+        "sass-loader": "^16.0.4"
     },
     "peerDependencies": {
         "react": "^17.0.0 || ^18.0.0",
         "react-dom": "^17.0.0 || ^18.0.0"
     },
     "name": "@visns-studio/visns-components",
-    "version": "4.10.43",
+    "version": "4.10.45",
     "description": "Various packages to assist in the development of our Custom Applications.",
     "main": "src/index.js",
     "files": [

package/src/components/crm/DataGrid.jsx

@@ -94,6 +94,7 @@ const loadData = async (
                         id: identifier,
                         value: fv.value,
                         operator: fv.operator,
+                        whereHas: fv.whereHas || [],
                     });
                 }
             } else {
@@ -2638,6 +2639,7 @@ const DataGrid = forwardRef(
                                 name: filterName,
                                 operator: column.filter.operator,
                                 type: column.filter.type,
+                                whereHas: column.filter.whereHas || [],
                                 value: filterValue,
                                 reset: column.filter.reset
                                     ? column.filter.reset

package/src/components/crm/QrCode.jsx

@@ -1,11 +1,12 @@
 import { useEffect, useRef, useState } from 'react';
-import ReactToPrint from 'react-to-print';
+import { useReactToPrint } from 'react-to-print';
 
 import CustomFetch from './Fetch';
 import styles from './styles/QrCode.module.scss';
 
 const QrCode = ({ config, dataId }) => {
-    const printComponentRef = useRef();
+    const contentRef = useRef(null);
+    const reactToPrintFn = useReactToPrint({ contentRef });
     const [qrCodeData, setQrCodeData] = useState({
         logo: '',
         qrCode: '',
@@ -26,9 +27,13 @@ const QrCode = ({ config, dataId }) => {
         fetchQrCode(config);
     }, []);
 
+    useEffect(() => {
+        console.info(qrCodeData);
+    }, [qrCodeData]);
+
     return (
         <>
-            <div className={styles.gridtxt} ref={printComponentRef}>
+            <div className={styles.gridtxt} ref={contentRef}>
                 {qrCodeData.logo && qrCodeData.logo !== '' && (
                     <ul className={styles.customer__overview}>
                         <li
@@ -52,7 +57,7 @@ const QrCode = ({ config, dataId }) => {
                             textAlign: 'center',
                         }}
                     >
-                        {qrCodeData.title}
+                        {qrCodeData.title || ''}
                     </li>
                 </ul>
                 <ul className={styles.customer__overview}>
@@ -71,10 +76,9 @@ const QrCode = ({ config, dataId }) => {
                 </ul>
             </div>
             <div className={styles.polActions}>
-                <ReactToPrint
-                    trigger={() => <button className="btn">Print</button>}
-                    content={() => printComponentRef.current}
-                />
+                <button className={styles.btn} onClick={() => reactToPrintFn()}>
+                    Print
+                </button>
             </div>
         </>
     );

package/src/components/crm/generic/GenericAuth.jsx

@@ -51,8 +51,12 @@ const GenericAuth = ({
     const updateAuthStatus = async () => {
         try {
             const { data } = await CustomFetch('/ajax/user/profile', 'GET');
-            setUserProfile(data);
-            setIsAuthenticated(true);
+
+            if (data && data.id) {
+                setUserProfile(data);
+                setIsAuthenticated(true);
+            }
+
             setIsLoading(false);
 
             if (location.pathname.split('/')[1] === 'login') {

package/src/components/crm/generic/GenericIndex.jsx

@@ -4,6 +4,7 @@ import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { Outlet } from 'react-router-dom';
 import { toast } from 'react-toastify';
 import { saveAs } from 'file-saver';
+import parse from 'html-react-parser';
 import _ from 'lodash';
 import moment from 'moment';
 
@@ -387,7 +388,7 @@ function GenericIndex({
                                 : styles.crmtitleSimple
                         }`}
                     >
-                        <h1>{setting.page?.title}</h1>
+                        <h1>{parse(setting.page?.title)}</h1>
                         <div className={styles.titleInfo}>
                             <span>
                                 [<strong>{total}</strong> Total{' '}

package/src/components/crm/styles/QrCode.module.scss

@@ -85,3 +85,21 @@
         margin: 0 0.15em;
     }
 }
+
+.btn {
+    width: max-content;
+    display: inline-block;
+    position: relative;
+    padding: 0.65rem 1rem;
+    cursor: pointer;
+    font-size: 1rem;
+    color: var(--tertiary-color);
+    text-decoration: none;
+    overflow: hidden;
+    background: var(--primary-color);
+    border: 1px solid rgba(var(--primary-color--rgb), 1.1);
+    border-radius: var(--br);
+    outline: none;
+    transition: all 0.2s cubic-bezier(0.85, 0, 0.15, 1) 0s;
+    font-size: 1.25em;
+}