Addressed PR feedback

- Created an “embark” module so that an “embark” process could be registered in the correct way. This service is only used on `embark run` (can be extended to other commands if needed).

- extracted “embark” to a const `DEFAULT_PROCESS` param in the `Console` component.

- extracted commands result rendering to it’s own function to keep the `renderTabs` function from getting cluttered

- Added sorting of logs by timestamp

- Added milliseconds to the log file data (which helps in sorting log messages).

cmd/cmd_controller.js

@@ -126,6 +126,7 @@ class EmbarkController {
         }
 
         engine.startService("processManager");
+        engine.startService("embark");
         engine.startService("serviceMonitor");
         engine.startService("libraryManager");
         engine.startService("codeRunner");

embark-ui/src/components/Console.js

@@ -31,24 +31,43 @@ class Console extends Component {
     this.setState({value: event.target.value});
   }
 
+  renderCommandsResult(){
+    const {commands} = this.props;
+    return (
+      this.state.selectedProcess === this.DEFAULT_PROCESS && 
+      commands.map((command, index) => {
+        return <CommandResult key={index} result={command.result}/>;
+      })
+    );
+  }
+
   renderTabs() {
-    const {processLogs, processes, commands} = this.props;
-    return processes.map(process => (
-      <Tab title={process.name} key={process.name} onClick={(e, x) => this.clickTab(e, x)}>
-        <Logs>
-          {
-            processLogs.reverse().filter((item) => item.name === process.name)
-              .map((item, i) => <p key={i} className={item.logLevel}
-                                   dangerouslySetInnerHTML={{__html: convert.toHtml(item.msg)}}></p>)
-          }
-          {process.name === "embark" && commands.map((command, index) => <CommandResult key={index} result={command.result}/>)}
-        </Logs>
-      </Tab>
+    const {processLogs, processes} = this.props;
+    return processes
+      .sort((a, b) => { // ensure the "Embark" tab is displayed first
+        if (a.name === this.DEFAULT_PROCESS) return -1;
+        if (b.name === this.DEFAULT_PROCESS) return 1;
+        return 0;
+      })
+      .map(process => (
+        <Tab title={process.name} key={process.name} onClick={(e, x) => this.clickTab(e, x)}>
+          <Logs>
+            {
+              processLogs
+                .reverse()
+                .filter((item) => item.name === process.name)
+                .sort((a, b) => a.timestamp - b.timestamp)
+                .map((item, i) => <p key={i} className={item.logLevel}
+                                    dangerouslySetInnerHTML={{__html: convert.toHtml(item.msg)}}></p>)
+            }
+          </Logs>
+        </Tab>
     ));
   }
 
   render() {
     const tabs = this.renderTabs();
+    const commandsResult = this.renderCommandsResult();
     const {value} = this.state;
 
     return (
@@ -65,6 +84,7 @@ class Console extends Component {
                 </TabbedHeader>
                 <TabbedContainer selectedTitle={this.props.activeProcess}>
                   {tabs}
+                  {commandsResult}
                 </TabbedContainer>
               </React.Fragment>
             </Card.Body>

lib/core/engine.js

@@ -39,9 +39,6 @@ class Engine {
       utils.interceptLogs(console, this.logger);
     }
 
-    // register API calls for the logger
-    this.logger.registerAPICall(this.plugins);
-
     this.ipc = new IPC({logger: this.logger, ipcRole: this.ipcRole});
     if (this.ipc.isClient()) {
       return this.ipc.connect((_err) => {
@@ -81,7 +78,8 @@ class Engine {
       "pluginCommand": this.pluginCommandService,
       "testRunner": this.testRunnerService,
       "codeCoverage": this.codeCoverageService,
-      "scaffolding": this.scaffoldingService
+      "scaffolding": this.scaffoldingService,
+      "embark": this.embarkService
     };
 
     let service = services[serviceName];
@@ -95,6 +93,13 @@ class Engine {
     return service.apply(this, [options]);
   }
 
+  embarkService(_options){
+    this.registerModule('embark', {
+      events: this.events,
+      logger: this.logger
+    });
+  }
+
   processManagerService(_options) {
     const ProcessManager = require('./processes/processManager.js');
     this.processManager = new ProcessManager({

lib/core/logger.js

@@ -9,8 +9,8 @@ class Logger {
     this.logLevel = options.logLevel || 'info';
     this.logFunction = options.logFunction || console.log;
     this.logFile = options.logFile;
-    this.dateFormat = 'YYYY-MM-DD HH:mm:ss';
-    this.logRegex = /\[(?<date>\d\d\d\d-\d\d-\d\d \d\d:\d\d:\d\d)\] (?:\[(?<logLevel>\w*)\]:?)?\s?\s?(?<msg>.*)/gmi;
+    this.dateFormat = 'YYYY-MM-DD HH:mm:ss:SSS';
+    this.logRegex = /\[(?<date>\d\d\d\d-\d\d-\d\d \d\d:\d\d:\d\d:\d\d\d)\] (?:\[(?<logLevel>\w*)\]:?)?\s?\s?(?<msg>.*)/gmi;
 
     // Use a default logFile if none is specified in the cli,
     // in the format .embark/embark-log__YYYY-MM-DD_HH-mm-ss.log.
@@ -44,13 +44,6 @@ Logger.prototype.registerAPICall = function (plugins) {
       });
     }
   );
-  plugin.registerAPICall(
-    'get',
-    '/embark-api/process-logs/embark',
-    (req, res) => {
-      res.send(this.parseLogFile());
-    }
-  );
 };
 
 /**

lib/core/processes/processManager.js

@@ -11,7 +11,7 @@ class ProcessManager {
   }
 
   _registerAsPlugin() {
-    const self  =this;
+    const self = this;
     self.plugin = this.plugins.createPlugin('processManager', {});
     self.plugin.registerAPICall(
       'get',
@@ -21,8 +21,7 @@ class ProcessManager {
           acc.push({state: self.processes[processName].state, name: processName});
           return acc;
         };
-        // add "embark" process to list of running processes
-        res.send(Object.keys(self.processes).reduce(formatter, []).concat({ state: "running", name: "embark" }));
+        res.send(Object.keys(self.processes).reduce(formatter, []));
       }
     );
   }

lib/modules/embark/index.js

@@ -0,0 +1,29 @@
+class Embark {
+  constructor(embark) {
+    this.embark = embark;
+    this.logger = embark.logger;
+    this.events = embark.events;
+
+    this.registerProcess();
+    this.registerAPICalls();
+  }
+
+  registerProcess() {
+    this.events.request('processes:register', 'embark', (setRunning) => {
+      this.events.on('outputDone', setRunning);      
+    });
+    this.events.request('processes:launch', 'embark', () => {});
+  }
+
+  registerAPICalls(){
+    this.embark.registerAPICall(
+      'get',
+      '/embark-api/process-logs/embark',
+      (req, res) => {
+        res.send(this.logger.parseLogFile());
+      }
+    );
+  }
+}
+
+module.exports = Embark;