[Timeline] Fix react integration, fix content applying mechanics (#3760)

* Delete unnecessary appending content to the node

* Remove unndecessary rerender of React component

lib/timeline/component/Group.js

@@ -19,7 +19,7 @@ function Group (groupId, data, itemSet) {
   this.itemSet = itemSet;
   this.isVisible = null;
   this.stackDirty = true; // if true, items will be restacked on next redraw
-  
+
   if (data && data.nestedGroups) {
     this.nestedGroups = data.nestedGroups;
     if (data.showNested == false) {
@@ -135,11 +135,14 @@ Group.prototype.setData = function(data) {
   }
 
   if (content instanceof Element) {
-    this.dom.inner.appendChild(content);
     while (this.dom.inner.firstChild) {
       this.dom.inner.removeChild(this.dom.inner.firstChild);
     }
     this.dom.inner.appendChild(content);
+  } else if (content instanceof Object && content.isReactComponent) {
+    // Do nothing. Component was rendered into the node be ReactDOM.render.
+    // That branch is necessary for evasion of a second call templateFunction.
+    // Supports only React < 16(due to the asynchronous nature of React 16).
   } else if (content instanceof Object) {
     templateFunction(data, this.dom.inner);
   } else if (content !== undefined && content !== null) {
@@ -161,7 +164,7 @@ Group.prototype.setData = function(data) {
     if (!this.nestedGroups || this.nestedGroups != data.nestedGroups) {
       this.nestedGroups = data.nestedGroups;
     }
-    
+
     if (data.showNested !== undefined || this.showNested === undefined) {
       if (data.showNested == false) {
         this.showNested = false;
@@ -345,20 +348,20 @@ Group.prototype._redrawItems = function(forceRestack, lastIsVisible, margin, ran
 
       if (this.doInnerStack && this.itemSet.options.stackSubgroups) {
         // Order the items within each subgroup
-        for(subgroup in this.subgroups) {            
+        for(subgroup in this.subgroups) {
           visibleSubgroups[subgroup] = this.subgroups[subgroup].items.slice().sort(function (a, b) {
             return me.itemSet.options.order(a.data, b.data);
           });
         }
 
-        stack.stackSubgroupsWithInnerStack(visibleSubgroups, margin, this.subgroups);          
+        stack.stackSubgroupsWithInnerStack(visibleSubgroups, margin, this.subgroups);
       }
       else {
         // order all items and force a restacking
         var customOrderedItems = this.orderedItems.byStart.slice().sort(function (a, b) {
           return me.itemSet.options.order(a.data, b.data);
         });
-        this.shouldBailStackItems = stack.stack(customOrderedItems, margin, true, this._shouldBailItemsRedraw.bind(this));        
+        this.shouldBailStackItems = stack.stack(customOrderedItems, margin, true, this._shouldBailItemsRedraw.bind(this));
       }
 
       this.visibleItems = this._updateItemsInRange(this.orderedItems, this.visibleItems, range);
@@ -367,8 +370,8 @@ Group.prototype._redrawItems = function(forceRestack, lastIsVisible, margin, ran
       this.visibleItems = this._updateItemsInRange(this.orderedItems, this.visibleItems, range);
 
       if (this.itemSet.options.stack) {
-        if (this.doInnerStack && this.itemSet.options.stackSubgroups) {                    
-          for(subgroup in this.subgroups) {            
+        if (this.doInnerStack && this.itemSet.options.stackSubgroups) {
+          for(subgroup in this.subgroups) {
             visibleSubgroups[subgroup] = this.subgroups[subgroup].items;
           }
 
@@ -669,7 +672,6 @@ Group.prototype._addToSubgroup = function(item, subgroupId) {
   }
 
   this.subgroups[subgroupId].items.push(item);
-  
 };
 
 Group.prototype._updateSubgroupsSizes = function () {
@@ -681,8 +683,8 @@ Group.prototype._updateSubgroupsSizes = function () {
       var newEnd = initialEnd - 1;
 
       me.subgroups[subgroup].items.forEach(function(item) {
-        if (new Date(item.data.start) < new Date(newStart)) { 
-          newStart = item.data.start; 
+        if (new Date(item.data.start) < new Date(newStart)) {
+          newStart = item.data.start;
         }
 
         var itemEnd = item.data.end || item.data.start;