ui-soxo-bootstrap-core 2.6.20 → 2.6.22

package/core/components/landing-api/landing-api.js

@@ -1,10 +1,10 @@
-import React, { useState, useEffect, useContext, useRef } from 'react';
+import { useContext, useEffect, useRef, useState } from 'react';
 
 import { Route, Switch } from 'react-router-dom';
 
 import { Skeleton } from 'antd';
 
-import { GlobalHeader, ChangePassword, useTranslation, GlobalContext, ModuleRoutes, SpotlightSearch, SettingsUtil, Profile, Card } from '../../lib';
+import { Card, ChangePassword, GlobalContext, GlobalHeader, ModuleRoutes, Profile, SettingsUtil, SpotlightSearch, useTranslation } from '../../lib';
 
 import './landing-api.scss';
 
@@ -16,7 +16,7 @@ import ReportingDashboard from '../../modules/reporting/components/reporting-das
 
 import PropTypes from 'prop-types';
 
-import { MenusAPI, CoreScripts } from '../../models';
+import { CoreScripts, MenusAPI } from '../../models';
 
 const motivatingMessages = [
   'Setting things up for a great start...',
@@ -159,7 +159,6 @@ export default function LandingApi({ history, CustomComponents, CustomModels, ap
    * @param reports
    */
   async function loadMenus(reports) {
-
     setLoader(true);
 
     // setReports(report)
@@ -169,16 +168,12 @@ export default function LandingApi({ history, CustomComponents, CustomModels, ap
     // console.log(result);
 
     if (result && Array.isArray(result.result) && result.result.length) {
-
       // setModules(result.result);
-
       // result.result.map((ele) => {
       //     let languageString = JSON.parse(ele.attributes)
       //     console.log('language_string', languageString);
       //     if (languageString && languageString.languages) {
-
       //         const language = i18n.language;
-
       //         i18n.addResourceBundle(language, 'translation', languageString.languages[i18n.language]);
       //     }
       // })
@@ -189,7 +184,6 @@ export default function LandingApi({ history, CustomComponents, CustomModels, ap
       dispatch({ type: 'settings', payload: result.result.settings });
     }
 
-
     // Reports length
     if (reports.length) {
       reportMenus = [
@@ -224,7 +218,6 @@ export default function LandingApi({ history, CustomComponents, CustomModels, ap
         //If there is no roles assigned to the user
         setAllModules([...coreModules]);
       }
-
     } else {
       //  for nura
       if (result && result.result.menus && reportMenus) {
@@ -233,14 +226,10 @@ export default function LandingApi({ history, CustomComponents, CustomModels, ap
         //If there is no roles assigned to the user
         setAllModules([...coreModules]);
       }
-
-
     }
     setLoader(false);
-
   }
 
-
   /**
    * Load the scripts
    *
@@ -505,16 +494,18 @@ function DefineRoute({ menus, CustomComponents, CustomModels, settings, callback
   function printRoute(menu, index, CustomComponents, CustomModels, callback) {
     // From the path we remove any query parameters that exist in the url
     //
-    let paths;
+    let paths = [];
 
     //There will be path for normal menus
-    if (menu.path) {
+    if (menu?.path) {
       paths = menu.path.split('?');
-    } else {
-      /** In case if there is no path , ie, in case of reports menu */
-      menu.sub_menus.map((menus) => {
-        paths = menus.path.split('?');
-      });
+    } else if (Array.isArray(menu?.sub_menus)) {
+      for (const subMenu of menu.sub_menus) {
+        if (subMenu?.path) {
+          paths = subMenu.path.split('?');
+          break;
+        }
+      }
     }
 
     // Find the route path

package/core/lib/Store.js

@@ -72,12 +72,16 @@ const initialTheme = () => {
 const initialState = {
   defaultBranch: {},
   theme: initialTheme(), // Set the initial theme from themes.json
+  settings: {},
 };
 
 /**
  * Context for sharing state accross app
  */
-export const GlobalContext = createContext(initialState);
+export const GlobalContext = createContext({
+  ...initialState,
+  state: initialState,
+});
 
 let app = {};
 

package/core/lib/components/global-header/global-header.js

@@ -3,7 +3,7 @@
  * Global header component
  */
 
-import React, { useState, useEffect, useContext,useRef } from "react";
+import React, { useState, useEffect, useContext, useRef } from "react";
 
 import { animationControls, motion, useAnimation } from "framer-motion";
 
@@ -11,11 +11,11 @@ import {
   boxVariants,
 } from "./animations"
 
-import { GlobalContext } from "./../../Store";
+import { GlobalContext, GlobalProvider } from "./../../Store";
 
 import { Link, useLocation } from "react-router-dom";
 
-import { Typography, Avatar ,Input} from "antd";
+import { Typography, Avatar, Input, Tooltip } from "antd";
 
 
 
@@ -31,6 +31,7 @@ import {
   MenuOutlined,
   UserOutlined,
   SettingOutlined,
+  QuestionOutlined,
 } from "@ant-design/icons";
 
 import { Drawer } from "antd";
@@ -58,7 +59,7 @@ const { Title } = Typography;
 
 
 
-export default function GlobalHeader({
+function GlobalHeaderContent({
   loading,
   appSettings,
   children,
@@ -76,17 +77,18 @@ export default function GlobalHeader({
 
 
 
-  const { isMobile, user = { locations: [] }, kiosk, state } = useContext(GlobalContext);
+  const { isMobile, user = { locations: [] }, kiosk, state, settings } = useContext(GlobalContext);
 
 
 
   const [visible, setVisible] = useState(false);
+  const helpDeskSetting = settings?.HELPATR || {}
 
   // Variable to handle toggling of menu
   const [collapsed, setCollapsed] = useState(false);
   // varibale handle branch switcher
 
- 
+
 
   // const [searchModalVisible, setSearchModalVisible] = useState(false);
 
@@ -107,8 +109,8 @@ export default function GlobalHeader({
 
 
   }, []);
- 
-  
+
+
 
 
   /**
@@ -125,9 +127,9 @@ export default function GlobalHeader({
     //  input to avoid typing
     SettingsUtil.openSpotlightModal();
   };
-  
- 
-  
+
+
+
 
   /**
    * Function to remove toggling on mobile view
@@ -170,10 +172,10 @@ export default function GlobalHeader({
 
   }, [state.theme]);
 
- 
-  
-  
-  
+
+
+
+
 
 
   return (
@@ -196,7 +198,7 @@ export default function GlobalHeader({
           //whileHover="hover"
           //whileTap="tap"
           className={`left-bar ${!isConnected && !isMobile ? "" : "hide"}${!collapsed ? "open" : "close"}${kiosk && !isConnected ? "kioskon" : ""}`}
-          // style={{ background: state.theme.colors.leftSectionBackground }}
+        // style={{ background: state.theme.colors.leftSectionBackground }}
         >
 
           {!isMobile && !isConnected ? (
@@ -288,34 +290,34 @@ export default function GlobalHeader({
               </div>
 
               {/* Page Menu Actions */}
-              
+
               {user.role || user.id ? (
                 <div className="page-menu">
-                   {/* Search Input in header start */}
-                 { !isMobile && (
-                              
+                  {/* Search Input in header start */}
+                  {!isMobile && (
+
                     <div>
-                    <Input
-                            placeholder="Search (Shift + F)"
-                            prefix={<SearchOutlined />}
-                            onClick={openSearchModal}
-                          
-                            readOnly
-                            style={{ width: 250 }}
-                          />
-                    
-
-                      <SpotlightSearch ref={(elem) => SettingsUtil.registerModal(elem)}  props={props}/>
-                    
+                      <Input
+                        placeholder="Search (Shift + F)"
+                        prefix={<SearchOutlined />}
+                        onClick={openSearchModal}
+
+                        readOnly
+                        style={{ width: 250 }}
+                      />
+
+
+                      <SpotlightSearch ref={(elem) => SettingsUtil.registerModal(elem)} props={props} />
+
                     </div>
-                 )}
-                    {/* Search Input in header start */}
+                  )}
+                  {/* Search Input in header start */}
 
                   {/** branchswitcher Option  */}
                   {/* branch switcher controlled with env for matria and nura */}
                   {!process.env.REACT_APP_SHOW_BRANCH_SWITCHER ? (
-  <div className="branch-switcher">{globalCustomerHeader()}</div>
-):null} 
+                    <div className="branch-switcher">{globalCustomerHeader()}</div>
+                  ) : null}
                   {/* <div className="branch-switcher">{globalCustomerHeader()}</div> */}
 
 
@@ -342,7 +344,7 @@ export default function GlobalHeader({
                   ) : null}
                   {/* Configurator Actions Ends */}
 
-                 
+
 
 
 
@@ -355,6 +357,18 @@ export default function GlobalHeader({
 
                   {/* Reload Button Ends */}
 
+                  {/* Help-desk-btn */}
+                  {helpDeskSetting?.showSupportBtn ? <Tooltip title={helpDeskSetting?.toolTipText}>
+                    <span>
+                      <Button
+                        onClick={() => window.open(helpDeskSetting?.helpDeskLink ?? '', '_blank')}
+                        icon={<QuestionOutlined />}
+                        type="default"
+                        size="small"
+                      />
+                    </span>
+                  </Tooltip> : null}
+
                   {/** Switch Languages starts */}
                   {process.env.REACT_APP_ENABLE_LANGUAGE_SWITCHER ? <LanguageSwitcher /> : null}
                   {/** Switch Languages ends */}
@@ -383,6 +397,22 @@ export default function GlobalHeader({
 }
 
 
+export default function GlobalHeader(props) {
+  const context = useContext(GlobalContext);
+
+  if (context.dispatch) {
+    return <GlobalHeaderContent {...props} />;
+  }
+
+  return (
+    <GlobalProvider {...props} appSettings={props.appSettings}>
+      <GlobalHeaderContent {...props} />
+    </GlobalProvider>
+  );
+}
+
+
+
 /**
  * 
  * @returns 

package/core/lib/models/forms/components/form-creator/form-creator.js

@@ -35,6 +35,8 @@ import { FieldCustomizer, TabCustomizer } from "./../../../../";
 
 import { prepareAndExecuteScript } from './../../../../utils/script.utils';
 
+import AdvancedSearchSelect from "../../../../../modules/reporting/components/reporting-dashboard/adavance-search/advance-search";
+
 const { TextArea } = Input;
 
 const { Option } = Select;
@@ -59,8 +61,10 @@ function FormCreator({
     formContent = {},
     onSubmit,
     fields = [],
+    reportId,
     callback,
     layout,
+    onFormValuesChange,
     // Below are arguments for use in form display
     onFieldUpdate,
     // onListUpdate,
@@ -69,7 +73,6 @@ function FormCreator({
     const [form] = Form.useForm();
 
     let layoutValue;
-
     if (layout) {
         layoutValue = layout
     } else {
@@ -194,11 +197,15 @@ function FormCreator({
             values = await prepareAndExecuteScript(values, null, fieldConfiguration.on_change);
 
         }
+
+        if (onFormValuesChange) {
+            onFormValuesChange(values);
+        }
     }
 
     return (
         <section className="form-creator">
-            <div>
+      
                 {/* <DragDropContext onDragEnd={onDragEnd}>
                 <Droppable droppableId="droppable">
 
@@ -251,6 +258,8 @@ function FormCreator({
                         });
 
                     }}
+                    // layout="inline"
+
                     onFieldsChange={onFieldsChange}
 
                     onValuesChange={onValuesChange}
@@ -265,6 +274,7 @@ function FormCreator({
                     {/* Mapper maps each fields to build the form */}
                     <FieldMapper
                         fields={fields}
+                        reportId={reportId}
                         onChange={onChange}
                         selectedInformation={selectedInformation}
                         onUpload={onUpload}
@@ -278,7 +288,7 @@ function FormCreator({
                         SUBMIT
                     </Button>
                 </Form>
-            </div>
+   
             {/* </div>)}
 
                 </Droppable>
@@ -299,6 +309,7 @@ export default FormCreator;
  */
 function FieldMapper({
     fields = [],
+    reportId,
     onChange,
     selectedInformation,
     onUpload,
@@ -337,6 +348,7 @@ function FieldMapper({
                                         {/* Mapper maps each fields to build the form */}
                                         <FieldMapper
                                             fields={tab.fields}
+                                            reportId={reportId}
                                             onChange={onChange}
                                             onUpload={onUpload}
                                             onFieldUpdate={onFieldUpdate}
@@ -358,6 +370,7 @@ function FieldMapper({
                             ?
                             <UserInput
                                 onChange={onChange}
+                                reportId={reportId}
                                 index={index}
                                 key={index}
                                 onUpload={onUpload}
@@ -371,6 +384,7 @@ function FieldMapper({
                     } else {
                         return <UserInput
                             onChange={onChange}
+                            reportId={reportId}
                             key={index}
                             selectedInformation={selectedInformation}
                             index={index}
@@ -397,7 +411,7 @@ function FieldMapper({
  * 
  * @param {*} param0 
  */
-function UserInput({ field, onUpload, selectedInformation, onChange, onFieldUpdate, onFieldRemove, index }) {
+function UserInput({ field, onUpload, selectedInformation, onChange, onFieldUpdate, onFieldRemove, index, reportId }) {
 
     let props = {};
 
@@ -423,8 +437,11 @@ function UserInput({ field, onUpload, selectedInformation, onChange, onFieldUpda
 
         switch (field.type) {
 
+            case 'search':
+                return <AdvancedSearchSelect {...field} reportId={reportId} style={{ width: '100%' }} />
+
             case 'number':
-                return <InputNumber required={field.required} />
+                return <InputNumber  required={field.required} />
 
             case 'input':
                 return <Input required={field.required} />
@@ -459,7 +476,7 @@ function UserInput({ field, onUpload, selectedInformation, onChange, onFieldUpda
                 return <TextArea rows={4} required={field.required} />
 
             case 'boolean':
-                return <Select style={{ width: 120 }} required={field.required}>
+                return <Select style={{ width: '120' }} required={field.required}>
                     {[true, false].map((option, key) => <Option key={key} value={option}>{option ? 'Yes' : 'No'}</Option>)}
                 </Select>
 
@@ -495,7 +512,7 @@ function UserInput({ field, onUpload, selectedInformation, onChange, onFieldUpda
                     return (
                         <Select defaultValue={defaultValue}
                             required={field.required}
-                            style={{ width: 120 }}
+                            style={{ width: '120' }}
                             onChange={(value) => onChange(field, value)}
                         >
                             {field.options.map((option, key) => (
@@ -605,7 +622,13 @@ function UserInput({ field, onUpload, selectedInformation, onChange, onFieldUpda
                     <FieldCustomizer field={field} onFieldUpdate={onFieldUpdate} index={index} onFieldRemove={onFieldRemove} />
                     {/* Customizes the form Ends */}
 
-                    <Form.Item {...props} name={field.field} label={field.caption} rules={[{ required: field.required, message: field.placeholder || 'Please enter ' + field.caption }]}>
+                    <Form.Item 
+                        {...props} 
+                        name={field.field} 
+                        label={field.caption} 
+                        rules={[{ required: field.required, message: field.placeholder || 'Please enter ' + field.caption }]}
+                        style={{ marginBottom: '12px' }}
+                    >
 
                         {inputElement(field, onChange)}
                         {/* <InputElement field={field} /> */}

package/core/lib/models/forms/components/form-creator/form-creator.scss

@@ -1,31 +1,34 @@
 .form-creator {
-    .ant-input-number {
-        width: 100%;
-    }
-
-    .new-record {
-        gap: 10px !important;
-    }
+  .ant-input-number {
+    width: 100%;
+  }
 
-    .form-item-element {
-        position: relative;
-        padding: 8px;
-        border-radius: 4px;
-        // border: 1px solid #e3e3e3;
-        margin-bottom: 3px;
-
-        .field-customizer {
-            .actions {
-                // display: none;
-                float: right;
-                // position: absolute;
-                // right: 0px;
-            }
-        }
+  .new-record {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: flex-start;
+    gap: 10px !important;
+  }
 
+  .form-item-element {
+    position: relative;
+    padding: 4px;
+    // border-radius: 4px;
+    // border: 1px solid #e3e3e3;
+    // margin-bottom: 3px;
+    min-width: 140px;
+    // flex: 0 1 auto;
+    .field-customizer {
+      .actions {
+        // display: none;
+        float: right;
+        // position: absolute;
+        // right: 0px;
+      }
     }
+  }
 
-    .submit-button {
-        margin-top: 10px;
-    }
-}
+  .submit-button {
+    margin-top: 34px;
+  }
+}