issue fix : children parent mismatch in rendering tree.

projects/collection-editor-library/karma.conf.js

@@ -26,6 +26,7 @@ module.exports = function (config) {
     },
     coverageReporter: {
       dir: require('path').join(__dirname, 'coverage'),
+      subdir: '.',
       reporters: [
         { type: 'text-summary' },
         { type: 'html' },

projects/collection-editor-library/src/lib/components/fancy-tree/fancy-tree.component.spec.data.ts

@@ -54,6 +54,17 @@ export const config = {
     },
   },
 };
+export const questionChildren = [
+  { identifier: 'parent_id_1' },
+  { identifier: 'child_id_1' },
+  { identifier: 'parent_id_2' },
+  { identifier: 'child_id_2' }
+]
+
+export const questionBranchLogic = {
+  'identifier_1': { source: ['parent_id_1'] },
+  'identifier_2': { source: ['parent_id_2'] }
+}
 
 export const treeData = {
   ownershipType: ["createdBy"],
@@ -71,6 +82,80 @@ export const treeData = {
   primaryCategory: "Course Unit",
   children: [
     {
+      branchingLogic :{
+        "do_21376253446857523212056.img": {
+            "target": [
+                "do_21376253455625420812064.img",
+                "do_21376253456687104012065.img",
+                "do_21376253457749606412066.img"
+            ],
+            "preCondition": {},
+            "source": []
+        },
+        "do_21376253455625420812064.img": {
+            "target": [],
+            "preCondition": {
+                "and": [
+                    {
+                        "eq": [
+                            {
+                                "var": "do_21376253446857523212056.response1.value",
+                                "type": "interactions"
+                            },
+                            [
+                                0
+                            ]
+                        ]
+                    }
+                ]
+            },
+            "source": [
+                "do_21376253446857523212056.img"
+            ]
+        },
+        "do_21376253456687104012065.img": {
+            "target": [],
+            "preCondition": {
+                "and": [
+                    {
+                        "eq": [
+                            {
+                                "var": "do_21376253446857523212056.response1.value",
+                                "type": "interactions"
+                            },
+                            [
+                                1
+                            ]
+                        ]
+                    }
+                ]
+            },
+            "source": [
+                "do_21376253446857523212056.img"
+            ]
+        },
+        "do_21376253457749606412066.img": {
+            "target": [],
+            "preCondition": {
+                "and": [
+                    {
+                        "eq": [
+                            {
+                                "var": "do_21376253446857523212056.response1.value",
+                                "type": "interactions"
+                            },
+                            [
+                                2
+                            ]
+                        ]
+                    }
+                ]
+            },
+            "source": [
+                "do_21376253446857523212056.img"
+            ]
+        }
+      },
       children: [
         {
           id: "testid123",

projects/collection-editor-library/src/lib/components/fancy-tree/fancy-tree.component.spec.ts

@@ -6,7 +6,7 @@ import { NO_ERRORS_SCHEMA, ChangeDetectorRef } from '@angular/core';
 import { TelemetryInteractDirective } from '../../directives/telemetry-interact/telemetry-interact.directive';
 import { EditorTelemetryService } from '../../services/telemetry/telemetry.service';
 import { config, treeData, tree, editorConfig, TargetNodeMockData,
-  CurrentNodeMockData, mockTreeService, mockData, observationWithRubricsMockData, RubricstreeData } from './fancy-tree.component.spec.data';
+  CurrentNodeMockData, mockTreeService, mockData, observationWithRubricsMockData, RubricstreeData, questionChildren, questionBranchLogic } from './fancy-tree.component.spec.data';
 import { Router } from '@angular/router';
 import { TreeService } from '../../services/tree/tree.service';
 import { ToasterService } from '../../services/toaster/toaster.service';
@@ -471,6 +471,31 @@ describe('FancyTreeComponent', () => {
     expect(result.length).toBeGreaterThan(1);
   });
 
+  it('should arrange children correctly when branchingLogic is present', () => {
+    const data = {
+      branchingLogic: questionBranchLogic,
+      children: questionChildren
+    };
+    const expectedData = {
+      branchingLogic: questionBranchLogic,
+      children: questionChildren
+    };
+    // Expected data has the same children array as data, but with parents in correct order
+    const result = component.arrangeTreeChildren(data);
+    expect(result).toEqual(expectedData);
+  });
+
+  it('should return data unmodified when branchingLogic is not present', () => {
+    const data = {
+      children: questionChildren
+    };
+    const expectedData = {
+      children: questionChildren
+    };
+    const result = component.arrangeTreeChildren(data);
+    expect(result).toEqual(expectedData);
+  });
+
   it ('#checkContentAddition() should check node hitMode', () => {
     component.config = editorConfig;
     const targetNode = { folder: false, getLevel: () => 2 };

projects/collection-editor-library/src/lib/components/fancy-tree/fancy-tree.component.ts

@@ -110,6 +110,24 @@ export class FancyTreeComponent implements OnInit, AfterViewInit, OnDestroy {
     }];
   }
 
+  arrangeTreeChildren(data) {
+    for(const key in data.branchingLogic) {
+      let childrenIndex,parentId,parentIndex,item;
+      data.children.forEach((element:any,index:number) => {
+        if(element.identifier == key && data.branchingLogic[key].source.length > 0) { 
+          childrenIndex = index;
+          parentId = data.branchingLogic[key].source[0];
+        }})
+      if(childrenIndex >= 0) {
+        item = data.children[childrenIndex]
+        data.children.splice(childrenIndex,1)
+        parentIndex = data.children.findIndex((element) => element.identifier == parentId)
+        data.children.splice(parentIndex+1,0,item)
+      }
+    }
+    return data;
+  }
+
   buildTreeFromFramework(data, tree?, level?) {
     tree = tree || [];
     if (data.children) { data.children = _.sortBy(data.children, ['index']); }
@@ -160,6 +178,11 @@ export class FancyTreeComponent implements OnInit, AfterViewInit, OnDestroy {
   buildTree(data, tree?, level?) {
     tree = tree || [];
     if (data.children) { data.children = _.sortBy(data.children, ['index']); }
+    // This section will change the children array order to match with branching logic parent children order.
+    if(data.branchingLogic && Object.keys(data?.branchingLogic).length > 0) {
+      this.arrangeTreeChildren(data);
+    }
+    // section to add children in the tree.
     data.level = level ? (level + 1) : 1;
     _.forEach(data.children, (child) => {
       const childTree = [];
@@ -538,7 +561,6 @@ export class FancyTreeComponent implements OnInit, AfterViewInit, OnDestroy {
   }
 
   handleActionButtons(el) {
-    console.log('action buttons -------->', el.id);
     switch (el.id) {
       case 'edit':
         break;

src/karma.conf.js

@@ -17,6 +17,7 @@ module.exports = function (config) {
     },
     coverageReporter: {
       dir: require('path').join(__dirname, 'coverage'),
+      subdir: '.',
       reporters: [
         { type: 'text-summary' },
         { type: 'html' },