robobyte-front-builder 1.0.17 → 1.0.21

package/src/services/builderHelper/thresholdEngine.js

@@ -0,0 +1,77 @@
+/**
+ * Shared threshold evaluation engine.
+ *
+ * A threshold rule:
+ *   { operator: '<' | '<=' | '>' | '>=' | '==' | '!=' | 'between',
+ *     value: number,
+ *     value2: number,   // only used for 'between'
+ *     color: string,    // MUI palette key or CSS color
+ *     label: string,    // optional override label
+ *     bg: string,       // optional background override
+ *   }
+ *
+ * evaluateThreshold returns the first matching rule (or null).
+ * resolveColor maps a MUI palette key to a CSS color.
+ */
+
+const MUI_COLOR_MAP = {
+  // semantic
+  error:    { color: '#d32f2f', bg: '#ffebee' },
+  warning:  { color: '#e65100', bg: '#fff3e0' },
+  success:  { color: '#2e7d32', bg: '#e8f5e9' },
+  info:     { color: '#0277bd', bg: '#e1f5fe' },
+  primary:  { color: '#1565c0', bg: '#e3f2fd' },
+  secondary:{ color: '#6a1b9a', bg: '#f3e5f5' },
+  // extras
+  purple:   { color: '#7b1fa2', bg: '#f3e5f5' },
+  pink:     { color: '#c2185b', bg: '#fce4ec' },
+  teal:     { color: '#00695c', bg: '#e0f2f1' },
+  cyan:     { color: '#00838f', bg: '#e0f7fa' },
+  orange:   { color: '#e64a19', bg: '#fbe9e7' },
+  indigo:   { color: '#283593', bg: '#e8eaf6' },
+  default:  { color: 'inherit', bg: 'transparent' },
+}
+
+/** Resolve a color string: MUI key → { color, bg } or pass-through. */
+export function resolveMuiColor(key) {
+  return MUI_COLOR_MAP[key] ?? { color: key ?? 'inherit', bg: 'transparent' }
+}
+
+/** Evaluate a value against a threshold list. Returns the first matching rule or null. */
+export function evaluateThreshold(value, thresholds) {
+  if (!Array.isArray(thresholds) || !thresholds.length) return null
+  const v = Number(value)
+  for (const rule of thresholds) {
+    if (matches(v, rule)) return rule
+  }
+  return null
+}
+
+function matches(v, rule) {
+  const a = Number(rule.value)
+  const b = Number(rule.value2)
+  switch (rule.operator) {
+    case '<':       return v < a
+    case '<=':      return v <= a
+    case '>':       return v > a
+    case '>=':      return v >= a
+    case '==':      return v === a
+    case '!=':      return v !== a
+    case 'between': return v >= a && v <= b
+    default:        return false
+  }
+}
+
+/**
+ * Convenience: returns { color, bg } for a value+thresholds pair.
+ * Falls back to { color: 'inherit', bg: 'transparent' }.
+ */
+export function thresholdColors(value, thresholds) {
+  const rule = evaluateThreshold(value, thresholds)
+  if (!rule) return { color: 'inherit', bg: 'transparent' }
+  const base = resolveMuiColor(rule.color)
+  return {
+    color: rule.colorOverride ?? base.color,
+    bg:    rule.bg            ?? base.bg,
+  }
+}

package/src/services/builderHelper/tree.js

@@ -10,6 +10,37 @@ export function findNode(node, targetId) {
   return null
 }
 
+/**
+ * Find a node anywhere in the schema — searches both root tree and dialogs array.
+ * Returns { node, location: 'root' | 'dialog', dialogId? }
+ */
+export function findNodeAnywhere(schema, targetId) {
+  const inRoot = findNode(schema.root, targetId)
+  if (inRoot) return { node: inRoot, location: 'root' }
+
+  for (const dialog of schema.dialogs ?? []) {
+    const inDialog = findNode(dialog, targetId)
+    if (inDialog) return { node: inDialog, location: 'dialog', dialogId: dialog.id }
+  }
+
+  return { node: null, location: null }
+}
+
+/**
+ * Update a node anywhere in the schema — patches root tree or the matching dialog.
+ */
+export function updateNodeAnywhere(schema, nodeId, patch, location, dialogId) {
+  if (location === 'dialog') {
+    return {
+      ...schema,
+      dialogs: (schema.dialogs ?? []).map(d =>
+        d.id === dialogId ? updateNodeInTree(d, nodeId, patch) : d
+      ),
+    }
+  }
+  return { ...schema, root: updateNodeInTree(schema.root, nodeId, patch) }
+}
+
 export function removeFromTree(node, targetId) {
   if (!node.children) return node
 

package/src/services/components/agGridAutoComplete.js

@@ -9,10 +9,10 @@ import React, {
 import Autocomplete from '@mui/material/Autocomplete';
 import TextField from '@mui/material/TextField';
 import Chip from '@mui/material/Chip';
-import {SettingsConsumer} from 'src/@core/contexts/settingsContext';
-import ThemeComponent from 'src/@core/theme/ThemeComponent';
+import { ThemeProvider, createTheme, lighten, styled } from '@mui/material/styles';
 import moment from 'moment';
-import {lighten, styled} from '@mui/material/styles';
+
+const defaultTheme = createTheme();
 import izColors from 'src/configs/izColors.json';
 
 // Utility for nested value access
@@ -112,9 +112,7 @@ const AutocompleteEditor = (props, ref) => {
   };
 
   return (
-    <SettingsConsumer>
-      {({settings}) => (
-        <ThemeComponent settings={settings}>
+    <ThemeProvider theme={defaultTheme}>
           <Autocomplete
             multiple={!isSingle}
             size="small"
@@ -163,9 +161,7 @@ const AutocompleteEditor = (props, ref) => {
               ))
             }
           />
-        </ThemeComponent>
-      )}
-    </SettingsConsumer>
+    </ThemeProvider>
   );
 };
 

package/src/services/config.js

@@ -39,9 +39,17 @@ const _config = {
 
   // Default token reader — reads the key Mazajk (and most host apps) use.
   // Override via configureRoboByte({ getAccessToken }) or via the provider prop.
+  //
+  // Resolution order:
+  //   1. localStorage 'accessToken'  (normal auth flow — takes priority)
+  //   2. NEXT_PUBLIC_DEV_ACCESS_TOKEN env var  (dev convenience, .env.local only)
   getAccessToken: () => {
     if (typeof window === 'undefined') return null
-    return localStorage.getItem('accessToken') ?? null
+    return (
+      localStorage.getItem('accessToken') ??
+      (process.env.NODE_ENV === 'development' ? process.env.NEXT_PUBLIC_DEV_ACCESS_TOKEN : null) ??
+      null
+    )
   },
 
   // Default user reader — parses the JSON object Mazajk stores in localStorage.

package/src/services/globalStore.js

@@ -0,0 +1,80 @@
+/**
+ * globalStore — cross-route reactive data store.
+ *
+ * Lives at module scope so it survives Next.js client-side navigations.
+ * Any page, dialog, renderer, or Calculation function can read and write it.
+ *
+ * ── In action code (Calculation functions) ───────────────────────────────────
+ *
+ *   // Read current global state
+ *   console.log(globalData.selectedUser)
+ *
+ *   // Write (like setData but global — persists across route changes)
+ *   setGlobalData(prev => ({ ...prev, selectedUser: clickedItem }))
+ *   setGlobalData({ theme: 'dark', locale: 'en' })   // full replace also works
+ *
+ *   // Then navigate — globalData.selectedUser is still there on the next page
+ *   router.push('/user-detail')
+ *
+ * ── In React components ───────────────────────────────────────────────────────
+ *
+ *   import { useGlobalStore } from 'src/hooks/useGlobalStore'
+ *
+ *   function MyRenderer() {
+ *     const { globalData, setGlobalData } = useGlobalStore()
+ *     return <div>{globalData.selectedUser?.name}</div>
+ *   }
+ */
+
+// ── Internal state ────────────────────────────────────────────────────────────
+
+let _state = {}
+const _listeners = new Set()
+
+// ── Public API ────────────────────────────────────────────────────────────────
+
+/**
+ * Returns a snapshot of the current global state.
+ * This is synchronous and safe to call from anywhere, including jsExecutor.
+ * @returns {object}
+ */
+export function getGlobalData() {
+  return _state
+}
+
+/**
+ * Updates the global state.
+ * Accepts either a plain object (shallow-merged) or an updater function
+ * that receives the previous state and returns the next state.
+ *
+ * All subscribed React components are notified synchronously so they
+ * re-render with the new values.
+ *
+ * @param {object | ((prev: object) => object)} updater
+ */
+export function setGlobalData(updater) {
+  const next = typeof updater === 'function' ? updater(_state) : updater
+  _state = next && typeof next === 'object' ? { ..._state, ...next } : _state
+  _listeners.forEach(fn => fn(_state))
+}
+
+/**
+ * Subscribe to global state changes.
+ * Returns an unsubscribe function — call it in useEffect cleanup.
+ *
+ * @param {(state: object) => void} listener
+ * @returns {() => void} unsubscribe
+ */
+export function subscribeGlobal(listener) {
+  _listeners.add(listener)
+  return () => _listeners.delete(listener)
+}
+
+/**
+ * Resets the global store to an empty object.
+ * Useful for logout / session reset.
+ */
+export function resetGlobalData() {
+  _state = {}
+  _listeners.forEach(fn => fn(_state))
+}

package/src/services/helper/multiSelectEditor.js

@@ -3,12 +3,12 @@ import Autocomplete from '@mui/material/Autocomplete';
 import TextField from '@mui/material/TextField';
 import Chip from '@mui/material/Chip';
 import { createRoot } from 'react-dom/client';
-import ThemeComponent from 'src/@core/theme/ThemeComponent';
+import { ThemeProvider, createTheme, darken, lighten, styled } from "@mui/material/styles";
 import moment from 'moment';
 import Typography from "@mui/material/Typography";
-import { darken, lighten, styled } from "@mui/material/styles";
 import izColors from "src/configs/izColors.json"
-import { SettingsConsumer } from "src/@core/contexts/settingsContext";
+
+const defaultTheme = createTheme();
 const AutocompleteEditor = React.memo(
   forwardRef((props, ref) => {
     // Initialize as an array for multi-selection.
@@ -122,9 +122,7 @@ const AutocompleteEditor = React.memo(
     });
 
     return (
-      <SettingsConsumer>
-        {({ settings }) => (
-          <ThemeComponent settings={settings}>
+      <ThemeProvider theme={defaultTheme}>
             <Autocomplete
               multiple={!props.isSingle === true}
               size="small"
@@ -179,9 +177,7 @@ const AutocompleteEditor = React.memo(
                 ))
               }
             />
-          </ThemeComponent>
-        )}
-      </SettingsConsumer>
+      </ThemeProvider>
     );
   })
 );

package/src/services/helper/multiSelectEditorByBuilder.js

@@ -0,0 +1,241 @@
+import React, {forwardRef, useEffect, useImperativeHandle, useRef, useState} from 'react';
+import Autocomplete from '@mui/material/Autocomplete';
+import TextField from '@mui/material/TextField';
+import Chip from '@mui/material/Chip';
+import {createRoot} from 'react-dom/client';
+import { ThemeProvider, createTheme, darken, lighten, styled } from "@mui/material/styles";
+import moment from 'moment';
+import Typography from "@mui/material/Typography";
+import izColors from "src/configs/izColors.json"
+
+const defaultTheme = createTheme();
+
+const AutocompleteEditor = React.memo(
+  forwardRef((props, ref) => {
+    // Initialize as an array for multi-selection.
+    const [selectedValue, setSelectedValue] = useState(props.isSingle ? null : []);
+    // Initialize options from props.
+    const [options, setOptions] = useState(props.options || []);
+    const [searchTerm, setSearchTerm] = useState('');
+    const [debouncedSearchTerm, setDebouncedSearchTerm] = useState(searchTerm);
+    const [loading, setLoading] = useState(false);
+    const inputRef = useRef(null);
+
+    // If an asyncFetchOptions function is provided via cellEditorParams, call it immediately on mount.
+    useEffect(() => {
+      if (props.asyncFetchOptions) {
+        setLoading(true);
+        props.asyncFetchOptions()
+          .then(fetchedOptions => {
+            setOptions(fetchedOptions);
+          })
+          .finally(() => {
+            setLoading(false);
+          });
+      }
+    }, [props.asyncFetchOptions]);
+
+    // Debounce searchTerm changes.
+    useEffect(() => {
+      const handler = setTimeout(() => {
+        setDebouncedSearchTerm(searchTerm);
+      }, 300);
+      return () => clearTimeout(handler);
+    }, [searchTerm]);
+
+    // Optionally, if you want to refetch options on debounced search term changes,
+    // call the asyncFetchOptions function with the search term as argument.
+    useEffect(() => {
+      if (props.asyncFetchOptions) {
+        setLoading(true);
+        // If your asyncFetchOptions function accepts a search term, pass debouncedSearchTerm.
+        props.asyncFetchOptions(debouncedSearchTerm)
+          .then(fetchedOptions => {
+            setOptions(fetchedOptions);
+          })
+          .finally(() => {
+            setLoading(false);
+          });
+      }
+    }, [debouncedSearchTerm, props.asyncFetchOptions]);
+
+    const handleChange = (event, value) => {
+      setSelectedValue(value);
+    };
+
+    const handleBlur = () => {
+      props.api.stopEditing();
+    };
+
+    // Utility: Get nested property if needed.
+    function getNestedProperty(obj, path) {
+      if (!Array.isArray(path)) {
+        return path.split('.').reduce((acc, part) => acc && acc[part], obj);
+      } else {
+        let result;
+        let i = 0;
+        path.forEach((p) => {
+          if (i === 0) result = p.split('.').reduce((acc, part) => acc && acc[part], obj);
+          else result = result + ' - ' + p.split('.').reduce((acc, part) => acc && acc[part], obj);
+          i++;
+        });
+        return result;
+      }
+    }
+
+    const formatValueByType = (value, type) => {
+      let result = value;
+      if (type === 'datetime') result = moment(result).format('L');
+      return result;
+    };
+
+    // Update selected value when props.value changes.
+    useEffect(() => {
+      if (props.value) {
+        setSelectedValue(Array.isArray(props.value) ? props.value : []);
+      }
+    }, [props.value]);
+
+
+    useImperativeHandle(ref, () => {
+      try {
+
+        return ({
+          getValue: () => props?.targetValue != null ? getNestedProperty(selectedValue, props?.targetValue) : selectedValue,
+        })
+      } catch (e) {
+        console.log(e);
+      }
+
+    });
+
+    useEffect(() => {
+      if (inputRef.current) {
+        inputRef.current.focus();
+      }
+    }, []);
+
+    const GroupHeader = styled('div')(({theme}) => ({
+      position: 'sticky',
+      top: '-8px',
+      padding: '4px 10px',
+      color: theme.palette.primary.main,
+      backgroundColor: lighten(izColors.grey, 0.70),
+    }));
+
+    const GroupItems = styled('ul')({
+      padding: 0,
+    });
+
+    return (
+      <ThemeProvider theme={defaultTheme}>
+            <Autocomplete
+              multiple={!props.isSingle === true}
+              size="small"
+              loading={loading}
+              options={options}
+              groupBy={option => {
+                return props.groupByField == null ? null : getNestedProperty(option, props.groupByField);
+              }}
+              renderGroup={(params) => (
+                <li key={params.key}>
+                  {props.groupByField && <GroupHeader>{params.group}</GroupHeader>}
+                  <GroupItems>{params.children}</GroupItems>
+                </li>
+              )}
+              onBlur={handleBlur}
+              disableCloseOnSelect={!props.isSingle === true}
+              isOptionEqualToValue={(option, value) => option?.id === value?.id}
+              getOptionLabel={(option) => {
+                let result;
+
+                if (Array.isArray(props.fieldName)) {
+                  result = props.fieldName
+                    .map((field) => getNestedProperty(option, field))
+                    .filter(Boolean)
+                    .join(" - ");
+                } else {
+                  result = props.fieldName == null
+                    ? option?.name
+                    : getNestedProperty(option, props.fieldName);
+                }
+
+                if (props.type != null) {
+                  result = formatValueByType(result, props.type);
+                }
+
+                return result;
+              }}
+              value={selectedValue}
+              onChange={handleChange}
+              renderInput={(params) => {
+                params.InputProps.disableUnderline = true;
+                return (
+                  <TextField
+                    autoFocus
+                    {...params}
+                    variant="standard"
+                    size="small"
+                    hiddenLabel
+                    onChange={(e) => setSearchTerm(e.target.value)}
+                    inputRef={inputRef}
+                  />
+                );
+              }}
+              renderTags={(value, getTagProps) =>
+                value.map((option, index) => (
+                  <Chip
+                    key={option?.id}
+                    label={option?.name}
+                    {...getTagProps({index})}
+                    onMouseDown={(e) => {
+                      e.stopPropagation();
+                      e.preventDefault();
+                    }}
+                  />
+                ))
+              }
+            />
+      </ThemeProvider>
+    );
+  })
+);
+
+export class MultiSelectEditorWrapper {
+  constructor() {
+    this.eInput = document.createElement('div');
+    this.eInput.style = 'width: 100%; height: 100%;';
+  }
+
+  init(params) {
+    this.params = params;
+    this.root = createRoot(this.eInput);
+    this.root.render(
+      <AutocompleteEditor {...params} ref={(input) => (this.reactComponent = input)}/>
+    );
+  }
+
+  getGui() {
+    return this.eInput;
+  }
+
+  afterGuiAttached() {
+    // Optionally focus after attachment.
+  }
+
+  getValue() {
+    return this.reactComponent.getValue();
+  }
+
+  destroy() {
+    if (this.root) {
+      setTimeout(() => {
+        this.root.unmount();
+      }, 0);
+    }
+  }
+
+  isPopup() {
+    return false;
+  }
+}

package/src/services/helper/reportSessionHelper.js

@@ -0,0 +1,83 @@
+
+const STORAGE_KEY_PREFIX = 'RV_SESSION_';
+const EXPIRATION_DAYS = 7;
+
+export const generateSessionId = () => {
+  const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+  let result = '';
+  for (let i = 0; i < 6; i++) {
+    result += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return result;
+};
+
+export const saveReportSession = (payload) => {
+  if (typeof window === 'undefined') return null;
+
+  const sessionId = generateSessionId();
+  const data = {
+    payload,
+    timestamp: Date.now()
+  };
+
+  try {
+    localStorage.setItem(`${STORAGE_KEY_PREFIX}${sessionId}`, JSON.stringify(data));
+    return sessionId;
+  } catch (e) {
+    console.error('Failed to save report session to localStorage', e);
+    return null;
+  }
+};
+
+export const getReportSession = (sessionId) => {
+  if (typeof window === 'undefined' || !sessionId) return null;
+
+  try {
+    const stored = localStorage.getItem(`${STORAGE_KEY_PREFIX}${sessionId}`);
+    if (!stored) return null;
+
+    const { payload, timestamp } = JSON.parse(stored);
+
+    // Check if expired
+    const now = Date.now();
+    const sevenDaysInMs = EXPIRATION_DAYS * 24 * 60 * 60 * 1000;
+    if (now - timestamp > sevenDaysInMs) {
+      localStorage.removeItem(`${STORAGE_KEY_PREFIX}${sessionId}`);
+      return null;
+    }
+
+    return payload;
+  } catch (e) {
+    console.error('Failed to get report session from localStorage', e);
+    return null;
+  }
+};
+
+export const cleanupOldSessions = () => {
+  if (typeof window === 'undefined') return;
+
+  try {
+    const now = Date.now();
+    const sevenDaysInMs = EXPIRATION_DAYS * 24 * 60 * 60 * 1000;
+
+    for (let i = 0; i < localStorage.length; i++) {
+      const key = localStorage.key(i);
+      if (key && key.startsWith(STORAGE_KEY_PREFIX)) {
+        try {
+          const stored = localStorage.getItem(key);
+          if (stored) {
+            const { timestamp } = JSON.parse(stored);
+            if (now - timestamp > sevenDaysInMs) {
+              localStorage.removeItem(key);
+            }
+          }
+        } catch (e) {
+          // If parsing fails, it's probably corrupt, might as well remove it
+          localStorage.removeItem(key);
+        }
+      }
+    }
+  } catch (e) {
+    console.error('Failed to cleanup old report sessions', e);
+  }
+};