Create modal wizard component, open when region not supplied

src/index.js

@@ -15,6 +15,7 @@ import {
   checkLogsForErrors,
 } from "./services/processEventLogs";
 import { getLogEvents } from "./services/awsCloudwatchLogs";
+import { clargsWizardModal } from "./modals/clargsWizardModal";
 
 const blessed = require("blessed");
 const contrib = require("blessed-contrib");
@@ -93,19 +94,29 @@ if (!program.stackName) {
   );
   process.exit(1);
 }
-if (!program.region) {
-  console.error("error: required option '-r, --region <region>' not specified");
-  process.exit(1);
-}
 
 AWS.config.credentials = getAWSCredentials();
-AWS.config.region = program.region;
-let cloudformation = new AWS.CloudFormation();
-let cloudwatch = new AWS.CloudWatch();
-let cloudwatchLogs = new AWS.CloudWatchLogs();
-let eventBridge = new AWS.EventBridge();
-let schemas = new AWS.Schemas();
-let lambda = new AWS.Lambda();
+
+let cloudformation;
+let cloudwatch;
+let cloudwatchLogs;
+let eventBridge;
+let schemas;
+let lambda;
+
+function updateAWSServices() {
+  cloudformation = new AWS.CloudFormation();
+  cloudwatch = new AWS.CloudWatch();
+  cloudwatchLogs = new AWS.CloudWatchLogs();
+  eventBridge = new AWS.EventBridge();
+  schemas = new AWS.Schemas();
+  lambda = new AWS.Lambda();
+}
+
+if (program.region) {
+  AWS.config.region = program.region;
+  updateAWSServices();
+}
 
 function getStackResources(stackName) {
   return cloudformation.listStackResources({ StackName: stackName }).promise();
@@ -418,9 +429,14 @@ class Main {
 
   async render() {
     setInterval(() => {
-      this.map.updateMap();
-      this.updateResourcesInformation();
-      this.updateGraphs();
+      if (program.region && program.stackName) {
+        this.map.updateMap();
+        this.updateResourcesInformation();
+        this.updateGraphs();
+      } else if (!this.isModalOpen) {
+        this.setIsModalOpen(true);
+        clargsWizardModal(screen, this);
+      }
       screen.render();
     }, 1000);
   }
@@ -779,14 +795,9 @@ class Main {
   }
 
   updateRegion(region) {
-    this.program.region = region;
+    program.region = region;
     AWS.config.region = region;
-    cloudformation = new AWS.CloudFormation();
-    cloudwatch = new AWS.CloudWatch();
-    cloudwatchLogs = new AWS.CloudWatchLogs();
-    eventBridge = new AWS.EventBridge();
-    schemas = new AWS.Schemas();
-    lambda = new AWS.Lambda();
+    updateAWSServices();
   }
 }
 

src/modals/clargsWizardModal.js

@@ -0,0 +1,45 @@
+import { Box } from "../components/box";
+import { ModalLayout } from "../components/modalLayout";
+import { ModalTitle } from "../components/modalTitle";
+import { InteractiveList } from "../components/interactiveList";
+import { awsRegionLocations } from "../constants";
+
+function updateRegionTable(table) {
+  const regions = awsRegionLocations.map((region) => region.label);
+  table.setItems(regions);
+}
+
+const clargsWizardModal = (screen, application) => {
+  let region = "";
+  const wizardLayout = new ModalLayout(screen, 112, 27, true);
+
+  const closeModal = () => {
+    application.updateRegion(region);
+    application.setIsModalOpen(false);
+    application.returnFocus();
+    wizardLayout.destroy();
+  };
+
+  new ModalTitle(wizardLayout, 110, "Select your stack/region");
+
+  const regionTable = new InteractiveList(wizardLayout, 110, 20, "Regions");
+
+  new Box(
+    wizardLayout,
+    110,
+    4,
+    "Arrow keys to navigate | ENTER to select region"
+  );
+
+  updateRegionTable(regionTable);
+  regionTable.focus();
+
+  regionTable.key(["enter"], () => {
+    region = regionTable.ritems[regionTable.selected];
+    closeModal();
+  });
+
+  return wizardLayout;
+};
+
+module.exports = { clargsWizardModal };