@kumologica/sdk 3.4.0-beta9 → 3.5.0-beta1

package/src/app/ui/editor-client/public/red/red.js

@@ -684,6 +684,7 @@ jQuery.propHooks.disabled = {
     // Modals
     RED.modalNewProject.init();
     RED.modalNewTab.init();
+    RED.modalRenameTab.init();
     RED.modalHome.init();
     RED.modalWelcome.init();
     RED.updatePanel.init();
@@ -14678,11 +14679,13 @@ RED.h = handlers;
     var workspaceOrder = RED.nodes.getWorkspaceOrder();
     ws._index = workspaceOrder.indexOf(ws.id);
     removeWorkspace(ws);
+
     // var historyEvent = RED.nodes.removeWorkspace(ws.id);
     // historyEvent.t = 'delete';
     // historyEvent.dirty = RED.nodes.dirty();
     // historyEvent.workspaces = [ws];
     // RED.history.push(historyEvent);
+
     RED.nodes.dirty(true);
     RED.sidebar.config.refresh();
   }
@@ -15113,6 +15116,17 @@ RED.h = handlers;
 
   }
 
+  function renameTabFn(id, newLabel){
+    if (workspace_tabs) {
+      closeWorkspace(id);
+      RED.nodes.eachWorkspace(function(ws) {
+        if (ws.id === id){
+          ws.label =  newLabel;
+        }
+      });
+    }
+  }
+
   function setWorkspaceOrder(order) {
     RED.nodes.setWorkspaceOrder(
       order.filter(function(id) {
@@ -15131,6 +15145,7 @@ RED.h = handlers;
     contains: function(id) {
       return workspace_tabs.contains(id);
     },
+    renameTab: renameTabFn,
     count: function() {
       return workspaceTabCount;
     },
@@ -21050,7 +21065,7 @@ RED.view.tools = (function() {
     $('#sidebar').width(targetWidth);
     
     // Hack: Make sure the workspace if reset before maximizing the sidebar. This is because when dragging the sidebar the workspace width is also modified
-    $('#workspace').css('right', 491);
+    $('#workspace').css('right', 485);
     RED.events.emit('sidebar:resize');
   }
 
@@ -26525,115 +26540,156 @@ RED.sidebar.azure = (function () {
   let path = window.__kumologica.libs.path;
 
   const openProject = (projectLocation) => {
-    window.__kumologica.main.dispatch('modal-home:open-project-in-editor', { 
-      payload: { 
-        projectLocation 
-      } 
+    if (projectLocation === RED.projectInfo.getWorkspaceInfo()[0].path) {
+      RED.notify(`<strong>Warning</strong>: "${path.basename(projectLocation)}" project is already opened.`, 'warning');
+      return;
+    }
+    
+    window.__kumologica.main.dispatch('modal-home:open-project-in-editor', {
+      payload: {
+        projectLocation
+      }
     });
   }
-  
+
   const initCurrentProject = () => {
-     // Add Tab button
-     let addTabBtn = `<div id="createTab" class="header-btn2"><i class="icofont-plus"></i></div>`;
-     $(addTabBtn).appendTo($('#exp-open-project-createTab'));
-     RED.popover.tooltip($('#exp-open-project-createTab'), 'Create Tab...');
-
-     $('#createTab').on('click', event => {
-       event.stopPropagation();
-       window.__kumologica.main.dispatch('navigator:open-new-tab-dialog', null);
-     })
- 
-     // Initialize the palette explorer with folder only
-     let data = [
-       {   id: '__root__',
-           name: 'OPEN PROJECT',
-           children: []
-       }
-     ];
- 
-     try{
+    // Add Tab button
+    let addTabBtn = `<div id="createTab" class="header-btn2"><i class="icofont-plus"></i></div>`;
+    $(addTabBtn).appendTo($('#exp-open-project-createTab'));
+    RED.popover.tooltip($('#exp-open-project-createTab'), 'Create Tab...');
+
+    $('#createTab').on('click', event => {
+      event.stopPropagation();
+      window.__kumologica.main.dispatch('navigator:open-new-tab-dialog', null);
+    })
+
+    // Initialize the palette explorer with folder only
+    let data = [
+      {
+        id: '__root__',
+        name: 'OPEN PROJECT',
+        children: []
+      }
+    ];
+
+    try {
       if (!window.jqtree) return; // Hack - otherwise the nodeLibrary modal fail to load due to this library being missed
 
-       $('#exp-open-project').tree({
-         data:data,
-         autoOpen: true,
-         selectable: true,
-         onCanSelectNode: function(node) {
-           if (node.id === '__root__'){
-             $('#exp-open-project').tree('toggle', node);
-             return false;
-           } else { 
-             return true;
-           }
-           
-         },
-         usecontextmenu: true,
-         closedIcon: $('<i class="icofont-rounded-right"></i>'),
-         openedIcon: $('<i class="icofont-rounded-down"></i>'),
-         onCreateLi: function(node, $li) { 
-          if (node.id !== '__root__'){
+      $('#exp-open-project').tree({
+        data: data,
+        autoOpen: true,
+        selectable: true,
+        onCanSelectNode: function (node) {
+          if (node.id === '__root__') {
+            $('#exp-open-project').tree('toggle', node);
+            return false;
+          } else {
+            return true;
+          }
+
+        },
+        usecontextmenu: true,
+        closedIcon: $('<i class="icofont-rounded-right"></i>'),
+        openedIcon: $('<i class="icofont-rounded-down"></i>'),
+        onCreateLi: function (node, $li) {
+          if (node.id !== '__root__') {
             $li.find('.jqtree-title').before('<span class="icon tab-icon">T</span>');
           }
-         }
-       });
- 
-       // Add the context menu
-       $('#exp-open-project').jqTreeContextMenu({
-         menu: '#palette-explorer-context-menu',
-         onContextMenuItem: function(e, node, $el){
-           let operation = $el.data("item");
-           switch(operation) {
-             case "open": 
-               RED.workspaces.showSafe(node.id);
-               break;
-             case "delete": {
-               RED.actions.invoke('core:deploy');
-               RED.workspaces.remove(node.id);
-               RED.actions.invoke('core:deploy'); // save it so we can persist the tab straight away.
-               refresh();
-               break;
-             }
-             default: {}
-           }
-           
-         }
-       });
-     }catch(err) {
-       // HACK: case where a modal is using this module, which it has no biz on tree
-     }
- 
-     let ipcRenderer = window.__kumologica.electron.ipcRenderer;
-     ipcRenderer.on('create-new-tab', (event, payload)=> {
-       let tabName = payload.tabName;
-       if (tabName){
-         createTabFn(tabName.toLowerCase());
-       }
-       
-     });
- 
-     // On select tab option
-     $('#exp-open-project').on(
-       'tree.select',
-       function(event) {
-           event.stopImmediatePropagation();
-           if (event.node) {
-               // node was selected
-               var node = event.node;
-               if (node.id){
-                 RED.workspaces.showSafe(node.id);
-               }
-           }
-           else {
-             var prevNode = event.previous_node
-             if (prevNode.id){
-               RED.workspaces.showSafe(prevNode.id);
-               selectTab(prevNode.id);
-             }
-           }
-       }
-     );
-    
-     refresh();
+        }
+      });
+
+      // Add the context menu
+      $('#exp-open-project').jqTreeContextMenu({
+        menu: '#palette-explorer-context-menu',
+        onContextMenuItem: function (e, node, $el) {
+          let operation = $el.data("item");
+          switch (operation) {
+            case "open":
+              RED.workspaces.showSafe(node.id);
+              break;
+            case "renameTab":
+              window.__kumologica.main.dispatch('navigator:open-rename-tab-dialog', {
+                  tabId: node.id,
+                  oldTabName: node.name
+              });
+              break;
+            case "deleteTab": {
+              // Lets put a confirmation dialog before deleting the tab...
+              
+              let currentWindow = window.__kumologica.electron.remote.getCurrentWindow()
+              let dialog = window.__kumologica.electron.remote.dialog;
+              let options = {
+                title: 'Warning',
+                type: 'warning',
+                message: `Are you sure you want to permanently delete the "${node.name}" tab?`,
+                detail: 'This operation is irreversible',
+                checkboxLabel: 'I have read and understand these effects.',
+                buttons: ['Cancel', 'Delete'],
+              };
+              dialog.showMessageBox(currentWindow, options).then((result) => {
+                // result.response 0 = Cancel, 1 = Delete
+                // result.checkboxChecked = true if checkbox is checked
+                if (result.response === 1 && result.checkboxChecked) {
+                  RED.actions.invoke('core:deploy');
+                  RED.workspaces.remove(node.id);
+                  RED.actions.invoke('core:deploy'); // save it so we can persist the tab straight away.
+                  refresh();
+                }
+              });
+              
+              break;
+            }
+            default: { }
+          }
+
+        }
+      });
+    } catch (err) {
+      // HACK: case where a modal is using this module, which it has no biz on tree
+    }
+
+    // [=== Comms coming from the main thread ===]
+    let ipcRenderer = window.__kumologica.electron.ipcRenderer;
+    // Create tab...
+    ipcRenderer.on('create-new-tab', (event, payload) => {
+      let tabName = payload.tabName;
+      if (tabName) {
+        createTabFn(tabName.toLowerCase());
+      }
+    });
+    // Rename tab...
+    ipcRenderer.on('explorer:rename-tab', (event, payload) => {
+      const {tabId , newTabName} = payload;
+      RED.workspaces.renameTab(tabId, newTabName);
+      RED.nodes.dirty(true); // force dirty to true so the deployment pickup the changes
+      RED.actions.invoke('core:deploy'); // save it so we can persist the tab straight away.
+      refresh();
+    });
+
+
+    // On select tab option
+    $('#exp-open-project').on(
+      'tree.dblclick',
+      function (event) {
+        event.stopImmediatePropagation();
+        if (event.node) {
+          // node was selected
+          var node = event.node;
+          if (node.id) {
+            RED.workspaces.showSafe(node.id);
+          }
+        }
+        else {
+          var prevNode = event.previous_node
+          if (prevNode.id) {
+            RED.workspaces.showSafe(prevNode.id);
+            selectTab(prevNode.id);
+          }
+        }
+      }
+    );
+
+    refresh();
   }
 
   const initWorkspaceProjects = () => {
@@ -26641,7 +26697,7 @@ RED.sidebar.azure = (function () {
     let addProjectToWorkspaceBtn = `<div id="addProjectToWorkspace" class="header-btn2"><i class="icofont-plus"></i></div>`;
     $(addProjectToWorkspaceBtn).appendTo($('#exp-workspace-addFolder'));
     RED.popover.tooltip($('#exp-workspace-addFolder'), 'Add Project to Workspace...');
-    
+
     // Add action to the add button
     $('#addProjectToWorkspace').click((event) => {
 
@@ -26652,10 +26708,10 @@ RED.sidebar.azure = (function () {
         properties: ['openDirectory', 'multiSelections'],
       };
       dialog.showOpenDialog(currentWindow, options).then((result) => {
-        if (!result.canceled){
+        if (!result.canceled) {
           let projects = result.filePaths;
           projects.forEach(project => {
-            let valid = window.__kumologica.libs.findKumologicaFlowInDir(project); 
+            let valid = window.__kumologica.libs.findKumologicaFlowInDir(project);
             if (valid) {
               workspacePreferences.addProjectToWorkspace(project);
             } else {
@@ -26667,24 +26723,25 @@ RED.sidebar.azure = (function () {
       });
     });
 
-     // Initialize the projects in workspace
-     let data = [
-      {   id: '__root__',
-          name: 'WORKSPACE PROJECTS',
-          children: []
+    // Initialize the projects in workspace
+    let data = [
+      {
+        id: '__root__',
+        name: 'WORKSPACE PROJECTS',
+        children: []
       }
     ];
 
-    try{
+    try {
       $('#exp-workspace').tree({
-        data:data,
+        data: data,
         autoOpen: true,
         selectable: true,
-        onCanSelectNode: function(node) {
-          if (node.id === '__root__'){
+        onCanSelectNode: function (node) {
+          if (node.id === '__root__') {
             $('#exp-workspace').tree('toggle', node);
             return false;
-          } else { 
+          } else {
             const el = $(node.element);
             const selectionRequired = !el.hasClass('jqtree-selected');
             // Deselect all nodes
@@ -26693,16 +26750,16 @@ RED.sidebar.azure = (function () {
             if (selectionRequired) {
               el.addClass('jqtree-selected');
             }
-            
+
             return false;
           }
-          
+
         },
         usecontextmenu: true,
         closedIcon: $('<i class="icofont-rounded-right"></i>'),
         openedIcon: $('<i class="icofont-rounded-down"></i>'),
-        onCreateLi: function(node, $li) {
-          if (node.id !== '__root__'){
+        onCreateLi: function (node, $li) {
+          if (node.id !== '__root__') {
             RED.popover.tooltip(
               $li.find('.jqtree-title'),
               node.path
@@ -26715,13 +26772,13 @@ RED.sidebar.azure = (function () {
       // Add the context menu
       $('#exp-workspace').jqTreeContextMenu({
         menu: '#palette-workspace-context-menu',
-        onContextMenuItem: function(e, node, $el){
-          
+        onContextMenuItem: function (e, node, $el) {
+
           let operation = $el.data("item");
           let projectLocation = node.path;
 
-          switch(operation) {
-            case "open": 
+          switch (operation) {
+            case "open":
               openProject(projectLocation);
               break;
             case "openLocation":
@@ -26732,12 +26789,12 @@ RED.sidebar.azure = (function () {
               refreshWorkspaceProjects();
               break;
             }
-            default: {}
+            default: { }
           }
-          
+
         }
       });
-    }catch(err) {
+    } catch (err) {
       // HACK: case where a modal is using this module, which it has no biz on tree
     }
 
@@ -26745,11 +26802,11 @@ RED.sidebar.azure = (function () {
     // On select tab option
     $('#exp-workspace').on(
       'tree.dblclick',
-      function(event) {
-          event.stopImmediatePropagation();
-          if (event.node && event.node.path) {
-                openProject(event.node.path)
-          }
+      function (event) {
+        event.stopImmediatePropagation();
+        if (event.node && event.node.path) {
+          openProject(event.node.path)
+        }
       }
     );
 
@@ -26763,15 +26820,15 @@ RED.sidebar.azure = (function () {
   }
 
   const createTabFn = (newTabName) => {
-    try{
+    try {
       // RED.actions.invoke('core:deploy');
-      RED.workspaces.add(undefined,  undefined, undefined, newTabName);
+      RED.workspaces.add(undefined, undefined, undefined, newTabName);
       RED.actions.invoke('core:deploy'); // save it so we can persist the tab straight away.
       refresh();
-    } catch(err){
+    } catch (err) {
       RED.notify(`<strong>Error</strong>: "${newTabName}" tab already exists.`, 'error');
     }
-    
+
   }
 
   const selectTab = (nodeId) => {
@@ -26783,14 +26840,14 @@ RED.sidebar.azure = (function () {
 
   const refreshTabs = () => {
     if (!RED.workspaces.tabs() || RED.workspaces.tabs().length === 0) return;
-    
+
     const tabs = RED.nodes.listWorkspaces();
     const currentProjectName = RED.projectInfo.getWorkspaceInfo()[0].name;
     let data = [
       {
-          id: '__root__',
-          name: currentProjectName,
-          children: []
+        id: '__root__',
+        name: currentProjectName,
+        children: []
       }
     ];
 
@@ -26799,39 +26856,52 @@ RED.sidebar.azure = (function () {
     }
 
     $('#exp-open-project').tree('loadData', data);
+    // Add a tooltip to the current project name with the path that is located.
+    RED.popover.tooltip(
+      $('#exp-open-project').find('div').first(),
+      RED.projectInfo.getWorkspaceInfo()[0].path
+    );
+
   }
 
-  const refreshWorkspaceProjects = () => {  
+  const refreshWorkspaceProjects = () => {
     let projects = workspacePreferences.getWorkspaceProjects();
 
     // Initialize the tree with empty data
     let data = [
       {
-          id: '__root__',
-          name: 'WORKSPACE PROJECTS',
-          children: []
+        id: '__root__',
+        name: 'WORKSPACE PROJECTS',
+        children: []
       }
     ];
-    
-    
+
+
     // Update the data with info from workspace preferences
-    if (projects){
-      let projectsAZ = projects.sort((a,b)=> path.basename(a).localeCompare(path.basename(b)));
+    if (projects) {
+      let projectsAZ = projects.sort((a, b) => path.basename(a).localeCompare(path.basename(b)));
       projectsAZ.forEach((project, index) => {
         let projectName = path.basename(project);
-        data[0].children.push({ id: name, name: projectName, path: project });
+
+        // Do not include in the list of workspaces the current project
+        if (project === RED.projectInfo.getWorkspaceInfo()[0].path){
+          data[0].children.push({ id: name, name: `${projectName} (current)`, path: project });
+        } else {
+          data[0].children.push({ id: name, name: projectName, path: project });
+        }
+        
       })
     }
-    
+
     // Render the tree
     $('#exp-workspace').tree('loadData', data);
 
     // Hack to add style to the title if no projects are added. As this element is not considered a folder
-    if (!projects || projects.length === 0){
+    if (!projects || projects.length === 0) {
       const elements = $('.jqtree-title-button-left');
       const maxElements = elements.length;
-      for(let i = 0; i < maxElements; i++){
-        if ($(elements[i]).text() === 'WORKSPACE PROJECTS'){
+      for (let i = 0; i < maxElements; i++) {
+        if ($(elements[i]).text() === 'WORKSPACE PROJECTS') {
           $(elements[i]).addClass('jqtree-title-emptyfolder');
           break;
         }
@@ -26840,8 +26910,8 @@ RED.sidebar.azure = (function () {
   }
 
   const refresh = () => {
-   refreshTabs();
-   refreshWorkspaceProjects();
+    refreshTabs();
+    refreshWorkspaceProjects();
   }
 
   return {
@@ -26849,7 +26919,7 @@ RED.sidebar.azure = (function () {
     refresh,
     selectTab
   };
-  
+
 })();
 ;RED.palette.nodes = (function () {
   var exclusion = ['config', 'unknown', 'deprecated'];
@@ -35428,7 +35498,7 @@ RED.notifications = (function() {
         hide();
       });
 
-      $('#sidebar-separator').hide();
+      // $('#sidebar-separator').hide();
       indexWorkspace();
       if (dialog === null) {
         createDialog();
@@ -35690,7 +35760,7 @@ RED.notifications = (function() {
         hide();
       });
 
-      $('#sidebar-separator').hide();
+      // $('#sidebar-separator').hide();
       if (dialog === null) {
         createDialog();
       }
@@ -35705,7 +35775,7 @@ RED.notifications = (function() {
       $('#main-container').off('click');
       RED.keyboard.remove('escape');
       visible = false;
-      $('#sidebar-separator').hide();
+      // $('#sidebar-separator').hide();
       if (dialog !== null) {
         dialog.slideUp(200, function () {
           // searchInput.searchBox('value', '');
@@ -44916,6 +44986,80 @@ RED.touch.radialMenu = (function() {
     init: init,
   };
 })();
+;RED.modalRenameTab = (function () {
+  const MAX_LENGTH_TAB_NAME = 22;
+  let tabId;
+  let oldTabName;
+
+  // Listening from the main process the list of the recent projects
+  let ipcRenderer = window.__kumologica.electron.ipcRenderer;
+
+  ipcRenderer.on('receiveProps', (e, msg) => {
+    tabId = msg.payload.tabId;
+    oldTabName = msg.payload.oldTabName;
+
+    $('#newTabName').val(oldTabName);
+    $('#newTabName').select();
+  });
+
+
+  function replaceSpacesWithDash() {
+    let old = $('#newTabName').val();
+    $('#newTabName').val(old.replace(/\s+/g, '-'));
+  }
+
+  function maybeEnableSaveButton() {
+    if ($('#newTabName').val() !== '' && $('#newTabName').val() !== oldTabName) {
+      $('#btn-rename-tab-create').removeClass('disabled');
+    } else {
+      $('#btn-rename-tab-create').addClass('disabled');
+    }
+  }
+
+  function init() {
+    // Put the focus on the new tab name input
+    $('#newTabName').focus();
+    // Attach listener to the new tab name input
+    $('#newTabName').on('input', () => {
+      maybeEnableSaveButton();
+      replaceSpacesWithDash();
+
+      let currentLength = $('#newTabName').val().length;
+      if (currentLength <= MAX_LENGTH_TAB_NAME) {
+        $('#charLeftCounter').text(MAX_LENGTH_TAB_NAME - currentLength);
+      }
+
+    });
+    // Attach listener to cancel button
+    $('#btn-rename-tab-cancel').on('click', () => {
+      window.__kumologica.main.dispatch('open-rename-tab-dialog:close', null);
+    });
+    // Attach listener to create button
+    $('#btn-rename-tab-create').on('click', () => {
+      event.preventDefault();
+      let $this = $(event.currentTarget);
+      if ($this.hasClass('secondary')) {
+        return;
+      } else {
+        window.__kumologica.main.dispatch('open-rename-tab-dialog:rename-tab', {
+          tabId: tabId,
+          newTabName: $('#newTabName').val()
+        });
+      }
+    });
+    $('#newTabName').on('keypress', function (e) {
+      if (e.which == 13) {
+        e.preventDefault();
+        $('#btn-rename-tab-create').click();
+      }
+    });
+
+  }
+
+  return {
+    init: init
+  };
+})();
 ;RED.modalHome = (function () {
   let recentProjects = [];