Jelajahi Sumber

HUE-8768 [editor] Display the live results of a query

id="wsResult" to remove and prettify.
Romain 5 tahun lalu
induk
melakukan
f14c1b8450

+ 5 - 1
desktop/core/src/desktop/js/apps/notebook2/components/ko.snippetResults.js

@@ -71,7 +71,7 @@ const TEMPLATE = `
     </div>
     </div>
     <div class="table-results" data-bind="visible: type() === 'table'" style="display: none;">
     <div class="table-results" data-bind="visible: type() === 'table'" style="display: none;">
       <div data-bind="visible: !executing() && hasData() && showGrid()" style="display: none; position: relative;">
       <div data-bind="visible: !executing() && hasData() && showGrid()" style="display: none; position: relative;">
-        <!-- ko component: { 
+        <!-- ko component: {
           name: 'result-grid',
           name: 'result-grid',
           params: {
           params: {
             activeExecutable: activeExecutable,
             activeExecutable: activeExecutable,
@@ -116,6 +116,8 @@ const TEMPLATE = `
       <div data-bind="visible: executing" style="display: none;">
       <div data-bind="visible: executing" style="display: none;">
         <h1 class="empty"><i class="fa fa-spinner fa-spin"></i> ${ I18n('Executing...') }</h1>
         <h1 class="empty"><i class="fa fa-spinner fa-spin"></i> ${ I18n('Executing...') }</h1>
       </div>
       </div>
+      <div id="wsResult">
+      </div>
     </div>
     </div>
   </div>
   </div>
 </div>
 </div>
@@ -225,6 +227,8 @@ class SnippetResults extends DisposableComponent {
     this.cleanedStringMeta([]);
     this.cleanedStringMeta([]);
     this.hasMore(false);
     this.hasMore(false);
     this.type(RESULT_TYPE.TABLE);
     this.type(RESULT_TYPE.TABLE);
+    // eslint-disable-next-line no-undef
+    $('#wsResult').empty();
   }
   }
 
 
   updateFromExecutionResult(executionResult, refresh) {
   updateFromExecutionResult(executionResult, refresh) {

+ 10 - 0
desktop/core/src/desktop/js/apps/notebook2/execution/executionResult.js

@@ -64,6 +64,16 @@ const COMPLEX_TYPES = {
   struct: true
   struct: true
 };
 };
 
 
+huePubSub.subscribe('editor.ws.query.fetch_result', executionResult => {
+  if (executionResult.status != 'finalMessage') {
+    const result = new ExecutionResult(null);
+    result.fetchedOnce = true;
+    result.handleResultResponse(executionResult);
+    // eslint-disable-next-line no-undef
+    $('#wsResult').append('<div>' + executionResult.data + '</div>');
+  }
+});
+
 export default class ExecutionResult {
 export default class ExecutionResult {
   /**
   /**
    *
    *

+ 5 - 3
desktop/libs/kafka/src/kafka/ksql_client.py

@@ -117,7 +117,9 @@ class KSqlApi(object):
     if is_select or is_print:
     if is_select or is_print:
       result = self.client.query(statement)
       result = self.client.query(statement)
 
 
-      metadata = [['Row', 'STRING']]
+      metadata = [
+        {'type': 'STRING', 'name': 'Row', 'comment': None}
+      ]
 
 
       if has_channels() and channel_name:
       if has_channels() and channel_name:
         _send_to_channel(
         _send_to_channel(
@@ -155,7 +157,7 @@ class KSqlApi(object):
           _send_to_channel(
           _send_to_channel(
               channel_name,
               channel_name,
               message_type='task.result',
               message_type='task.result',
-              message_data={'data': data, 'metadata': metadata, 'query_id': 1}
+              message_data={'data': data, 'meta': metadata, 'query_id': 1}
           )
           )
           data = []  # TODO: special message when end of stream
           data = []  # TODO: special message when end of stream
     else:
     else:
@@ -167,7 +169,7 @@ class KSqlApi(object):
         _send_to_channel(
         _send_to_channel(
             channel_name,
             channel_name,
             message_type='task.result',
             message_type='task.result',
-            message_data={'data': data, 'metadata': metadata, 'query_id': 1}
+            message_data={'data': data, 'meta': metadata, 'query_id': 1}
         )
         )
         data = []  # TODO: special message when end of stream
         data = []  # TODO: special message when end of stream
 
 

+ 2 - 2
desktop/libs/notebook/src/notebook/connectors/ksql.py

@@ -73,8 +73,8 @@ class KSqlApi(Api):
           'has_more': False,
           'has_more': False,
           'data': data if has_result_set else [],
           'data': data if has_result_set else [],
           'meta': [{
           'meta': [{
-            'name': col[0],
-            'type': col[1],
+            'name': col['name'],
+            'type': col['type'],
             'comment': ''
             'comment': ''
           } for col in description
           } for col in description
         ] if has_result_set else [],
         ] if has_result_set else [],

+ 18 - 16
desktop/libs/notebook/src/notebook/templates/editor_components2.mako

@@ -1578,23 +1578,25 @@
     });
     });
 
 
     % if conf.WEBSOCKETS.ENABLED.get():
     % if conf.WEBSOCKETS.ENABLED.get():
-        var editorWs = new WebSocket('ws://' + window.location.host + '/ws/editor/results/' + 'userA' + '/');
-
-        editorWs.onopen = function(e) {
-          console.info('Notification socket open.');
-        };
-
-        editorWs.onmessage = function(e) {
-          var data = JSON.parse(e.data);
-          if (data['type'] == 'channel_name') {
-            window.WS_CHANNEL = data['data'];
-          }
-          console.log(data);
-        };
+      var editorWs = new WebSocket('ws://' + window.location.host + '/ws/editor/results/' + 'userA' + '/');
+
+      editorWs.onopen = function(e) {
+        console.info('Notification socket open.');
+      };
+
+      editorWs.onmessage = function(e) {
+        var data = JSON.parse(e.data);
+        if (data['type'] == 'channel_name') {
+          window.WS_CHANNEL = data['data'];
+        } else if (data['type'] == 'query_result') {
+          huePubSub.publish('editor.ws.query.fetch_result', data['data']);
+        }
+        console.log(data);
+      };
 
 
-        editorWs.onclose = function(e) {
-          console.error('Chat socket closed unexpectedly');
-        };
+      editorWs.onclose = function(e) {
+        console.error('Chat socket closed unexpectedly');
+      };
     % endif
     % endif
 
 
     window.EDITOR_ENABLE_QUERY_SCHEDULING = '${ ENABLE_QUERY_SCHEDULING.get() }' === 'True';
     window.EDITOR_ENABLE_QUERY_SCHEDULING = '${ ENABLE_QUERY_SCHEDULING.get() }' === 'True';