Sfoglia il codice sorgente

HUE-2962 [editor] Support new session properties in the editor

Johan Ahlen 9 anni fa
parent
commit
a93e3b4d38

+ 13 - 0
desktop/libs/notebook/src/notebook/static/notebook/css/notebook.css

@@ -766,6 +766,15 @@ table.airy tr td {
   right: 0;
 }
 
+.property-help {
+  display: inline-block;
+  width: 10px;
+  height: 14px;
+  margin-left: 7px;
+  font-size: 14px;
+  color: #888;
+}
+
 .hover-dropdown {
   display: inline-block;
   position: relative;
@@ -949,6 +958,7 @@ h4.header {
 .history-item .ace_invalid {
   display: none;
 }
+
 .history-item .ace_line {
   white-space: normal;
 }
@@ -980,4 +990,7 @@ h4.header {
 #helpModal .tab-content {
   min-height: 355px;
   max-height: 355px;
+
+.tooltip {
+  z-index: 3000 !important;
 }

+ 10 - 9
desktop/libs/notebook/src/notebook/templates/editor_components.mako

@@ -1196,11 +1196,13 @@ ${ hueIcons.symbols() }
 
 <script type="text/html" id="property">
   <div data-bind="visibleOnHover: { selector: '.hover-actions' }, css: { 'spark-property' : typeof inline === 'undefined' || inline, 'control-group' : typeof inline !== 'undefined' && ! inline }">
-    <label class="control-label" data-bind="text: label, style: { 'width' : typeof inline === 'undefined' || inline ? '120px' : '' }"></label>
+    <label class="control-label" data-bind="style: { 'width' : typeof inline === 'undefined' || inline ? '120px' : '' }">
+      <!-- ko text: label --><!-- /ko --><!-- ko if: typeof helpText !== 'undefined' --><div class="property-help" data-bind="tooltip: { title: helpText(), placement: 'bottom' }"><i class="fa fa-question-circle-o"></i></div><!-- /ko -->
+    </label>
     <div class="controls" style="margin-right:10px;" data-bind="style: { 'margin-left' : typeof inline === 'undefined' || inline ? '140px' : '' }">
       <!-- ko template: { name: 'property-' + type } --><!-- /ko -->
     </div>
-    <!-- ko ifnot: typeof remove === "undefined" -->
+    <!-- ko if: typeof remove !== "undefined" -->
     <div class="hover-actions spark-property-remove">
       <a class="inactive-action" href="javascript:void(0)" data-bind="click: remove" title="${ _('Remove') }">
         <i class="fa fa-times"></i>
@@ -1810,21 +1812,20 @@ ${ hueIcons.symbols() }
                 </a>
               </div>
               <!-- /ko -->
-              <!-- ko if: ['pyspark', 'spark'].indexOf(type()) != -1 && typeof properties != 'undefined' -->
               <div style="display:block; width:100%;">
                 <!-- ko foreach: properties -->
                   <!-- ko template: {
                     name: 'property',
                     data: {
-                      type: $root.getSessionProperties(name()).type,
-                      label: $root.getSessionProperties(name()).nice_name,
+                      type: type(),
+                      label: nice_name,
+                      helpText: help_text,
                       value: value,
-                      remove: function () { $parent.properties.remove($data) }
+                      visibleObservable: ko.observable()
                     }
                   } --><!-- /ko -->
                 <!-- /ko -->
               </div>
-              <!-- /ko -->
               <div style="clear:both; padding-left: 120px;">
                 <!-- ko if: availableNewProperties().length -->
                 <select data-bind="options: availableNewProperties,
@@ -1840,10 +1841,10 @@ ${ hueIcons.symbols() }
                 </a>
                 <!-- /ko -->
                 <a style="float: right;" class="btn pointer" title="${ _('Recreate session') }" rel="tooltip" data-bind="click: function() { $root.selectedNotebook().restartSession($data) }">
-                  <i class="fa fa-refresh" data-bind="css: { 'fa-spin': restarting }"></i> ${ _('Recreate') }
+                  <i class="fa fa-refresh" data-bind="css: { 'fa-spin': restarting }"></i> ${ _('Recreate Session') }
                 </a>
                 <a style="margin-right: 5px; float: right;" class="btn pointer" title="${ _('Close session') }" rel="tooltip" data-bind="click: function() { $root.selectedNotebook().closeAndRemoveSession($data) }">
-                  <i class="fa fa-times"></i> ${ _('Close') }
+                  <i class="fa fa-times"></i> ${ _('Close Session') }
                 </a>
               </div>
               <!-- /ko -->