ui-soxo-bootstrap-core 2.6.39 → 2.6.40-dev.1

package/core/models/roles/components/role-add/role-add.js

@@ -1,15 +1,14 @@
 import React, { useState, useEffect, useContext } from 'react';
 import { useLocation, useParams } from 'react-router-dom';
-import { Skeleton, Typography, message, Form, Input, Collapse, Checkbox, Tag } from 'antd';
+import { Skeleton, Typography, message, Form, Input } from 'antd';
 import { GlobalContext } from './../../../../lib';
-import { Button } from './../../../../lib';
 import { ModelsAPI, PagesAPI, RolesAPI, MenusAPI } from '../../..';
+import MenuTree from './menu-tree';
 import './role-add.scss';
 
 const { Title } = Typography;
-const { Panel } = Collapse;
 
-const RoleAdd = ({ model, callback, edit, formContent = {}, match, additional_queries = [] }) => {
+const RoleAdd = ({ model, callback, edit, formContent = {}, match, additional_queries = [], onSubmittingChange, formRef }) => {
   let mode = 'Add';
   if (formContent.id) mode = 'Edit';
   else if (formContent.copy) mode = 'copy';
@@ -31,8 +30,10 @@ const RoleAdd = ({ model, callback, edit, formContent = {}, match, additional_qu
 
   const isEdit = !!(formContent.id || formContent.copy);
   const [initialLoading, setInitialLoading] = useState(isEdit);
-  const [loading, setLoading] = useState(false);
   const [form] = Form.useForm();
+
+  // expose the form instance so the Drawer footer Save button can submit it
+  if (formRef) formRef.current = form;
   const [pages, setPages] = useState([]);
   const [models, setModels] = useState([]);
   const [menuList, setMenuList] = useState([]);
@@ -43,6 +44,9 @@ const RoleAdd = ({ model, callback, edit, formContent = {}, match, additional_qu
   // Selected menus (array of IDs)
   const [selectedMenus, setSelectedMenus] = useState([]);
 
+  // Search term for filtering the menu list
+  const [menuSearch, setMenuSearch] = useState('');
+
   const location = useLocation();
   const query = new URLSearchParams(location.search);
   let step = parseInt(query.get('step')) || 1;
@@ -97,40 +101,28 @@ const RoleAdd = ({ model, callback, edit, formContent = {}, match, additional_qu
     setSelectedMenus((prev) => (checked ? [...prev, id] : prev.filter((m) => m !== id)));
   };
 
-  // Submit handler
-  //   const onSubmit = (values) => {
-  //     setLoading(true);
-
-  //     const payload = {
-  //       ...values,
-  //       menu_ids
-  // : selectedMenus,
-  //       attributes: JSON.stringify(values.attributes || {}),
-  //     };
-
-  //     if (formContent.id) {
-  //       RolesAPI.updateRole({ id: formContent.id, formBody: payload })
-  //         .then(() => {
-  //           message.success('Role Updated');
-  //           setLoading(false);
-  //           callback();
-  //         })
-  //         .catch(() => setLoading(false));
-  //     } else {
-  //       additional_queries.forEach(({ field, value }) => {
-  //         payload[field] = value;
-  //       });
-  //       RolesAPI.createRole(payload)
-  //         .then(() => {
-  //           message.success('Role Added');
-  //           setLoading(false);
-  //           callback();
-  //         })
-  //         .catch(() => setLoading(false));
-  //     }
-  //   };
+  // Recursively filter menus by caption. A menu is kept if its caption matches
+  // the search term, or if any of its descendants match (ancestors are kept so
+  // the matching child stays reachable).
+  const filterMenus = (menus, term) => {
+    if (!term) return menus;
+    const lower = term.toLowerCase();
+
+    return menus.reduce((acc, menu) => {
+      const children = filterMenus(menu.sub_menus || [], term);
+      const selfMatch = (menu.caption || '').toLowerCase().includes(lower);
+
+      if (selfMatch || children.length > 0) {
+        acc.push({ ...menu, sub_menus: children });
+      }
+      return acc;
+    }, []);
+  };
+
+  const filteredMenuList = filterMenus(menuList, menuSearch);
+
   const onSubmit = async (values) => {
-    setLoading(true);
+    onSubmittingChange?.(true);
 
     // Find menus that were originally selected but now deselected
     const deselectedMenus = originalMenus.filter((id) => !selectedMenus.includes(id));
@@ -159,7 +151,7 @@ const RoleAdd = ({ model, callback, edit, formContent = {}, match, additional_qu
     } catch (err) {
       // message.error('Something went wrong');
     } finally {
-      setLoading(false);
+      onSubmittingChange?.(false);
     }
   };
 
@@ -194,6 +186,7 @@ const RoleAdd = ({ model, callback, edit, formContent = {}, match, additional_qu
                   display: 'flex',
                   justifyContent: 'space-between',
                   alignItems: 'center',
+                  gap: 16,
                   marginBottom: 16,
                 }}
               >
@@ -204,14 +197,20 @@ const RoleAdd = ({ model, callback, edit, formContent = {}, match, additional_qu
                   <p style={{ color: '#999', marginBottom: 0 }}>Choose menus and set permissions</p>
                 </div>
 
-                <Form.Item style={{ marginBottom: 0 }}>
-                  <Button loading={loading} htmlType="submit" type="primary">
-                    Save
-                  </Button>
-                </Form.Item>
+                <Input.Search
+                  allowClear
+                  placeholder="Search menus"
+                  value={menuSearch}
+                  onChange={(e) => setMenuSearch(e.target.value)}
+                  style={{ maxWidth: 260 }}
+                />
               </div>
 
-              <MenuTree menus={menuList} selectedMenus={selectedMenus} toggleMenu={toggleMenu} />
+              {filteredMenuList.length > 0 ? (
+                <MenuTree menus={filteredMenuList} selectedMenus={selectedMenus} toggleMenu={toggleMenu} searchActive={!!menuSearch} />
+              ) : (
+                <p style={{ color: '#999', textAlign: 'center', padding: '16px 0' }}>No menus found</p>
+              )}
             </div>
           )}
         </Form>
@@ -221,125 +220,3 @@ const RoleAdd = ({ model, callback, edit, formContent = {}, match, additional_qu
 };
 
 export default RoleAdd;
-
-// ------------------------
-// Recursive Nested Menu Component
-// ------------------------
-// ------------------------
-// Recursive Nested Menu Component
-// ------------------------
-const MenuTree = ({ menus, selectedMenus, toggleMenu, parentId = null }) => {
-  // Helper: check if parent should be checked
-  const isParentChecked = (menu) => {
-    if (!menu.sub_menus || menu.sub_menus.length === 0) {
-      return selectedMenus.includes(menu.id);
-    }
-    const allChildIds = menu.sub_menus.map((c) => c.id);
-    return allChildIds.every((id) => selectedMenus.includes(id));
-  };
-
-  // Helper: check if parent is indeterminate
-  const isParentIndeterminate = (menu) => {
-    if (!menu.sub_menus || menu.sub_menus.length === 0) return false;
-    const allChildIds = menu.sub_menus.map((c) => c.id);
-    const checkedCount = allChildIds.filter((id) => selectedMenus.includes(id)).length;
-    return checkedCount > 0 && checkedCount < allChildIds.length;
-  };
-
-  return (
-    <>
-      {menus.map((menu) => {
-        const children = menu.sub_menus || [];
-        const parentChecked = isParentChecked(menu);
-        const parentIndeterminate = isParentIndeterminate(menu);
-
-        const onParentChange = (checked) => {
-          toggleMenu(menu.id, checked);
-          // toggle children recursively
-          children.forEach((c) => toggleMenuRecursive(c, checked));
-        };
-
-        const toggleMenuRecursive = (menu, checked) => {
-          toggleMenu(menu.id, checked);
-          if (menu.sub_menus && menu.sub_menus.length > 0) {
-            menu.sub_menus.forEach((c) => toggleMenuRecursive(c, checked));
-          }
-        };
-
-        if (children.length === 0) {
-          return (
-            <div
-              style={{
-                justifyContent: 'space-between',
-                display: 'flex',
-                alignItems: 'center',
-                border: '1px solid rgba(198, 195, 195, 0.85)',
-                // borderRadius: 6,
-                padding: '12px 16px',
-                marginBottom: 6,
-                background: '#fff',
-              }}
-            >
-              <div
-                key={menu.id}
-                style={{
-                  display: 'flex',
-                  alignItems: 'center',
-                  gap: 8,
-                }}
-              >
-                <Checkbox
-                  checked={selectedMenus.includes(menu.id)}
-                  onChange={(e) => {
-                    const checked = e.target.checked;
-
-                    toggleMenu(menu.id, checked);
-
-                    //  FORCE parent selection
-                    if (checked && parentId) {
-                      toggleMenu(parentId, true);
-                    }
-                  }}
-                />
-                <span>{menu.caption}</span>
-              </div>
-              <Tag color={menu.is_visible === true ? 'green' : 'blue'}>{menu.is_visible === true ? 'VISIBLE' : 'HIDDEN'}</Tag>{' '}
-            </div>
-          );
-        }
-
-        return (
-          <Collapse
-            key={menu.id}
-            style={{ marginBottom: 6 }}
-            // defaultActiveKey={[menu.id]}
-          >
-            <Panel
-              key={menu.id}
-              header={
-                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
-                  <div
-                    style={{
-                      display: 'flex',
-                      alignItems: 'center',
-                      gap: 8,
-                    }}
-                    onClick={(e) => e.stopPropagation()}
-                  >
-                    <Checkbox checked={parentChecked} indeterminate={parentIndeterminate} onChange={(e) => onParentChange(e.target.checked)} />
-                    <span>{menu.caption}</span>
-                  </div>
-                  <Tag color={menu.is_visible === true ? 'green' : 'blue'}>{menu.is_visible === true ? 'VISIBLE' : 'HIDDEN'}</Tag>{' '}
-                </div>
-              }
-            >
-              <div style={{ paddingLeft: 20 }}>
-                <MenuTree menus={children} selectedMenus={selectedMenus} toggleMenu={toggleMenu} parentId={menu.id} />
-              </div>
-            </Panel>
-          </Collapse>
-        );
-      })}
-    </>
-  );
-};

package/core/models/roles/components/role-list/role-list.js

@@ -40,6 +40,12 @@ const RoleList = ({ model, match, relativeAdd = false, additional_queries = [],
 
   const [single, setSingle] = useState({});
 
+  // tracks RoleAdd form submission so the Drawer footer button shows loading
+  const [submitting, setSubmitting] = useState(false);
+
+  // holds the RoleAdd form instance so the Drawer footer Save button can submit it
+  const formRef = useRef(null);
+
   var [queryValue, setQueryValue] = useState('');
 
   const { Search } = Input;
@@ -360,12 +366,26 @@ const RoleList = ({ model, match, relativeAdd = false, additional_queries = [],
         destroyOnClose
         onClose={closeModal}
         bodyStyle={{ paddingBottom: 80 }}
+        footer={
+          <div style={{ textAlign: 'right' }}>
+            <Space size="small">
+              <Button type="default" onClick={closeModal}>
+                Cancel
+              </Button>
+              <Button type="primary" loading={submitting} onClick={() => formRef.current?.submit()}>
+                Save
+              </Button>
+            </Space>
+          </div>
+        }
       >
         <model.ModalAddComponent
           match={match}
           model={model}
           additional_queries={additional_queries}
           formContent={single}
+          formRef={formRef}
+          onSubmittingChange={setSubmitting}
           callback={(event) => {
             closeModal();
             getRecords();

package/core/models/users/components/assign-role/assign-role.js

@@ -160,7 +160,7 @@ export default function AssignRole() {
     const role_id = role.id;
     try {
       const res = await MenusAPI.getCoreMenuByRoleId(role_id);
-      const allMenus = res.result || [];
+      const allMenus = Array.isArray(res?.result) ? res.result : [];
 
       setModules(allMenus);
     } catch (e) {
@@ -264,11 +264,12 @@ export default function AssignRole() {
   const handleViewAll = async () => {
     setLoadingMenus(true);
     setModules([]);
-    setActiveRole({ name: 'All Roles' });
+    setActiveRole({ name: 'All Roles', isViewAll: true });
 
     try {
       const res = await MenusAPI.getMenubyUser(id);
-      setModules(res?.result?.menus ?? []);
+      const userMenus = Array.isArray(res?.result?.menus) ? res.result.menus : [];
+      setModules(userMenus);
       setLoadingMenus(false);
     } catch (err) {
       setLoadingMenus(false);
@@ -277,6 +278,18 @@ export default function AssignRole() {
     }
   };
 
+  /**
+   * Context-specific empty-state message for the right (menus) panel:
+   * - View Access for a user with no roles → no role assigned
+   * - A selected role with no menus → no menus assigned
+   * - Nothing selected yet → prompt to pick a role
+   */
+  const emptyMenusMessage = !activeRole
+    ? 'Select a role to view menus'
+    : activeRole.isViewAll
+    ? 'No role has been assigned to this user.'
+    : 'No menus have been assigned to this role.';
+
   return (
     <section className="assign-role">
       {/* LEFT PANEL */}
@@ -383,17 +396,19 @@ export default function AssignRole() {
           padding: 16,
         }}
       >
-        <div className="menus-header">
-          <div className="title">Menus {activeRole ? `– ${activeRole.name}` : ''}</div>
-          <div className="sub-text">You don’t have permission to edit this here. Update it in Role Settings.</div>
-        </div>
+        {modules.length > 0 && (
+          <div className="menus-header">
+            <div className="title">Menus {activeRole ? `– ${activeRole.name}` : ''}</div>
+            <div className="sub-text">You don’t have permission to edit this here. Update it in Role Settings.</div>
+          </div>
+        )}
 
         <div className="menus-content">
           {loadingMenus ? (
             <Skeleton active paragraph={{ rows: 6 }} />
           ) : modules.length === 0 ? (
             <div className="empty-state">
-              <Empty description="Select a role to view menus" />
+              <Empty description={emptyMenusMessage} />
             </div>
           ) : (
             <MenuTree menus={modules} selectedMenus={selectedMenus} toggleMenu={toggleMenu} showCheckbox={false} />

package/core/modules/reporting/components/reporting-dashboard/display-columns/display-cell-renderer.js

@@ -1,7 +1,10 @@
-import React from 'react';
-import { Tag } from 'antd';
+import React, { useState, useContext } from 'react';
+import { Modal, Tag } from 'antd';
 import * as Icons from '@ant-design/icons';
 import { Link } from 'react-router-dom';
+import { GlobalContext, safeJSON, Location } from '../../../../../lib';
+// import { PdfViewer } from '../../../../../lib';
+import { CoreScripts } from '../../../../../models';
 
 /**
  * Utilities for rendering Reporting Dashboard display columns.
@@ -74,7 +77,7 @@ export function isActionTypeEntry(entry = {}) {
  * @param {DisplayRecord} record
  * @returns {string}
  */
-export function getRedirectLink(entry = {}, record = {}) {
+export function getRedirectLink(entry = {}, record = {}, CustomComponents = {}) {
   let redirectLink = entry.redirect_link || '';
 
   if (Array.isArray(entry.replace_variables)) {
@@ -87,6 +90,41 @@ export function getRedirectLink(entry = {}, record = {}) {
   return redirectLink;
 }
 
+/**
+ * Resolves the PDF/file location for file-based action entries.
+ *
+ * Supports either:
+ * - `entry.file_location` as a direct URL/path
+ * - `entry.file_location` as a record field name
+ *
+ * @param {DisplayColumnEntry} entry
+ * @param {DisplayRecord} record
+ * @returns {string}
+ */
+export function getFileLocation(entry = {}, record = {}) {
+  if (entry.file_location && typeof entry.file_location === 'string' && record[entry.file_location]) {
+    return record[entry.file_location];
+  }
+
+  return record.file_location || entry.file_location || '';
+}
+
+/**
+ * Resolves a value from the row when a config field points to a record key,
+ * otherwise returns the provided literal value.
+ *
+ * @param {*} value
+ * @param {DisplayRecord} record
+ * @returns {*}
+ */
+function resolveRecordValue(value, record = {}) {
+  if (typeof value === 'string' && Object.prototype.hasOwnProperty.call(record, value)) {
+    return record[value];
+  }
+
+  return value;
+}
+
 /**
  * Resolves action label text with backward-compatible precedence.
  *
@@ -170,6 +208,154 @@ function renderCustomComponent({ entry, record, CustomComponents, refresh }) {
   );
 }
 
+/**
+ * Renders a PDF file action inside a modal viewer.
+ *
+ * @param {Object} root0
+ * @param {DisplayColumnEntry} root0.entry
+ * @param {DisplayRecord} root0.record
+ * @param {Object.<string, React.ComponentType<any>>} root0.CustomComponents
+ * @returns {React.ReactNode}
+ */
+function FileActionLink({ entry, record, CustomComponents }) {
+  const [isPdfVisible, setIsPdfVisible] = useState(false);
+  const fileUrl = getFileLocation(entry, record);
+  const actionLabel = getActionLabel(entry, record);
+  const FileLoaderComponent = CustomComponents?.FileLoader;
+
+  if (!fileUrl) {
+    return null;
+  }
+
+  const fileLoaderProps = {
+    url: fileUrl,
+    type: resolveRecordValue(entry.file_type, record) || 'pdf',
+    defaultScale: resolveRecordValue(entry.default_scale, record),
+    viewerType: resolveRecordValue(entry.viewer_type, record),
+    config: {
+      requireLinuxPath: resolveRecordValue(entry.require_linux_path, record),
+      replaceBranch: resolveRecordValue(entry.replace_branch, record),
+      ...(entry.file_loader_config || {}),
+    },
+    entry,
+    record,
+  };
+
+  return (
+    <>
+      {/* 1. Add the trigger link/button here */}
+      <a
+        onClick={(e) => {
+          e.preventDefault();
+          setIsPdfVisible(true);
+        }}
+        style={{ cursor: 'pointer' }}
+      >
+        {actionLabel}
+      </a>
+
+      <Modal
+        open={isPdfVisible}
+        onCancel={() => setIsPdfVisible(false)}
+        footer={null}
+        destroyOnClose
+        width={950}
+        style={{ top: 10 }}
+        title={actionLabel}
+      >
+        {/* 2. Ensure the loader component exists */}
+        {FileLoaderComponent ? <FileLoaderComponent {...fileLoaderProps} /> : <p>Loader not found</p>}
+      </Modal>
+    </>
+  );
+}
+
+/**
+ * Returns the branch access list from the signed-in user's organization details.
+ *
+ * `organization_details` may arrive as a JSON string, so this helper keeps the
+ * parsing logic in one place before branch comparisons are made.
+ *
+ * @param {Object} user
+ * @returns {Array}
+ */
+function getAccessibleBranches(user = {}) {
+  const orgDetails = safeJSON(user?.organization_details);
+  return Array.isArray(orgDetails?.branch) ? orgDetails.branch : [];
+}
+
+/**
+ * Resolves branch metadata used to decide whether an action link should prompt
+ * for a branch switch before navigation.
+ *
+ * When an action entry includes `replace_variables` with the `index` field, the
+ * row is treated as branch-aware content. We compare the record's branch id
+ * against the active branch from `localStorage.db_ptr`, and also resolve whether
+ * the user has access to the target branch.
+ *
+ * @param {DisplayColumnEntry} entry
+ * @param {DisplayRecord} record
+ * @param {Object} user
+ * @returns {{requiresBranchSwitch: boolean, hasTargetBranchAccess: boolean}}
+ */
+function getBranchNavigationState(entry = {}, record = {}, user = {}) {
+  const branchFieldConfig = entry.replace_variables?.find((variable) => variable.field === 'index');
+
+  if (!branchFieldConfig) {
+    return { requiresBranchSwitch: false, hasTargetBranchAccess: false };
+  }
+
+  const accessibleBranches = getAccessibleBranches(user);
+  const activeDbPtr = localStorage.getItem('db_ptr');
+  const activeBranch = accessibleBranches.find((branch) => String(branch.dbPtr) === String(activeDbPtr));
+  const targetBranchId = record[branchFieldConfig.field];
+  const targetBranch = accessibleBranches.find((branch) => String(branch.branch_id) === String(targetBranchId));
+
+  return {
+    requiresBranchSwitch: Boolean(targetBranchId) && String(activeBranch?.branch_id) !== String(targetBranchId),
+    hasTargetBranchAccess: Boolean(targetBranch),
+  };
+}
+
+/**
+ * Renders a branch-switch confirmation link for cross-branch records.
+ *
+ * The actual branch change is handled by the landing page via the `index`
+ * query parameter. This link only confirms intent and blocks navigation when
+ * the user does not have access to the target branch.
+ *
+ * @param {Object} root0
+ * @param {string} root0.label
+ * @param {string} root0.redirectLink
+ * @param {boolean} root0.hasTargetBranchAccess
+ * @returns {React.ReactNode}
+ */
+function BranchAwareActionLink({ label, redirectLink, hasTargetBranchAccess }) {
+  return (
+    <a
+      onClick={(e) => {
+        e.preventDefault();
+        Modal.confirm({
+          title: 'Switch Branch?', // Adding a title makes it look more standard
+          content: 'This record belongs to another branch. Would you like to switch branches to view the details?',
+          onOk: () => {
+            if (hasTargetBranchAccess) {
+              Location.navigate({ url: redirectLink });
+              return;
+            }
+
+            Modal.error({
+              title: 'Access Denied',
+              content: 'This data belongs to another branch.Would you like to switch branches to view the details?',
+            });
+          },
+        });
+      }}
+    >
+      {label}
+    </a>
+  );
+}
 /**
  * Renders table cell content for a configured display column.
  *
@@ -210,10 +396,21 @@ export function renderDisplayCell({ entry, record, CustomComponents, refresh })
     }
     return null;
   }
-
   if (isLegacyActionEntry(entry) || isActionTypeEntry(entry)) {
+    if (entry.redirect_link_type === 'file') {
+      return <FileActionLink entry={entry} record={record} CustomComponents={CustomComponents} />;
+    }
+    const { user = {} } = useContext(GlobalContext);
+
     const redirectLink = getRedirectLink(entry, record);
-    return <Link to={`${redirectLink}`}>{getActionLabel(entry, record)}</Link>;
+    const label = getActionLabel(entry, record);
+    const { requiresBranchSwitch, hasTargetBranchAccess } = getBranchNavigationState(entry, record, user);
+
+    if (requiresBranchSwitch) {
+      return <BranchAwareActionLink label={label} redirectLink={redirectLink} hasTargetBranchAccess={hasTargetBranchAccess} />;
+    }
+
+    return <Link to={`${redirectLink}`}>{label}</Link>;
   }
 
   if (entry.field === 'custom') {