ui-soxo-bootstrap-core 2.4.24 → 2.4.25-dev.7

package/.github/workflows/npm-publish.yml

@@ -11,23 +11,45 @@ jobs:
   build:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
-        with:
-          node-version: 16
-      - run: npm i
-#       - run: npm test
+      # 1. Checkout the repository
+      - name: Checkout Code
+        uses: actions/checkout@v3
 
-  publish-npm:
-    needs: build
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
+      # 2. Setup Node.js and npm registry
+      - name: Setup Node.js
+        uses: actions/setup-node@v3
         with:
           node-version: 16
           registry-url: https://registry.npmjs.org/
-      - run: npm i
-      - run: npm publish
+
+      # 3. Install dependencies using ci for reproducibility
+      - name: Install Dependencies
+        run: npm ci
+
+      # 4. Verify tag matches package.json version
+      - name: Verify Tag Matches Version
+        run: |
+          TAG=${GITHUB_REF#refs/tags/}
+          PACKAGE_VERSION=$(node -p "require('./package.json').version")
+          echo "Release Tag: $TAG"
+          echo "Package Version: $PACKAGE_VERSION"
+
+          if [[ "$TAG" != "v$PACKAGE_VERSION"* ]]; then
+            echo "Error: Tag does not match package.json version"
+            exit 1
+          fi
+
+      # 5. Publish the package
+      - name: Publish Package
+        run: |
+          TAG_NAME=${GITHUB_REF#refs/tags/}
+
+          if [[ "$TAG_NAME" == *"dev"* ]]; then
+            echo "Publishing development package with 'dev' tag"
+            npm publish --tag dev
+          else
+            echo "Publishing stable package"
+            npm publish
+          fi
         env:
-          NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

package/README.md

@@ -0,0 +1,260 @@
+# 📦 NPM Release Workflow — Task-Based Development → Develop → Master
+
+This guide describes the complete workflow for publishing **task-based development builds** and **stable releases** using GitHub Actions, Git tags, and npm versioning.
+
+Incorrect versioning or incorrect tags will break the publish pipeline — follow the process exactly.
+
+---
+
+# 📘 Table of Contents
+- Overview
+- Branch Strategy
+- Task Branch Workflow
+- Versioning Rules
+- Development Release Workflow (`develop`)
+- Promotion Workflow (Dev → Master)
+- Publishing via GitHub Release UI
+- How GitHub Action Detects Release Type
+- Summary Table
+- Common Mistakes & Fixes
+
+---
+
+# 🧩 Overview
+
+We maintain two release channels:
+
+| Channel              | Branch   | Tag              | Purpose               |
+|---------------------|----------|------------------|-----------------------|
+| Stable (`latest`)   | master   | `vX.Y.Z`         | Production release    |
+| Development (`dev`) | develop  | `vX.Y.Z-dev.N`   | QA/internal testing   |
+
+Releases are triggered using Git tags:
+
+```
+npm version
+```
+
+---
+
+# 🌿 Branch Strategy
+
+## `master`
+- Production-ready code  
+- Publishes **stable** builds  
+- Versions never include a `dev` suffix  
+
+## `develop`
+- Used for QA/internal testing  
+- Publishes **development** builds  
+- Versions always include `-dev.N`  
+
+## Task Branches
+- Create from `master`  
+- Naming: `task/<JIRA-ID>-<description>`  
+- After completing work, merge into `develop`  
+
+---
+
+# 🏗️ Task Branch Workflow
+
+### 1. Create a task branch
+```bash
+git checkout master
+git pull origin master
+git checkout -b task/<JIRA-ID>-<description>
+```
+
+### 2. Work on the task
+```bash
+git add .
+git commit -m "TASK-123: Implement XYZ"
+```
+
+### 3. Merge into develop
+```bash
+git checkout develop
+git pull origin develop
+git merge task/<JIRA-ID>-<description>
+```
+
+---
+
+# 🔧 Versioning Rules
+
+## Development Versions
+```
+X.Y.Z-dev.N
+```
+Example:
+```
+2.4.30-dev.0
+```
+
+## Stable Versions
+```
+X.Y.Z
+```
+
+## Rules
+- Each version must be unique  
+- Dev versions do **not** convert into stable versions  
+- Git tag must exactly match `package.json` version  
+
+---
+
+# 🟦 Development Release Workflow (`develop`)
+
+### 1. Switch to develop
+```bash
+git checkout develop
+git pull origin develop
+```
+
+### 2. Create a new development version
+```bash
+npm version prerelease --preid=dev
+```
+
+### 3. Push commit + tag
+```bash
+git push --follow-tags
+```
+
+### 4. GitHub Action publishes dev build
+```
+npm publish --tag dev
+```
+
+### 5. Install the dev build
+```bash
+npm install soxo-bootstrap-core@dev
+```
+
+---
+
+# 🟩 Promotion Workflow (Dev → Master)
+
+### 1. Switch to master
+```bash
+git checkout master
+git pull origin master
+```
+
+### 2. Merge develop into master
+```bash
+git merge develop
+```
+
+### 3. Bump the stable version
+```bash
+npm version patch
+# or
+npm version minor
+# or
+npm version major
+```
+
+### 4. Push with tags
+```bash
+git push --follow-tags
+```
+
+### 5. GitHub Action publishes stable build
+```
+npm publish
+```
+
+### 6. Install stable version
+```bash
+npm install soxo-bootstrap-core
+# or
+npm install soxo-bootstrap-core@<version>
+```
+
+---
+
+# 🟧 Publishing via GitHub Release UI
+
+### Important
+**The tag must match the `package.json` version exactly**, including the `v` prefix.
+
+Example:
+```
+package.json: "version": "2.4.31-dev.0"
+GitHub Tag:  v2.4.31-dev.0
+```
+
+---
+
+## Steps
+
+### 1. Ensure `develop` branch is up to date  
+Push your changes.
+
+### 2. Ensure version contains a dev suffix  
+If not:
+```bash
+npm version prerelease --preid=dev
+git push --follow-tags
+```
+
+### 3. Open GitHub → Releases → Draft a new release
+
+### 4. Create tag matching the version  
+Example:
+```
+v2.4.31-dev.0
+```
+
+### 5. Select target branch = `develop`
+
+### 6. Title = tag version  
+Description is optional.
+
+### 7. Publish the release  
+Triggers:
+```
+npm publish --tag dev
+```
+
+---
+
+# ⚙️ How GitHub Action Detects Release Type
+
+If version contains `dev`:
+```
+npm publish --tag dev
+```
+
+Otherwise:
+```
+npm publish
+```
+
+---
+
+# 📊 Summary Table
+
+| Step                     | Branch   | Command                                 | Tag              | Publish Type |
+|--------------------------|----------|------------------------------------------|------------------|--------------|
+| Create task branch       | master   | `git checkout -b task/<ID>`              | —                | —            |
+| Merge task → develop     | develop  | `git merge task/<ID>`                    | —                | —            |
+| Dev version              | develop  | `npm version prerelease --preid=dev`     | `vX.Y.Z-dev.N`   | dev          |
+| Publish dev build        | develop  | `git push --follow-tags`                 | —                | dev          |
+| Merge develop → master   | master   | `git merge develop`                      | —                | —            |
+| Stable version           | master   | `npm version patch/minor/major`          | `vX.Y.Z`         | latest       |
+| Publish stable build     | master   | `git push --follow-tags`                 | —                | latest       |
+
+---
+
+# ⚠️ Common Mistakes & Fixes
+
+| Mistake                        | Issue                | Fix                             |
+|-------------------------------|----------------------|---------------------------------|
+| Tag doesn't match version     | Publish fails        | Always use `npm version`         |
+| Manual tag creation           | Version mismatch     | Avoid manual tagging             |
+| Dev publish from master       | Wrong channel        | Verify branch before tagging     |
+| Not pushing tags              | Workflow won’t run   | Use `git push --follow-tags`     |
+| Merging incomplete tasks      | Breaks dev builds    | Test before merging              |
+

package/core/components/extra-info/extra-info-details.js

@@ -1,7 +1,7 @@
 /**
- * ExtraInfoDetail component contains the button and the data for corresponding to script mode and will open extrainfo  
+ * ExtraInfoDetail component contains the button and the data for corresponding to script mode and will open extrainfo
  *
- * @description 
+ * @description
  * @author Sneha T
  */
 
@@ -21,152 +21,135 @@ import ExtraInfo from './extra-info';
 
 const { TabPane } = Tabs;
 
-export default function ExtraInfoDetail({ modeValue, icon, title, tabPosition='left',showDrawerData,dbPtr,callback,...record}) {
-    // State to control drawer
-    const [open, setOpen] = useState(false);
+export default function ExtraInfoDetail({ modeValue, icon, title, tabPosition = 'left', showDrawerData, dbPtr, callback, ...record }) {
+  // State to control drawer
+  const [open, setOpen] = useState(false);
 
-    // To set extra info data
-    const [info, setInfo] = useState([]);
-    //Setting active key for tabs
-    const [activeKey, setActiveKey] = useState(null);
+  // To set extra info data
+  const [info, setInfo] = useState([]);
+  //Setting active key for tabs
+  const [activeKey, setActiveKey] = useState(null);
 
-    // To strore selected item
-    const [selectedItem, setSelectedItem] = useState(null);
+  // To strore selected item
+  const [selectedItem, setSelectedItem] = useState(null);
 
-    const [loading, setLoading] = useState(true);
+  const [loading, setLoading] = useState(true);
 
-    /**
-    * Show Drawer
-    */
-    const showDrawer = () => {
-
-        setActiveKey(null); // Reset activeKey before fetching new info
-
-        getExtraInfo();
+  /**
+   * Show Drawer
+   */
+  const showDrawer = () => {
+    setActiveKey(null); // Reset activeKey before fetching new info
 
-        setOpen(true);
+    getExtraInfo();
 
-    };
+    setOpen(true);
+  };
 
-    /**
-     * Function to close
-     */
-    const onClose = () => {
-        if (typeof callback === 'function') {
-            // Only call if it exists
-            callback(false);
-        }
-        setOpen(false);
-    };
+  /**
+   * Function to close
+   */
+  const onClose = () => {
+    if (typeof callback === 'function') {
+      // Only call if it exists
+      callback(false);
+    }
+    setOpen(false);
+  };
 
-    /**
-     * Function to get Info
-     */
-    async function getExtraInfo() {
+  /**
+   * Function to get Info
+   */
+  async function getExtraInfo() {
+    setSelectedItem();
 
-        setSelectedItem()
+    setLoading(true);
 
-        setLoading(true);
+    let mode = modeValue;
 
-        let mode = modeValue
+    const result = await Dashboard.getExtraInfo(mode);
 
-        const result = await Dashboard.getExtraInfo(mode);
+    setInfo(result);
 
-        setInfo(result);
+    setSelectedItem(result[0]);
 
-        setSelectedItem(result[0])
+    setActiveKey(result[0].id.toString()); // Set activeKey to the first item's id
 
-        setActiveKey(result[0].id.toString()); // Set activeKey to the first item's id
+    setLoading(false);
+  }
 
-        setLoading(false);
+  useEffect(() => {
+    // If showDrawerData is true then call showDrawer function
+    if (showDrawerData) {
+      showDrawer();
     }
+  }, [showDrawerData]);
 
-    useEffect(() => {
-        // If showDrawerData is true then call showDrawer function
-        if (showDrawerData) {
-            showDrawer();
-        }
-    }, [showDrawerData]);
-
-    /**
+  /**
    * Function to render icon or button
    */
-    const renderIconOrButton = () => {
-        switch (icon) {
-            case 'InfoCircleFilled':
-                return <InfoCircleFilled onClick={showDrawer} />;
-            case 'Button':
-                return <Button size="small" onClick={showDrawer}>Show Info</Button>;
-            default:
-                return null;
-        }
-    };
-
-    
-
-    return (
-        <>
-            {/* {loading ? (
+  const renderIconOrButton = () => {
+    switch (icon) {
+      case 'InfoCircleFilled':
+        return <InfoCircleFilled onClick={showDrawer} />;
+      case 'Button':
+        return (
+          <Button size="small" onClick={showDrawer}>
+            Show Info
+          </Button>
+        );
+      default:
+        return null;
+    }
+  };
+
+  return (
+    <>
+      {/* {loading ? (
                 <>
                     <Skeleton active />
                 </>
             ) : ( */}
-            <>
-                {/*  */}
-                {/* <Button onClick={showDrawer}> */}
-
-                {/* <InfoCircleFilled onMouseEnter={showDrawer} /> */}
-
-                {renderIconOrButton()}
-                {/* </Button> */}
-                {/*  */}
-
-                {/*  */}
-                <Drawer
-
-                    width={'85%'}
-
-                    title={title} onClose={onClose} open={open}>
-
-                    <div className="main-drawer-content">
-
-                        <div className="drawer-container">
-
-                            <div className="drawer-click"> {/* Flexbox approach */}
-                                <Tabs
-                                    tabPosition={tabPosition}
-
-                                    activeKey={activeKey} // Set activeKey to control the active tab
-
-                                    onChange={(key) => {
-
-                                        const selectedItem = info.find(item => item.id.toString() === key);
-
-                                        setSelectedItem(selectedItem);
-
-                                        setActiveKey(key);
-                                    }}
-                                >
-                                    {info.map(item => (
-                                        <TabPane tab={item.caption} key={item.id.toString()} />
-                                    ))}
-                                </Tabs>
-                            </div>
-
-                            <div className="right-drawer">
-
-                                {selectedItem && !loading ? <ExtraInfo item={selectedItem} record={record}  dbPtr={dbPtr}/> : null}
-
-                            </div>
-
-                        </div>
-
-                    </div>
-
-                </Drawer>
-
-            </>
-            {/* )} */}
-        </>
-    );
+      <>
+        {/*  */}
+        {/* <Button onClick={showDrawer}> */}
+
+        {/* <InfoCircleFilled onMouseEnter={showDrawer} /> */}
+
+        {renderIconOrButton()}
+        {/* </Button> */}
+        {/*  */}
+
+        {/*  */}
+        <Drawer width={'35%'} title={title} onClose={onClose} open={open}>
+          <div className="main-drawer-content">
+            <div className="drawer-container">
+              <div className="drawer-click">
+                {' '}
+                {/* Flexbox approach */}
+                <Tabs
+                  tabPosition={tabPosition}
+                  activeKey={activeKey} // Set activeKey to control the active tab
+                  onChange={(key) => {
+                    const selectedItem = info.find((item) => item.id.toString() === key);
+
+                    setSelectedItem(selectedItem);
+
+                    setActiveKey(key);
+                  }}
+                >
+                  {info.map((item) => (
+                    <TabPane tab={item.caption} key={item.id.toString()} />
+                  ))}
+                </Tabs>
+              </div>
+
+              <div className="right-drawer">{selectedItem && !loading ? <ExtraInfo item={selectedItem} record={record} dbPtr={dbPtr} /> : null}</div>
+            </div>
+          </div>
+        </Drawer>
+      </>
+      {/* )} */}
+    </>
+  );
 }

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

@@ -96,7 +96,6 @@ export default function LandingApi({ history, CustomComponents, CustomModels, ap
    * @param reports
    */
   async function loadMenus(reports) {
-
     setLoader(true);
 
     // setReports(report)
@@ -106,16 +105,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]);
       //     }
       // })
@@ -126,7 +121,6 @@ export default function LandingApi({ history, CustomComponents, CustomModels, ap
       dispatch({ type: 'settings', payload: result.result.settings });
     }
 
-
     // Reports length
     if (reports.length) {
       reportMenus = [
@@ -153,30 +147,25 @@ export default function LandingApi({ history, CustomComponents, CustomModels, ap
 
     /**If there is roles assigned to the user */
     // for matria
-   const useCoreMenus= process.env.REACT_APP_USE_CORE_MENUS === 'true';
-   if(useCoreMenus){
-     if (result && result.result && reportMenus) {
-      setAllModules([...result.result, ...reportMenus, ...coreModules]);
-    } else {
-      //If there is no roles assigned to the user
-      setAllModules([...coreModules]);
-    }
-
-   } else{
-    //  for nura
-    if (result && result.result.menus && reportMenus) {
-      setAllModules([...result.result.menus, ...reportMenus, ...coreModules]);
+    const useCoreMenus = process.env.REACT_APP_USE_CORE_MENUS === 'true';
+    if (useCoreMenus) {
+      if (result && result.result && reportMenus) {
+        setAllModules([...result.result, ...reportMenus, ...coreModules]);
+      } else {
+        //If there is no roles assigned to the user
+        setAllModules([...coreModules]);
+      }
     } else {
-      //If there is no roles assigned to the user
-      setAllModules([...coreModules]);
+      //  for nura
+      if (result && result.result.menus && reportMenus) {
+        setAllModules([...result.result.menus, ...reportMenus, ...coreModules]);
+      } else {
+        //If there is no roles assigned to the user
+        setAllModules([...coreModules]);
+      }
     }
-
-    
+    setLoader(false);
   }
-  setLoader(false);
-
-   }
-  
 
   /**
    * Load the scripts
@@ -257,6 +246,12 @@ export default function LandingApi({ history, CustomComponents, CustomModels, ap
 
             <Route exact key={'profile'} path={'/profile'} render={(props) => <Profile {...props} />} />
 
+            {/* More specific routes should come before general/dynamic routes */}
+
+
+            <Route path={'/reports/:id'} render={(props) => <ReportingDashboard CustomComponents={CustomComponents} {...props} />} />
+            
+
             <Route path={'/menus/:id'} render={() => <ModuleRoutes model={MenusAPI} />} />
 
             {/* <Switch> */}
@@ -273,9 +268,6 @@ export default function LandingApi({ history, CustomComponents, CustomModels, ap
               }}
             />
 
-            {/* <Route path={'/users'} render={() => <ModuleRoutes model={UsersAPI} />} /> */}
-
-            <Route path={'/reports/:id'} render={(props) => <ReportingDashboard CustomComponents={CustomComponents} {...props} />} />
 
             <Route exact key={'change-password'} path={'/change-password'} render={(props) => <ChangePassword {...props} />} />