@visns-studio/visns-components 4.4.5 → 4.4.6

package/components/crm/Fetch.jsx

@@ -16,6 +16,32 @@ const CustomFetch = (
         'Content-Type': 'application/json',
     };
 
+    const MAX_PAYLOAD_SIZE = 4.5 * 1024 * 1024; // 4.5MB in bytes
+
+    // Estimate headers size
+    const headersSize = JSON.stringify(headers).length;
+
+    // Estimate cookies size (if any)
+    const cookies = document.cookie;
+    const cookiesSize = cookies ? cookies.length : 0;
+
+    // Check payload size
+    const payloadSize = new Blob([JSON.stringify(formData)]).size;
+    const totalRequestSize = payloadSize + headersSize + cookiesSize;
+
+    console.info(totalRequestSize);
+
+    if (totalRequestSize > MAX_PAYLOAD_SIZE) {
+        const errorMessage =
+            'The request is too large. Please try again with a smaller payload.';
+        if (errorCallback) {
+            errorCallback(errorMessage);
+        } else {
+            toast.error(errorMessage);
+        }
+        return Promise.reject(new Error(errorMessage));
+    }
+
     if (method.toUpperCase() === 'PUT' || method.toUpperCase() === 'PATCH') {
         formData = {
             ...formData,

package/components/crm/Field.jsx

@@ -1,3 +1,5 @@
+import '../styles/global.css';
+
 import React, { useEffect, useRef, useState } from 'react';
 import DatePicker from 'react-datepicker';
 import _ from 'lodash';

package/components/crm/auth/Login.jsx

@@ -1,3 +1,5 @@
+import '../../styles/global.css';
+
 import React, { useState } from 'react';
 import { Link, useLocation } from 'react-router-dom';
 import Reveal from 'react-reveal/Reveal';

package/components/crm/auth/Reset.jsx

@@ -1,3 +1,5 @@
+import '../../styles/global.css';
+
 import React, { useState } from 'react';
 import Reveal from 'react-reveal/Reveal';
 import { toast } from 'react-toastify';

package/components/crm/auth/Verify.jsx

@@ -1,3 +1,5 @@
+import '../../styles/global.css';
+
 import React, { useState } from 'react';
 import { useNavigate, useParams } from 'react-router-dom';
 import { toast } from 'react-toastify';

package/components/crm/generic/GenericDetail.jsx

@@ -1,3 +1,5 @@
+import '../../styles/global.css';
+
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { Link, useParams } from 'react-router-dom';
 import moment from 'moment';

package/components/crm/generic/GenericIndex.jsx

@@ -1,3 +1,5 @@
+import '../../styles/global.css';
+
 import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { Outlet } from 'react-router-dom';
 import { toast } from 'react-toastify';

package/components/styles/global.css

@@ -1,3 +1,55 @@
+@import '@fontsource/barlow/index.css';
+@import '@fontsource/barlow/300.css';
+@import '@fontsource/barlow/700.css';
+
+/* Apply the crop mixin manually */
+.crop::before {
+    content: '';
+    display: block;
+    height: 0;
+    width: 0;
+    margin-top: calc((1 - 1.25) * 0.5em);
+}
+
+body {
+    font-size: 100%;
+    background: var(--tertiary-color);
+    font-family: 'Barlow', sans-serif;
+    font-weight: 300;
+    font-style: normal;
+    letter-spacing: 0.018em;
+}
+
+.loginbg {
+    background: var(--tertiary-color);
+}
+
+h1,
+h2,
+h3,
+h4,
+h5 {
+    font-size: 1.675em;
+    color: var(--primary-color);
+    font-weight: 700;
+    font-style: normal;
+}
+
+p {
+    font-weight: 300;
+    font-style: normal;
+    margin: 0 0 calc(var(--padding) / 2); /* Replace with actual padding value */
+    color: var(--paragraph-color);
+}
+
+p::before {
+    content: '';
+    display: block;
+    height: 0;
+    width: 0;
+    margin-top: calc((1 - 1.25) * 0.5em);
+}
+
 textarea,
 select,
 input[type]:not([type='search']):not([type='url']):not([type='hidden']):not(
@@ -18,7 +70,6 @@ input[type]:not([type='search']):not([type='url']):not([type='hidden']):not(
     background: rgba(white, 0.5);
     color: var(--paragraph-color);
     transition: border 0.15s linear;
-    font-size: 1.25em;
 
     &:hover {
         border: 1px solid var(--primary-color);

package/package.json

@@ -1,5 +1,6 @@
 {
     "dependencies": {
+        "@fontsource/barlow": "^5.0.13",
         "@inovua/reactdatagrid-community": "^5.10.2",
         "@nivo/bar": "^0.87.0",
         "@nivo/core": "^0.87.0",
@@ -13,7 +14,7 @@
         "axios": "^1.7.2",
         "dayjs": "^1.11.11",
         "file-saver": "^2.0.5",
-        "framer-motion": "^11.2.14",
+        "framer-motion": "^11.3.4",
         "html-react-parser": "^5.1.10",
         "lodash": "^4.17.21",
         "lodash.debounce": "^4.0.8",
@@ -57,7 +58,7 @@
         "react-dom": "^17.0.1"
     },
     "name": "@visns-studio/visns-components",
-    "version": "4.4.5",
+    "version": "4.4.6",
     "description": "Various packages to assist in the development of our Custom Applications.",
     "main": "index.js",
     "scripts": {