@kumologica/sdk 3.2.0-beta9 → 4.0.0-alpha2

package/src/app/ui/editor-client/src/js/ui/tab-azure.js

@@ -1,852 +0,0 @@
-
-RED.sidebar.azure = (function () {
-    marked.setOptions({
-      renderer: new marked.Renderer(),
-      gfm: true,
-      tables: true,
-      breaks: false,
-      pedantic: false,
-      sanitize: true,
-      smartLists: true,
-      smartypants: false,
-    });
-  
-    var content;
-    var sections;
-    var functionSection;
-    var environmentSection;
-    var initialised = false;
-    var parameters;
-    var SELECT_AZURE_PROFILE = 'Select azure profile...';
-    var DEFINE_AZURE_PROFILE = 'Define azure profile';
-    
-    const DEPLOYING = 'DEPLOYING';
-    const NOTDEPLOYING = 'NOTDEPLOYING';
-    let deployState = NOTDEPLOYING;
-    
-    function initCss() {
-      $('<style>')
-        .text(
-          `
-      select {
-        outline: 1.5px solid #ccc;
-      }
-      select:focus {
-        outline: 1.5px solid #ccc; 
-        outline-offset: 0px;
-      }
-      .invalid {
-        border: 1px solid red;
-      }
-      
-      .valid {
-        border: 1px solid green;
-      }
-      datalist {
-        max-height: 300px;
-        overflow-y: auto !important;
-      }
-      .editor-button-xsmall {
-        height: 16px;
-        min-width: 16px;
-        line-height: 14px;
-        font-size: 10px;
-        border-radius: 2px;
-        padding: 0 2px;
-    }
-      `
-        )
-        .appendTo(document.head);
-    }
-  
-    function initHTML() {
-      initCss();
-      content = document.createElement('div');
-      content.className = 'sidebar-azure';
-  
-      RED.actions.add('core:show-azure-tab', show);
-  
-      var stackContainer = $('<div>', {
-        class: 'sidebar-node-info-stack',
-      }).appendTo(content);
-  
-      let headerContentHtml = `
-      <div class="sidebar-title-wrapper">
-        <span>Deploy: Azure</span>
-      </div>
-      <div id="azure-sidebar-header" class="sidebar-header">
-          <div id="azure-instrumentation" class="node-info">
-            <div id="azure-profiles-wrapper">
-              <span style="padding-left: 3px">Profiles</span>
-              <select id="azure-sidebar-profiles" class="palette-textinput" style="padding: 0px;">
-                <option value="Select azure profile..." style="color:#3988CB !important">Click to select one...</option>
-              </select>
-            </div>  
-  
-            <div id="azure-wrapper">
-              <!-- connect btn -->
-              <div>
-              <a id="azure-sidebar-connect-btn" class="sidebar-header-button" href="#">
-                <i id="azure-sidebar-connect-icon" class="fa fa-circle" style="color: red"></i>  
-                Connect
-              </a>
-              </div>
-   
-              <!-- deploy btn -->
-              <div style="margin-right: 4px;">
-              <a id="azure-sidebar-deploy-btn" class="sidebar-header-button" href="#">
-                <i id="azure-sidebar-deploy-icon" class="fa fa-cloud-upload"></i>  
-                Deploy
-              </a>
-              </div>
-              <!-- export btn -->
-              <div id="azure-options-dropdown">
-                <a id="azure-sidebar-export-btn" class="sidebar-header-button" href="#">
-                  <i class="fa fa-ellipsis-h"></i>  
-                </a>
-              </div>
-              <div id="azure-options-dropdown-content">
-                <span class="option-disabled">Generate script...</span>
-                <span id="azure-exportCloudFormationBtn" class="option">AWS CloudFormation</span>
-                <span id="azure-exportServerlessBtn" class="option">Serverless</span>
-              </div>        
-            </div>
-          </div>
-          <table hidden id="azure-sidebar-error" class="node-info" style="margin: 0px;">
-          <tr>
-            <td style="border: 0px solid white; padding: 3px; width: 100%;">
-              <p style="font-size: 12px; margin: 0px; text-align: center; color:red;"><span>azure profile has not been configured</span></p>
-            </td>
-  
-            <td style="border: 0px solid white; padding: 3px;">
-              <a id="azure-sidebar-error-help-btn" class="editor-button editor-button-xsmall" href="https://docs.kumologica.com/docs/guide/GettingStarted.html#installation" target="_blank">
-                <i class="fa fa-question"></i>  
-              </a>
-            </td>
-            
-            <td style="border: 0px solid white; padding: 3px 6px 3px 3px;">
-              <a id="azure-sidebar-error-close-btn" class="editor-button editor-button-xsmall" href="#">
-                <i class="fa fa-times"></i></a>
-            </td>
-          </tr>
-        </table> 
-      </div>
-      `;
-  
-      $(headerContentHtml).appendTo(stackContainer);
-  
-      let bodyContainer = $(`<div id="azure-sidebar-body" style="display:none"></div>`);
-      bodyContainer.appendTo(stackContainer);
-  
-      sections = RED.stack
-        .create({
-          container: bodyContainer,
-        })
-        .hide();
-  
-      // function section
-      functionSection = sections.add({
-        title: 'function',
-        collapsible: true,
-      });
-      functionSection.expand();
-  
-      environmentSection = sections.add({
-        title: 'environment',
-        collapsible: true,
-      });
-      
-      // tags section
-      tagsSection = sections.add({
-        title: 'tags',
-        collapsible: true,
-      });
-      
-      RED.sidebar.addTab({
-        id: 'azure',
-        label: 'azure',
-        name: 'Azure Deployer',
-        iconClass: 'fa fa-windows',
-        action: 'core:show-azure-tab',
-        content: content,
-        pinned: true,
-        enableOnEdit: true,
-        onchange: onchange,
-        onsame: onsame
-      });
-         
-      // Function content init
-     // let fnOsType = $('#azure-fn-os-type').val();
-     // let fnLocation = $('#azure-fn-location').val();
-      //let fnHostingPlan = $('#azure-fn-hosting-plan').val();
-      
-      let functionSectionHtml = `
-      <table class="node-info">
-        <tr class="node-info-node-row">
-          <td>Application Name</td>
-          <td colspan="2" style="background: white"><input style="width:100%" id="azure-fn-application-name" class="palette-textinput" pattern="[a-zA-Z0-9-_]{1,64}" type="text"></td>
-        </tr>
-        <tr class="node-info-node-row">
-              <td>Funcion Name</td>
-              <td colspan="2" style="background: white"><input style="width:100%" id="azure-fn-name" class="palette-textinput" pattern="[a-zA-Z0-9-_]{1,64}" type="text"></td>
-        </tr>
-        <tr class="node-info-node-row">
-              <td>Description</td>
-              <td colspan="2" style="background: white"><input style="width:100%" id="azure-fn-description" class="palette-textinput" type="text"></td>
-          </tr>
-          <tr class="node-info-node-row">
-              <td>Resource Group Name</td>
-              <td colspan="2" style="background: white"><input style="width:100%" id="azure-fn-resource-group-name" class="palette-textinput" type="text" placeholder=" optional"></td>
-          </tr>
-          <tr class="node-info-node-row">
-              <td>Service Plan Id</td>
-              <td colspan="2" style="background: white"><input style="width:100%" id="azure-fn-service-plan-id" class="palette-textinput" type="text" placeholder=" optional"></td>
-          </tr>
-          <tr class="node-info-node-row">
-              <td>Location</td>
-              <td colspan="2" style="background: white"><input style="width:100%" id="azure-fn-location" list="azure-locations-dataList" class="palette-textinput" type="text" />
-              <datalist id="azure-locations-dataList">
-                <option value="Asia">
-                <option value="Asia Pacific">
-                <option value="Australia">
-                <option value="Australia Central">
-                <option value="Australia Central 2">
-                <option value="Australia East">
-                <option value="Australia Southeast">
-                <option value="Brazil">
-                <option value="Brazil South">
-                <option value="Brazil Southeast">
-                <option value="Canada">
-                <option value="Canada Central">
-                <option value="Canada East">
-                <option value="Central India">
-                <option value="Central US">
-                <option value="Central US (Stage)">
-                <option value="Central US EUAP">
-                <option value="East Asia">
-                <option value="East Asia (Stage)">
-                <option value="East US">
-                <option value="East US (Stage)">
-                <option value="East US 2">
-                <option value="East US 2 (Stage)">
-                <option value="East US 2 EUAP">
-                <option value="Europe">
-                <option value="France Central">
-                <option value="France South">
-                <option value="Germany North">
-                <option value="Germany West Central">
-                <option value="Global">
-                <option value="India">
-                <option value="Japan">
-                <option value="Japan East">
-                <option value="Japan West">
-                <option value="Jio India West">
-                <option value="Korea Central">
-                <option value="Korea South">
-                <option value="North Central US">
-                <option value="North Central US (Stage)">
-                <option value="North Europe">
-                <option value="Norway East">
-                <option value="Norway West">
-                <option value="South Africa North">
-                <option value="South Africa West">
-                <option value="South Central US">
-                <option value="South Central US (Stage)">
-                <option value="South India">
-                <option value="Southeast Asia">
-                <option value="Southeast Asia (Stage)">
-                <option value="Switzerland North">
-                <option value="Switzerland West">
-                <option value="UAE Central">
-                <option value="UAE North">
-                <option value="UK South">
-                <option value="UK West">
-                <option value="United Kingdom">
-                <option value="United States">
-                <option value="West Central US">
-                <option value="West Europe">
-                <option value="West India">
-                <option value="West US">
-                <option value="West US (Stage)">
-                <option value="West US 2">
-                <option value="West US 2 (Stage)">
-                <option value="West US 3">
-              </datalist>
-              </td>
-          </tr>
-          <tr class="node-info-node-row">
-              <td>OS Type</td>
-              <td colspan="2" style="background: white">
-                <select type="text" id="azure-fn-os-type" class="palette-textinput" style="float: left; width: 100%; padding: 0px; outline: 0px solid #ccc; ">
-                  <option value="windows">Windows</option>
-                  <option value="linux">Linux</option>
-                </select>
-              </td>
-          </tr>
-          <tr class="node-info-node-row">
-              <td>Hosting Plan</td>
-              <td colspan="2" style="background: white">
-                <select type="text" id="azure-fn-hosting-plan" class="palette-textinput" style="float: left; width: 100%; padding: 0px; outline: 0px solid #ccc; ">
-                  <option value="consumtion">Consumption</option>
-                  <option value="premium">Premium</option>
-                </select>
-              </td>
-          </tr>
-      </table>
-      `;
-      $(functionSectionHtml).appendTo(functionSection.content);
-      functionSection.container.show();
-  
-      // Environment section init
-      let environmentSectionHtml = `
-      <div style="display:flex; flex-direction: column; justify-content: flex-start;">
-          <div style="display:flex; justify-content: flex-end; padding:6px">
-            <a id="azure-add-environment-variable" href="#" class="editor-button editor-button-small red-ui-editableList-addButton">
-                <i class="fa fa-plus"></i> Add
-            </a>
-          </div>
-          <div id="azure-fn-env" style="display:flex; flex-direction: column">
-            <table id="azure-fn-env-table" class="node-info" style="table-layout: fixed">
-              
-            </table>
-          </div>
-      </div>
-      `;
-      $(environmentSectionHtml).appendTo(environmentSection.content);
-      environmentSection.container.show();
-  
-      // Tags section init
-      let tagsSectionHtml = `
-      <div style="display:flex; flex-direction: column; justify-content: flex-start;">
-          <div style="display:flex; justify-content: flex-end; padding:6px">
-            <a id="azure-add-tag" href="#" class="editor-button editor-button-small red-ui-editableList-addButton">
-                <i class="fa fa-plus"></i> Add
-            </a>
-          </div>
-          <div id="azure-fn-tags" style="display:flex; flex-direction: column">
-            <table id="azure-fn-tags-table" class="node-info" style="table-layout: fixed">
-              
-            </table>
-          </div>
-      </div>
-      `;
-      $(tagsSectionHtml).appendTo(tagsSection.content);
-      tagsSection.container.show();
- 
-      // Tooltips
-      RED.popover.tooltip($('#azure-sidebar-deploy-btn'), 'Deploy to azure');
-      RED.popover.tooltip($('#azure-options-dropdown'), 'Other azure Operations');
-      RED.popover.tooltip($('#azure-sidebar-connect-btn'), 'Connect to azure');
-    }
-  
-    function onchange(){
-      RED.actions.invoke('core:show-sidebar');
-    }
-  
-    function onsame(){
-        RED.actions.invoke('core:hide-sidebar');
-    }
-  
-    function sanitizeLambdaName(name) {
-      return name
-        .replace('.json', '')
-        .trim()
-        .replace(/^@/, '')
-        .replace(/[^a-zA-Z0-9-_]/g, '_')
-        .substr(0, 140);
-    }
-  
-    function setLambdaName(name) {
-      $('#azure-fn-name').val(sanitizeLambdaName(name));
-    }
-  
-    function setValues(params) {
-      if (!initialised) {
-        parameters = params;
-        return;
-      }
-      
-      if (params && (params.name || params.functionName)) {
-        setLambdaName(params.name || params.functionName);
-      } else {
-        if (window.__kumologica.settings.projectFlowName) {  
-          setLambdaName(window.__kumologica.settings.projectFlowName);
-        }
-      }
-      if (!params || !params["azure-application-name"] || params["azure-application-name"].length == 0) {
-        // console.log(`setting app name: gen ###${sanitizeLambdaName(window.__kumologica.settings.projectFlowName.replace('flow', 'app'))}###`);
-        $('#azure-fn-application-name').val(sanitizeLambdaName(window.__kumologica.settings.projectFlowName.replace('flow', 'app')));
-      }
-
-      if (!params) {
-        return;
-      }
-
-      // params available beyond this point
-      if (params.profile) {
-        setProfile(params.profile);
-      }
-      
-      if (params["azure-application-name"] && params["azure-application-name"].length > 0) {
-        // console.log(`setting app: ###${params["azure-application-name"]}###`);
-        $('#azure-fn-application-name').val(params["azure-application-name"]);
-      }
-      
-      if (params["hosting-plan"]) {
-        $('#azure-fn-hosting-plan').val(params["hosting-plan"]);
-      }
-      if (params["resource-group-name"]) {
-        $('#azure-fn-resource-group-name').val(params["resource-group-name"]);
-      }
-      if (params["service-plan-id"]) {
-        $('#azure-fn-service-plan-id').val(params["service-plan-id"]);
-      }
-      if (params["os-type"]) {
-        $('#azure-fn-os-type').val(params["os-type"]);
-      }
-      if (params.location) {
-        $('#azure-fn-location').val(params.location);
-      }
-      if (params.description) {
-        $('#azure-fn-description').val(params.description);
-      }
-      
-      if (params.environment && params.environment.length > 0) {
-        let environmentTable = $('#azure-fn-env-table');
-        let env = JSON.parse(params.environment);
-
-        for (let key in env) {
-          $(`
-          <tr class="node-info-node-row">
-            <td style="background: white; width:46%"><input id="azure-fn-env-key" class="palette-textinput" type="text" placeholder="key" style="width:100%" value="${key}"></td>
-            <td style="background: white; width:46%"><input id="azure-fn-env-val" class="palette-textinput" type="text" placeholder="value" style="width:100%" value="${env[key]}"></td>
-            <td id="azure-fn-env-row" style="text-align:center; width:8%" class="removeRow"><i class="fa fa-minus"></i></td>
-          </tr>`).appendTo(environmentTable);
-        }
-      }
-
-      if (params.tags && params.tags.length > 0) {
-        let t = JSON.parse(params.tags);
-        for (let key in t) {
-          $(`
-            <tr class="node-info-node-row">
-              <td style="background: white; width:46%"><input id="azure-fn-tag-key" class="palette-textinput" type="text" placeholder="key" style="width:100%" value="${key}"></td>
-              <td style="background: white; width:46%"><input id="azure-fn-tag-val" class="palette-textinput" type="text" placeholder="value" style="width:100%" value="${t[key]}"></td>
-              <td id="azure-fn-tag-row" style="text-align:center; width:8%" class="removeRow"><i class="fa fa-minus"></i></td>
-            </tr>`).appendTo($('#azure-fn-tags-table'));
-        }
-      }
-    }
-  
-    function getValues() {
-      // Basic information
-      let fnProfile = getProfile();
-      let fnName = $('#azure-fn-name').val();
-      let fnApplicationName = $('#azure-fn-application-name').val();
-      let fnDescription = $('#azure-fn-description').val();
-      let fnOsType = $('#azure-fn-os-type').val();
-      let fnLocation = $('#azure-fn-location').val();
-      let fnHostingPlan = $('#azure-fn-hosting-plan').val();
-      let fnResourceGroupName = $('#azure-fn-resource-group-name').val();
-      let fnServicePlanId= $('#azure-fn-service-plan-id').val();
-   
-      // Environment variables
-      let environment = {};
-      let envvarRows = $('#azure-fn-env-table tr');
-  
-      envvarRows.map((index, row) => {
-        let envvar = $(row).find('td').find('input');
-        let key = $(envvar[0]).val();
-        let value = $(envvar[1]).val();
-        environment[key] = value;
-      });
-  
-      console.log(`tab environment: ${JSON.stringify(environment)}`);
-      // tags
-      let tags = {};
-      let tagsRows = $('#azure-fn-tags-table tr');
-
-      tagsRows.map((index, row) => {
-        let tagsrow = $(row).find('td').find('input');
-        let key = $(tagsrow[0]).val();
-        let value = $(tagsrow[1]).val();
-        tags[key]=value;
-      });
-
-      // returned structure must comply with cli parameters
-      return {
-        profile: fnProfile,
-        "azure-application-name": fnApplicationName,
-        functionName: fnName,
-        description: fnDescription,
-        "os-type": fnOsType,
-        "hosting-plan": fnHostingPlan,
-        "location": fnLocation,
-        "resource-group-name": fnResourceGroupName,
-        "service-plan-id": fnServicePlanId,
-        environment: JSON.stringify(environment),
-        tags: JSON.stringify(tags)
-      };
-    }
-  
-    function fillProfiles() {
-      try {
-        const profiles = window.__kumologica.azure.listProfiles();
-        let dropdown = $('#azure-sidebar-profiles');
-  
-        if (profiles.length > 0) {
-          dropdown.empty();
-          dropdown.append($('<option disabled>Available azure Profiles</option>'));
-        }
-        profiles.forEach(function (profile) {
-          dropdown.append($('<option></option>').val(profile).text(profile));
-        });
-  
-        // in case azure-config.json was loaded already and
-        // setValues could not select correct profile, doing it now
-        if (window.__kumologica.azure.profile) {
-          setProfile(window.__kumologica.azure.profile);
-        }
-      } catch (Error) {
-        console.log(`error: ${Error}`);
-        showProfileError();
-      }
-    }
-  
-    function getProfile() {
-      return $('#azure-sidebar-profiles').find(':selected').val();
-    }
-  
-    function setProfile(profile) {
-      window.__kumologica.azure.profile = profile;
-  
-      // Show the body if profile is set to existing profile
-      if (profile != SELECT_AZURE_PROFILE && 
-        $('#azure-sidebar-profiles').find('option[value=' + profile + ']').length) {
-        
-        $(`#azure-sidebar-profiles option[value='${SELECT_AZURE_PROFILE}']`).remove();
-        $('#azure-sidebar-profiles').val(profile);
-      } else {
-        $('#azure-sidebar-profiles').val(SELECT_AZURE_PROFILE);
-      }
-    }
-  
-  
-    function showProfileError() {
-      $('#azure-sidebar-error').show();
-    }
-  
-    RED.events.on('settings:azure-config-changed', function() {
-      fillProfiles();
-    });
-    
-    // event triggered when azure-config.json file has been loaded
-    RED.events.on('azure-config', function () {
-      if (!$('#azure-fn-name').val() &&
-        window.__kumologica.settings.projectFlowName
-      ) {
-        setLambdaName(window.__kumologica.settings.projectFlowName);
-      }
-  
-      if (window.__kumologica.settings.azureConfig ) {
-        const params = window.__kumologica.settings.azureConfig.getAzureConfig();
-        setValues(params);
-      } else {
-        console.log('kumologica.settings.azureConfig not present');
-      }
-    });
-  
-    function initJs() {
-      fillProfiles();
-  
-      // Initialize fields with default values
-      if (window.__kumologica.settings.projectFlowName) {
-
-        setLambdaName(window.__kumologica.settings.projectFlowName);
-        
-        if (!$('#azure-fn-application-name').val()) {
-          // console.log(`setting app name: gen ***${sanitizeLambdaName(window.__kumologica.settings.projectFlowName.replace('flow', 'app'))}###`);
-          $('#azure-fn-application-name').val(sanitizeLambdaName(window.__kumologica.settings.projectFlowName.replace('flow', 'app')));
-        }
-      }
-
-      $('#azure-fn-description').val('kumologica flow');
- 
-      $('#azure-fn-service-plan-id, #azure-fn-resource-group-name, #azure-fn-hosting-plan, #azure-fn-location, #azure-fn-os-type, #azure-fn-application-name, #azure-fn-description, #azure-fn-name').change(function () {
-        saveSettings();
-      });
-  
-      $('#azure-fn-name').change(function () {
-        this.value = sanitizeLambdaName(this.value);
-      });
-
-      $('#azure-sidebar-profiles').change(function () {
-        
-        if (this.value) {
-          $('#azure-sidebar-body').show();
-        }
-        saveSettings();
-  
-        if (this.value != SELECT_AZURE_PROFILE) {
-          $(`#azure-sidebar-profiles option[value='${SELECT_AZURE_PROFILE}']`).remove();
-          window.__kumologica.azure.profile = this.value;
-          disconnectFromazure();
-        }
-      });
-  
-      // Attach the environment variables
-      $('#azure-add-environment-variable').click((e) => {
-        let environmentTable = $('#azure-fn-env-table');
-        let environmentRowHtml = `
-          <tr class="node-info-node-row">
-            <td style="background: white; width:46%"><input id="azure-fn-env-key" class="palette-textinput" type="text" placeholder="key" style="width:100%"></td>
-            <td style="background: white; width:46%"><input id="azure-fn-env-val" class="palette-textinput" type="text" placeholder="value" style="width:100%"></td>
-            <td id="azure-fn-env-row" style="text-align:center; width:8%" class="removeRow"><i class="fa fa-minus"></i></td>
-          </tr>`;
-        $(environmentRowHtml).appendTo(environmentTable);
-  
-        $('#azure-fn-env-table')
-          .find('input')
-          .each(function () {
-            $(this).change(function () {
-              saveSettings();
-            });
-          });
-      });
-  
-      $('#azure-fn-env-table')
-        .find('input')
-        .each(function () {
-          $(this).change(function () {
-            saveSettings();
-          });
-        });
-  
-      $('#azure-fn-env-table').on('click', '.removeRow', function () {
-        $(this).parent().remove();
-        saveSettings();
-      });
-  
-          // Attach tag
-    $('#azure-add-tag').click((e) => {
-      let tagsTable = $('#azure-fn-tags-table');
-      let tagsRowHtml = `
-        <tr class="node-info-node-row">
-          <td style="background: white; width:46%"><input id="azure-fn-tag-key" class="palette-textinput" type="text" placeholder="key" style="width:100%"></td>
-          <td style="background: white; width:46%"><input id="azure-fn-tag-val" class="palette-textinput" type="text" placeholder="value" style="width:100%"></td>
-          <td id="azure-fn-tags-row" style="text-align:center; width:8%" class="removeRow"><i class="fa fa-minus"></i></td>
-        </tr>`;
-      $(tagsRowHtml).appendTo(tagsTable);
-
-      $('#azure-fn-tags-table')
-        .find('input')
-        .each(function () {
-          $(this).change(function () {
-            saveSettings();
-          });
-        });
-    });
-
-
-    $('#azure-fn-tags-table').on('click', '.removeRow', function () {
-      $(this).parent().remove();
-      saveSettings();
-    });
-
-      // Close export menu when click in the window
-      $('.sidebar-azure').click(function (e) {
-        $('#azure-options-dropdown-content').hide();
-      });
-  
-      // Connect to AWS button
-      $('#azure-sidebar-connect-btn').click((e) => {
-        e.preventDefault();
-        connectToazure();
-      });
-  
-      // Deploy to azure button
-      $('#azure-sidebar-deploy-btn').click((e) => {
-        e.preventDefault();
-        deploy();
-      });
-  
-      // Export cloudformation script
-      $('#azure-exportCloudFormationBtn').click((e) => {
-        e.preventDefault();
-        hideMenu();
-        exportScript(window.__kumologica.cloud.provider.aws);
-      });
-  
-      // Export serverless script
-      $('#azure-exportServerlessBtn').click((e) => {
-        e.preventDefault();
-        hideMenu();
-        exportScript(window.__kumologica.cloud.provider.serverless);
-      });
-  
-      $('#azure-options-dropdown').click((e) => {
-        e.stopPropagation();
-  
-        $('#azure-sidebar-export-btn').toggleClass('dropdown-selected');
-  
-        $('#azure-options-dropdown-content').toggle();
-      });
-  
-      initialised = true;
-      if (parameters) {
-        setValues(parameters);
-      }
-  
-      connectUIDisconnected();
-    }
-  
-    function hideMenu() {
-      $('#azure-sidebar-export-btn').removeClass('dropdown-selected');
-      $('#azure-options-dropdown-content').hide();
-    }
-  
-    async function exportScript(provider) {
-      
-      $('#workspace-terminal').show();
-      try {
-        await window.__kumologica.cloud.generateScript(
-          provider,
-          RED.header.getCurrentProjectInfo(),
-          getValues()
-        );
-      } catch (Error) {
-        handleError(Error);
-      }
-    }
-  
-    async function connectToazure() {
-      profile = getProfile();
-  
-      if (!profile || profile == SELECT_AZURE_PROFILE) {
-        RED.notify(`<strong>Error</strong>: Please select azure profile before connecting to azure account.`, 'error');
-        return;
-      }
-  
-      //if (window.__kumologica.azure.isLoggedIn(profile)) {
-       // RED.notify(`<strong>Information</strong>: Already connected to ${profile} azure account.`, 'info');
-       // return;
-      //}
-  
-      connectUIConnecting();
-      
-      try {
-        await window.__kumologica.azure.login(profile);
-       } catch (err) {
-        connectUIDisconnected();
-  
-        RED.notify(`<strong>Error</strong>: ${err.stderr? err.stderr: err}`, 'error');
-        return;
-      }
-      connectUIConnected();
-    }
-  
-    function disconnectFromazure() {
-      window.__kumologica.azure.logout();
-      connectUIDisconnected();
-    }
-  
-    function connectUIDisconnected() {
-      // show connect button
-      $('#azure-sidebar-connect-btn').show();
-      if ($('#azure-sidebar-connect-btn') && $('#azure-sidebar-connect-btn').html()) { 
-        $('#azure-sidebar-connect-btn').html($('#azure-sidebar-connect-btn').html().replace('Connecting', 'Connect'));
-      }
-      $('#azure-sidebar-connect-icon').attr({'class': 'fa fa-circle'});
-      $('#azure-sidebar-connect-icon').css({'color': 'red'});
-      // hide deploy and export buttons 
-      $('#azure-sidebar-deploy-btn').hide();
-      $('#azure-sidebar-export-btn').hide();
-      $('#azure-sidebar-body').hide();
-    }
-  
-    function connectUIConnecting() {
-      $('#azure-sidebar-connect-icon').attr({'class': 'fa fa-spinner fa-spin'});
-      $('#azure-sidebar-connect-icon').css({'color': 'black'});
-    }
-  
-    function connectUIConnected() {
-      // hide connect button
-      $('#azure-sidebar-connect-btn').hide();
-      //$('#azure-sidebar-connect-btn').html($('#azure-sidebar-connect-btn').html().replace('Connect', 'Connected'));
-      //$('#azure-sidebar-connect-icon').attr({'class': 'fa fa-circle'});
-      //$('#azure-sidebar-connect-icon').css({'color': 'green'});
-  
-      // show deploy and options buttons 
-      $('#azure-sidebar-deploy-btn').show();
-  
-      // dont show until functionality implemented
-      //$('#azure-sidebar-export-btn').show();
-      $('#azure-sidebar-body').show();
-    }
-  
-    function deployingUIDeploying() {
-      $('#azure-sidebar-deploy-icon').attr({'class': 'fa fa-spinner fa-spin'});
-    }
-    function deployingUINotDeploying() {
-      $('#azure-sidebar-deploy-icon').attr({'class': 'fa fa-cloud-upload'});
-    }
-  
-    async function deploy() {
-  
-      const profile = getProfile();
-      if (!profile || profile == SELECT_AZURE_PROFILE) {
-        RED.notify(`Please select azure profile before deploying flows.`, 'error');
-        return;
-      }
-  
-      if (deployState == DEPLOYING) {
-        RED.notify(`<strong>Information</strong>: Already deploying to azure.`, 'info');
-        return;
-      }
-      
-      RED.deploy.save();
-  
-      deployingUIDeploying();
-      deployState = DEPLOYING;
-  
-      $('#workspace-terminal').show();
-  
-      let params = getValues();
-      
-      try {
-        await window.__kumologica.azure.deploy(
-          RED.header.getCurrentProjectInfo(),
-          params
-        ); 
-  
-      } catch (Error) {
-        handleError(Error);
-      }
-  
-      deployState = NOTDEPLOYING;
-      deployingUINotDeploying();
-    }
-  
-    function handleError(error) {
-      let msg = error.toString();
-      RED.notify(msg, 'error');
-    }
-  
-    function saveSettings() {
-      window.__kumologica.settings.azureConfig.setAzureConfig(getValues());
-    }
-  
-    function show() {
-      RED.sidebar.show('azure');
-    }
-  
-    function init() {
-      initHTML();
-      initJs();
-    }
-    
-    return {
-      init: init,
-      show: show,
-    };
-  })();