Эх сурвалжийг харах

HUE-8893 [assist] Lazy load all the left assist panels

Johan Ahlen 6 жил өмнө
parent
commit
27b668175d

+ 15 - 2
desktop/core/src/desktop/js/ko/components/assist/ko.assistAdlsPanel.js

@@ -90,7 +90,7 @@ const TEMPLATE =
             <!-- ko if: definition.type === 'file' -->
             <i class="fa fa-fw fa-file-o muted valign-middle"></i>
             <!-- /ko -->
-            <span draggable="true" data-bind="text: definition.name, draggableText: { text: '\\\\\\\\'' + path + '\\\\\\\\'', meta: {'type': 'adls', 'definition': definition} }"></span>
+            <span draggable="true" data-bind="text: definition.name, draggableText: { text: '\\'' + path + '\\'', meta: {'type': 'adls', 'definition': definition} }"></span>
           </a>
         </li>
       </ul>
@@ -156,6 +156,8 @@ class AssistAdlsPanel {
       huePubSub.publish('assist.clear.adls.cache');
       self.reload();
     });
+
+    self.init();
   }
 
   init() {
@@ -168,4 +170,15 @@ class AssistAdlsPanel {
   }
 }
 
-componentUtils.registerComponent('hue-assist-adls-panel', AssistAdlsPanel, TEMPLATE);
+let instance;
+
+const viewModelFactory = {
+  createViewModel: params => {
+    if (!instance) {
+      instance = new AssistAdlsPanel(params);
+    }
+    return instance;
+  }
+};
+
+componentUtils.registerComponent('hue-assist-adls-panel', viewModelFactory, TEMPLATE);

+ 15 - 1
desktop/core/src/desktop/js/ko/components/assist/ko.assistDbPanel.js

@@ -809,6 +809,8 @@ class AssistDbPanel {
       }
       return null;
     });
+
+    self.init();
   }
 
   setDatabaseWhenLoaded(namespace, databaseName) {
@@ -891,4 +893,16 @@ class AssistDbPanel {
   }
 }
 
-componentUtils.registerComponent('hue-assist-db-panel', AssistDbPanel, TEMPLATE);
+const instances = {};
+
+const viewModelFactory = {
+  createViewModel: params => {
+    const name = params.isStreams ? 'streams' : params.isSolr ? 'solr' : 'sql';
+    if (!instances[name]) {
+      instances[name] = new AssistDbPanel(params);
+    }
+    return instances[name];
+  }
+};
+
+componentUtils.registerComponent('hue-assist-db-panel', viewModelFactory, TEMPLATE);

+ 14 - 1
desktop/core/src/desktop/js/ko/components/assist/ko.assistDocumentsPanel.js

@@ -341,6 +341,8 @@ class AssistDocumentsPanel {
         );
       }
     });
+
+    self.init();
   }
 
   setTypeFilter(newType) {
@@ -397,4 +399,15 @@ class AssistDocumentsPanel {
   }
 }
 
-componentUtils.registerComponent('hue-assist-documents-panel', AssistDocumentsPanel, TEMPLATE);
+let instance;
+
+const viewModelFactory = {
+  createViewModel: params => {
+    if (!instance) {
+      instance = new AssistDocumentsPanel(params);
+    }
+    return instance;
+  }
+};
+
+componentUtils.registerComponent('hue-assist-documents-panel', viewModelFactory, TEMPLATE);

+ 15 - 2
desktop/core/src/desktop/js/ko/components/assist/ko.assistGitPanel.js

@@ -65,7 +65,7 @@ const TEMPLATE = `
             <!-- ko ifnot: definition.type === 'dir' -->
             <i class="fa fa-fw fa-file-o muted valign-middle"></i>
             <!-- /ko -->
-            <span draggable="true" data-bind="text: definition.name, draggableText: { text: '\\\\'' + path + '\\\\'', meta: {'type': 'git', 'definition': definition} }"></span>
+            <span draggable="true" data-bind="text: definition.name, draggableText: { text: '\\'' + path + '\\'', meta: {'type': 'git', 'definition': definition} }"></span>
           </a>
         </li>
       </ul>
@@ -126,6 +126,8 @@ class AssistGitPanel {
       huePubSub.publish('assist.clear.git.cache');
       self.reload();
     });
+
+    self.init();
   }
 
   init() {
@@ -133,4 +135,15 @@ class AssistGitPanel {
   }
 }
 
-componentUtils.registerComponent('hue-assist-git-panel', AssistGitPanel, TEMPLATE);
+let instance;
+
+const viewModelFactory = {
+  createViewModel: params => {
+    if (!instance) {
+      instance = new AssistGitPanel(params);
+    }
+    return instance;
+  }
+};
+
+componentUtils.registerComponent('hue-assist-git-panel', viewModelFactory, TEMPLATE);

+ 15 - 2
desktop/core/src/desktop/js/ko/components/assist/ko.assistHBasePanel.js

@@ -69,7 +69,7 @@ const TEMPLATE = `
             <!-- ko ifnot: definition.host -->
             <i class="fa fa-fw fa-th muted valign-middle"></i>
             <!-- /ko -->
-            <span draggable="true" data-bind="text: definition.name, draggableText: { text: '\\\\'' + definition.name + '\\\\'', meta: {'type': 'collection', 'definition': definition} }"></span>
+            <span draggable="true" data-bind="text: definition.name, draggableText: { text: '\\'' + definition.name + '\\'', meta: {'type': 'collection', 'definition': definition} }"></span>
           </a>
         </li>
       </ul>
@@ -192,6 +192,8 @@ class AssistHBasePanel {
       huePubSub.publish('assist.clear.hbase.cache');
       self.reload();
     });
+
+    self.init();
   }
 
   init() {
@@ -204,4 +206,15 @@ class AssistHBasePanel {
   }
 }
 
-componentUtils.registerComponent('hue-assist-hbase-panel', AssistHBasePanel, TEMPLATE);
+let instance;
+
+const viewModelFactory = {
+  createViewModel: params => {
+    if (!instance) {
+      instance = new AssistHBasePanel(params);
+    }
+    return instance;
+  }
+};
+
+componentUtils.registerComponent('hue-assist-hbase-panel', viewModelFactory, TEMPLATE);

+ 15 - 2
desktop/core/src/desktop/js/ko/components/assist/ko.assistHdfsPanel.js

@@ -110,7 +110,7 @@ const TEMPLATE =
             <!-- ko if: definition.type === 'file' -->
             <i class="fa fa-fw fa-file-o muted valign-middle"></i>
             <!-- /ko -->
-            <span draggable="true" data-bind="text: definition.name, draggableText: { text: '\\\\'' + path + '\\\\'', meta: {'type': 'hdfs', 'definition': definition} }"></span>
+            <span draggable="true" data-bind="text: definition.name, draggableText: { text: '\\'' + path + '\\'', meta: {'type': 'hdfs', 'definition': definition} }"></span>
           </a>
         </li>
       </ul>
@@ -180,6 +180,8 @@ class AssistHdfsPanel {
       huePubSub.publish('assist.clear.hdfs.cache');
       self.reload();
     });
+
+    self.init();
   }
 
   init() {
@@ -192,6 +194,17 @@ class AssistHdfsPanel {
   }
 }
 
-componentUtils.registerComponent('hue-assist-hdfs-panel', AssistHdfsPanel, TEMPLATE);
+let instance;
+
+const viewModelFactory = {
+  createViewModel: params => {
+    if (!instance) {
+      instance = new AssistHdfsPanel(params);
+    }
+    return instance;
+  }
+};
+
+componentUtils.registerComponent('hue-assist-hdfs-panel', viewModelFactory, TEMPLATE);
 
 export default HDFS_CONTEXT_ITEMS_TEMPLATE;

+ 10 - 18
desktop/core/src/desktop/js/ko/components/assist/ko.assistPanel.js

@@ -209,13 +209,16 @@ class AssistPanel {
             appConfig['browser']['interpreter_names'].indexOf('kafka') !== -1
           ) {
             const streamsPanel = new AssistInnerPanel({
-              panelData: $.extend(
-                {
-                  i18n: i18nCollections,
-                  isStreams: true
-                },
-                params.sql
-              ),
+              panelData: {
+                name: 'hue-assist-db-panel',
+                params: $.extend(
+                  {
+                    i18n: i18nCollections,
+                    isStreams: true
+                  },
+                  params.sql
+                )
+              },
               name: I18n('Streams'),
               type: 'kafka',
               icon: 'fa-sitemap',
@@ -319,19 +322,8 @@ class AssistPanel {
         return panel.type === self.lastOpenPanelType();
       });
 
-      // always forces the db panel to load
-      const dbPanel = self.availablePanels().filter(panel => {
-        return panel.type === 'sql';
-      });
-      if (dbPanel.length > 0) {
-        dbPanel[0].panelData.init();
-      }
-
       self.visiblePanel.subscribe(newValue => {
         self.lastOpenPanelType(newValue.type);
-        if (newValue.type !== 'sql' && !newValue.panelData.initialized) {
-          newValue.panelData.init();
-        }
       });
 
       self.visiblePanel(

+ 15 - 2
desktop/core/src/desktop/js/ko/components/assist/ko.assistS3Panel.js

@@ -75,7 +75,7 @@ const TEMPLATE =
             <!-- ko if: definition.type === 'file' -->
             <i class="fa fa-fw fa-file-o muted valign-middle"></i>
             <!-- /ko -->
-            <span draggable="true" data-bind="text: definition.name, draggableText: { text: '\\\\'' + path + '\\\\'', meta: {'type': 's3', 'definition': definition} }"></span>
+            <span draggable="true" data-bind="text: definition.name, draggableText: { text: '\\'' + path + '\\'', meta: {'type': 's3', 'definition': definition} }"></span>
           </a>
         </li>
       </ul>
@@ -138,6 +138,8 @@ class AssistS3Panel {
       huePubSub.publish('assist.clear.s3.cache');
       self.reload();
     });
+
+    self.init();
   }
 
   init() {
@@ -150,4 +152,15 @@ class AssistS3Panel {
   }
 }
 
-componentUtils.registerComponent('hue-assist-s3-panel', AssistS3Panel, TEMPLATE);
+let instance;
+
+const viewModelFactory = {
+  createViewModel: params => {
+    if (!instance) {
+      instance = new AssistS3Panel(params);
+    }
+    return instance;
+  }
+};
+
+componentUtils.registerComponent('hue-assist-s3-panel', viewModelFactory, TEMPLATE);