@lage-run/reporters 0.2.41 → 0.2.43

package/CHANGELOG.json

@@ -2,7 +2,52 @@
   "name": "@lage-run/reporters",
   "entries": [
     {
-      "date": "Tue, 06 Dec 2022 00:47:50 GMT",
+      "date": "Thu, 08 Dec 2022 00:49:16 GMT",
+      "tag": "@lage-run/reporters_v0.2.43",
+      "version": "0.2.43",
+      "comments": {
+        "patch": [
+          {
+            "author": "kchau@microsoft.com",
+            "package": "@lage-run/reporters",
+            "commit": "ad281dfe8b222d949130821828a680d1c3625154",
+            "comment": "adding some more niceties to progress reporter"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 06 Dec 2022 23:33:47 GMT",
+      "tag": "@lage-run/reporters_v0.2.42",
+      "version": "0.2.42",
+      "comments": {
+        "none": [
+          {
+            "author": "renovate@whitesourcesoftware.com",
+            "package": "@lage-run/reporters",
+            "commit": "07c1993552c81082c2717146ce0ff57a7a2eba1b",
+            "comment": "Update devDependency @types/react to v18.0.26"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 06 Dec 2022 23:28:12 GMT",
+      "tag": "@lage-run/reporters_v0.2.42",
+      "version": "0.2.42",
+      "comments": {
+        "patch": [
+          {
+            "author": "kchau@microsoft.com",
+            "package": "@lage-run/reporters",
+            "commit": "be767568d67ce73497f83900b339737df3d0e5bd",
+            "comment": "fixes an array length issue"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 06 Dec 2022 00:48:02 GMT",
       "tag": "@lage-run/reporters_v0.2.41",
       "version": "0.2.41",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,28 @@
 # Change Log - @lage-run/reporters
 
-This log was last generated on Tue, 06 Dec 2022 00:47:50 GMT and should not be manually modified.
+This log was last generated on Thu, 08 Dec 2022 00:49:16 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## 0.2.43
+
+Thu, 08 Dec 2022 00:49:16 GMT
+
+### Patches
+
+- adding some more niceties to progress reporter (kchau@microsoft.com)
+
+## 0.2.42
+
+Tue, 06 Dec 2022 23:28:12 GMT
+
+### Patches
+
+- fixes an array length issue (kchau@microsoft.com)
+
 ## 0.2.41
 
-Tue, 06 Dec 2022 00:47:50 GMT
+Tue, 06 Dec 2022 00:48:02 GMT
 
 ### Patches
 

package/lib/ChromeTraceEventsReporter.d.ts

@@ -11,8 +11,6 @@ export declare class ChromeTraceEventsReporter implements Reporter {
     private options;
     logStream: Writable;
     consoleLogStream: Writable;
-    private threads;
-    private targetIdThreadMap;
     private events;
     private outputFile;
     constructor(options: ChromeTraceEventsReporterOptions);

package/lib/ChromeTraceEventsReporter.js

@@ -14,9 +14,6 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
-function range(len) {
-    return Array(len).fill(0).map((_, idx)=>idx + 1);
-}
 function hrTimeToMicroseconds(hr) {
     return hr[0] * 1e6 + hr[1] * 1e-3;
 }
@@ -48,7 +45,7 @@ class ChromeTraceEventsReporter {
                     1000
                 ]),
                 pid: 1,
-                tid: targetRun.threadId ?? 0
+                tid: targetRun.threadId
             };
             if (categorize) {
                 event.cat += `,${categorize(targetRun)}`;
@@ -62,13 +59,11 @@ class ChromeTraceEventsReporter {
     constructor(options){
         this.options = options;
         this.consoleLogStream = process.stdout;
-        this.targetIdThreadMap = new Map();
         this.events = {
             traceEvents: [],
             displayTimeUnit: "ms"
         };
         this.outputFile = options.outputFile ?? getTimeBasedFilename("profile");
-        this.threads = range(options.concurrency);
         if (!_fs.default.existsSync(_path.default.dirname(this.outputFile))) {
             _fs.default.mkdirSync(_path.default.dirname(this.outputFile), {
                 recursive: true

package/lib/ProgressReporter.d.ts

@@ -1,13 +1,17 @@
 /// <reference types="node" />
+/// <reference types="node" />
+import EventEmitter from "events";
 import type { LogEntry, Reporter } from "@lage-run/logger";
 import type { SchedulerRunSummary } from "@lage-run/scheduler-types";
-import EventEmitter from "events";
 export declare class ProgressReporter implements Reporter {
+    timer: NodeJS.Timeout;
+    startTime: [number, number];
     logEvent: EventEmitter;
     logEntries: Map<string, LogEntry<import("@lage-run/logger").LogStructuredData>[]>;
     constructor(options?: {
         concurrency: number;
     });
+    heartBeat: () => void;
     log(entry: LogEntry<any>): void;
     summarize(schedulerRunSummary: SchedulerRunSummary): void;
 }

package/lib/ProgressReporter.js

@@ -6,10 +6,10 @@ Object.defineProperty(exports, "ProgressReporter", {
     enumerable: true,
     get: ()=>ProgressReporter
 });
-const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _progressReporterApp = require("./components/ProgressReporterApp");
 const _ink = require("ink");
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 const _events = /*#__PURE__*/ _interopRequireDefault(require("events"));
-const _formatHrtime = require("@lage-run/format-hrtime");
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
@@ -54,134 +54,6 @@ function _interopRequireWildcard(obj, nodeInterop) {
     }
     return newObj;
 }
-function ProgressStatus(props) {
-    const { waiting , completed , total  } = props.progress;
-    const percentage = total > 0 ? `${(completed / total * 100).toFixed(2)}%` : "0%";
-    const status = `Waiting: ${waiting} | Completed: ${completed} | Total: ${total} | ${percentage}`;
-    return /*#__PURE__*/ _react.createElement(_ink.Box, null, /*#__PURE__*/ _react.createElement(_ink.Text, null, status));
-}
-function ThreadItem(props) {
-    const { targetId  } = props;
-    return /*#__PURE__*/ _react.createElement(_ink.Box, null, targetId ? /*#__PURE__*/ _react.createElement(_ink.Text, {
-        color: "whiteBright"
-    }, "[ ", targetId, " ]") : /*#__PURE__*/ _react.createElement(_ink.Text, {
-        color: "gray"
-    }, "[ IDLE ]"));
-}
-function SummaryInfo(props) {
-    const { summary  } = props;
-    const { schedulerRunSummary , logEntries  } = summary;
-    const { targetRunByStatus , targetRuns , duration  } = schedulerRunSummary;
-    const slowestTargetRuns = [
-        ...targetRuns.values()
-    ].sort((a, b)=>parseFloat((0, _formatHrtime.hrToSeconds)((0, _formatHrtime.hrtimeDiff)(a.duration, b.duration))));
-    const { failed , aborted , skipped , success , pending  } = targetRunByStatus;
-    const errors = failed && failed.length > 0 ? new Map(failed.map((targetId)=>[
-            targetId,
-            logEntries.get(targetId) || []
-        ])) : new Map();
-    return /*#__PURE__*/ _react.createElement(_ink.Box, {
-        flexDirection: "column"
-    }, /*#__PURE__*/ _react.createElement(_ink.Text, {
-        color: "greenBright"
-    }, "Summary"), /*#__PURE__*/ _react.createElement(_ink.Newline, null), /*#__PURE__*/ _react.createElement(_ink.Text, {
-        color: "yellow"
-    }, "Slowest targets"), /*#__PURE__*/ _react.createElement(_ink.Box, {
-        flexDirection: "column",
-        marginLeft: 2,
-        marginY: 1
-    }, slowestTargetRuns.slice(0, 10).filter((run)=>!run.target.hidden).map((targetRun)=>/*#__PURE__*/ _react.createElement(_ink.Text, {
-            key: targetRun.target.id
-        }, targetRun.target.id, " - ", (0, _formatHrtime.formatDuration)((0, _formatHrtime.hrToSeconds)(targetRun.duration))))), errors.size > 0 ? /*#__PURE__*/ _react.createElement(ErrorMessages, {
-        errors: errors
-    }) : null, /*#__PURE__*/ _react.createElement(_ink.Text, null, `success: ${success.length}, skipped: ${skipped.length}, pending: ${pending.length}, aborted: ${aborted.length}, failed: ${failed.length}`), /*#__PURE__*/ _react.createElement(_ink.Text, null, "Took a total of ", (0, _formatHrtime.formatDuration)((0, _formatHrtime.hrToSeconds)(duration)), " to complete."));
-}
-function ErrorMessages(props) {
-    const { errors  } = props;
-    return /*#__PURE__*/ _react.createElement(_ink.Box, {
-        flexDirection: "column"
-    }, /*#__PURE__*/ _react.createElement(_ink.Text, {
-        color: "redBright"
-    }, "Errors"), /*#__PURE__*/ _react.createElement(_ink.Box, {
-        flexDirection: "column",
-        marginLeft: 2,
-        marginY: 1
-    }, [
-        ...errors.entries()
-    ].map(([targetId, logs])=>/*#__PURE__*/ _react.createElement(_ink.Box, {
-            flexDirection: "column",
-            key: `errorlogs-${targetId}`,
-            marginBottom: 1
-        }, /*#__PURE__*/ _react.createElement(_ink.Text, {
-            color: "cyanBright",
-            underline: true,
-            bold: true
-        }, targetId), /*#__PURE__*/ _react.createElement(_ink.Text, null, logs.map((entry)=>entry.msg).join("\n"))))));
-}
-function ReporterApp(props) {
-    const [threadInfo, setThreadInfo] = _react.useState({});
-    const [progress, setProgress] = _react.useState({
-        waiting: 0,
-        completed: 0,
-        total: 0
-    });
-    const [summary, setSummary] = _react.useState();
-    const { logEvent  } = props;
-    _react.useEffect(()=>{
-        logEvent.on("status", (entry)=>{
-            const { target , threadId , status  } = entry.data;
-            if (status && status === "running") {
-                setThreadInfo((threadInfo)=>({
-                        ...threadInfo,
-                        [threadId]: target.id
-                    }));
-            } else if (status === "success" || status === "aborted" || status === "failed") {
-                setThreadInfo((threadInfo)=>{
-                    const newThreadInfo = {
-                        ...threadInfo
-                    };
-                    newThreadInfo[threadId] = "";
-                    return newThreadInfo;
-                });
-            }
-        });
-        logEvent.on("progress", (progress)=>{
-            setProgress(progress);
-        });
-        logEvent.on("summary", (summary)=>{
-            setSummary(summary);
-        });
-    }, [
-        logEvent
-    ]);
-    const idleWorkerDummyThreadInfo = new Array(props.concurrency - Object.keys(threadInfo).length).fill(0);
-    return /*#__PURE__*/ _react.createElement(_ink.Box, {
-        flexDirection: "column"
-    }, /*#__PURE__*/ _react.createElement(_ink.Text, null, "Lage running tasks"), /*#__PURE__*/ _react.createElement(_ink.Text, {
-        color: "yellow"
-    }, "[warning: this progress reporter is currently in beta and unstable]"), summary ? /*#__PURE__*/ _react.createElement(SummaryInfo, {
-        summary: summary
-    }) : /*#__PURE__*/ _react.createElement(_ink.Box, {
-        flexDirection: "column"
-    }, /*#__PURE__*/ _react.createElement(_ink.Box, {
-        flexDirection: "column",
-        marginLeft: 2,
-        marginY: 1
-    }, Object.entries(threadInfo).map(([threadId, targetId])=>{
-        return /*#__PURE__*/ _react.createElement(ThreadItem, {
-            key: threadId,
-            targetId: targetId
-        });
-    }), idleWorkerDummyThreadInfo.map((_, index)=>{
-        return /*#__PURE__*/ _react.createElement(_react.Fragment, {
-            key: `idle-${index}`
-        }, /*#__PURE__*/ _react.createElement(ThreadItem, {
-            targetId: ""
-        }));
-    })), /*#__PURE__*/ _react.createElement(ProgressStatus, {
-        progress: progress
-    })));
-}
 class ProgressReporter {
     log(entry) {
         // save the logs for errors
@@ -195,6 +67,9 @@ class ProgressReporter {
         if (entry?.data?.target?.hidden) {
             return;
         }
+        if (entry.data && entry.data.schedulerRun) {
+            this.startTime = entry.data.schedulerRun.startTime;
+        }
         if (entry.data && entry.data.target && typeof entry.data.threadId !== "undefined") {
             this.logEvent.emit("status", entry);
         }
@@ -207,15 +82,27 @@ class ProgressReporter {
             schedulerRunSummary,
             logEntries: this.logEntries
         });
+        clearTimeout(this.timer);
     }
     constructor(options = {
         concurrency: 0
     }){
+        this.startTime = [
+            0,
+            0
+        ];
         this.logEvent = new _events.default();
         this.logEntries = new Map();
-        (0, _ink.render)(/*#__PURE__*/ _react.createElement(ReporterApp, {
+        this.heartBeat = ()=>{
+            this.logEvent.emit("heartbeat", {
+                currentTime: process.hrtime(this.startTime)
+            });
+            this.timer = setTimeout(this.heartBeat, 1000);
+        };
+        (0, _ink.render)(/*#__PURE__*/ _react.createElement(_progressReporterApp.ProgressReporterApp, {
             logEvent: this.logEvent,
             concurrency: options.concurrency
         }));
+        this.timer = setTimeout(this.heartBeat, 1000);
     }
 }

package/lib/components/ErrorMessages.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import type { LogEntry } from "@lage-run/logger";
+export declare function ErrorMessages(props: {
+    errors: Map<string, LogEntry<any>[]>;
+}): JSX.Element;

package/lib/components/ErrorMessages.js

@@ -0,0 +1,71 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "ErrorMessages", {
+    enumerable: true,
+    get: ()=>ErrorMessages
+});
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _ink = require("ink");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interopRequireWildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function ErrorMessages(props) {
+    const { errors  } = props;
+    return /*#__PURE__*/ _react.createElement(_ink.Box, {
+        flexDirection: "column"
+    }, /*#__PURE__*/ _react.createElement(_ink.Text, {
+        color: "redBright"
+    }, "Errors"), /*#__PURE__*/ _react.createElement(_ink.Box, {
+        flexDirection: "column",
+        marginLeft: 2,
+        marginY: 1
+    }, [
+        ...errors.entries()
+    ].map(([targetId, logs])=>/*#__PURE__*/ _react.createElement(_ink.Box, {
+            flexDirection: "column",
+            key: `errorlogs-${targetId}`,
+            marginBottom: 1
+        }, /*#__PURE__*/ _react.createElement(_ink.Text, {
+            color: "cyanBright",
+            underline: true,
+            bold: true
+        }, targetId), /*#__PURE__*/ _react.createElement(_ink.Text, null, logs.map((entry)=>entry.msg).join("\n"))))));
+}

package/lib/components/ProgressReporterApp.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="node" />
+/// <reference types="react" />
+import type EventEmitter from "events";
+export interface ProgressReporterAppProps {
+    logEvent: EventEmitter;
+    concurrency: number;
+}
+export declare function ProgressReporterApp(props: ProgressReporterAppProps): JSX.Element;

package/lib/components/ProgressReporterApp.js

@@ -0,0 +1,132 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "ProgressReporterApp", {
+    enumerable: true,
+    get: ()=>ProgressReporterApp
+});
+const _ink = require("ink");
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _progressStatus = require("./ProgressStatus");
+const _summaryInfo = require("./SummaryInfo");
+const _threadItem = require("./ThreadItem");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interopRequireWildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function range(len) {
+    return Array(len).fill(0).map((_, idx)=>idx + 1);
+}
+function ProgressReporterApp(props) {
+    const initialThreadInfo = range(props.concurrency).reduce((acc, threadId)=>{
+        acc[threadId] = "";
+        return acc;
+    }, {});
+    const [threadInfo, setThreadInfo] = _react.useState(initialThreadInfo);
+    const [progress, setProgress] = _react.useState({
+        waiting: 0,
+        completed: 0,
+        total: 0
+    });
+    const [summary, setSummary] = _react.useState();
+    const [currentTime, setCurrentTime] = _react.useState([
+        0,
+        0
+    ]);
+    const { logEvent  } = props;
+    _react.useEffect(()=>{
+        logEvent.on("status", (entry)=>{
+            const { target , threadId , status  } = entry.data;
+            if (status && status === "running") {
+                setThreadInfo((threadInfo)=>({
+                        ...threadInfo,
+                        [threadId]: target.id
+                    }));
+            } else if (status === "success" || status === "aborted" || status === "failed" || status === "skipped") {
+                setThreadInfo((threadInfo)=>{
+                    const newThreadInfo = {
+                        ...threadInfo
+                    };
+                    newThreadInfo[threadId] = "";
+                    return newThreadInfo;
+                });
+            }
+        });
+        logEvent.on("progress", (progress)=>{
+            setProgress(progress);
+        });
+        logEvent.on("summary", (summary)=>{
+            setSummary(summary);
+        });
+        logEvent.on("heartbeat", (heartbeat)=>{
+            setCurrentTime(heartbeat.currentTime);
+        });
+    }, [
+        logEvent
+    ]);
+    const arrayGapLength = props.concurrency - Object.keys(threadInfo).length;
+    const idleWorkerDummyThreadInfo = arrayGapLength > 0 ? new Array(arrayGapLength).fill(0) : [];
+    return /*#__PURE__*/ _react.createElement(_ink.Box, {
+        flexDirection: "column"
+    }, /*#__PURE__*/ _react.createElement(_ink.Text, null, "Lage running tasks with ", props.concurrency, " workers"), summary ? /*#__PURE__*/ _react.createElement(_summaryInfo.SummaryInfo, {
+        summary: summary
+    }) : /*#__PURE__*/ _react.createElement(_ink.Box, {
+        flexDirection: "column"
+    }, /*#__PURE__*/ _react.createElement(_ink.Box, {
+        flexDirection: "column",
+        marginLeft: 2,
+        marginY: 1
+    }, Object.entries(threadInfo).map(([threadId, targetId])=>{
+        return /*#__PURE__*/ _react.createElement(_threadItem.ThreadItem, {
+            key: threadId,
+            threadId: threadId,
+            targetId: targetId
+        });
+    }), idleWorkerDummyThreadInfo.map((_, index)=>{
+        return /*#__PURE__*/ _react.createElement(_react.Fragment, {
+            key: `idle-${index}`
+        }, /*#__PURE__*/ _react.createElement(_threadItem.ThreadItem, {
+            threadId: "?",
+            targetId: ""
+        }));
+    })), /*#__PURE__*/ _react.createElement(_progressStatus.ProgressStatus, {
+        progress: progress,
+        currentTime: currentTime
+    })));
+}

package/lib/components/ProgressStatus.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { Progress } from "../types/progressBarTypes";
+export interface ProgressStatusProps {
+    progress: Progress;
+    currentTime: [number, number];
+}
+export declare function ProgressStatus(props: ProgressStatusProps): JSX.Element;

package/lib/components/ProgressStatus.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "ProgressStatus", {
+    enumerable: true,
+    get: ()=>ProgressStatus
+});
+const _formatHrtime = require("@lage-run/format-hrtime");
+const _ink = require("ink");
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interopRequireWildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function ProgressStatus(props) {
+    const { waiting , completed , total  } = props.progress;
+    const percentage = total > 0 ? `${(completed / total * 100).toFixed(2)}%` : "0%";
+    const status = `Waiting: ${waiting} | Completed: ${completed} | Total: ${total} | ${percentage} | ${(0, _formatHrtime.formatDuration)((0, _formatHrtime.hrToSeconds)(props.currentTime))}`;
+    return /*#__PURE__*/ _react.createElement(_ink.Box, null, /*#__PURE__*/ _react.createElement(_ink.Text, null, status));
+}

package/lib/components/SummaryInfo.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+import type { SummaryWithLogs } from '../types/progressBarTypes';
+export interface SummaryInfoProps {
+    summary: SummaryWithLogs;
+}
+export declare function SummaryInfo(props: SummaryInfoProps): JSX.Element;

package/lib/components/SummaryInfo.js

@@ -0,0 +1,79 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "SummaryInfo", {
+    enumerable: true,
+    get: ()=>SummaryInfo
+});
+const _formatHrtime = require("@lage-run/format-hrtime");
+const _ink = require("ink");
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _errorMessages = require("./ErrorMessages");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interopRequireWildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function SummaryInfo(props) {
+    const { summary  } = props;
+    const { schedulerRunSummary , logEntries  } = summary;
+    const { targetRunByStatus , targetRuns , duration  } = schedulerRunSummary;
+    const slowestTargetRuns = [
+        ...targetRuns.values()
+    ].sort((a, b)=>parseFloat((0, _formatHrtime.hrToSeconds)((0, _formatHrtime.hrtimeDiff)(a.duration, b.duration))));
+    const { failed , aborted , skipped , success , pending  } = targetRunByStatus;
+    const errors = failed && failed.length > 0 ? new Map(failed.map((targetId)=>[
+            targetId,
+            logEntries.get(targetId) || []
+        ])) : new Map();
+    return /*#__PURE__*/ _react.createElement(_ink.Box, {
+        flexDirection: "column"
+    }, /*#__PURE__*/ _react.createElement(_ink.Text, {
+        color: "greenBright"
+    }, "Summary"), /*#__PURE__*/ _react.createElement(_ink.Newline, null), /*#__PURE__*/ _react.createElement(_ink.Text, {
+        color: "yellow"
+    }, "Slowest targets"), /*#__PURE__*/ _react.createElement(_ink.Box, {
+        flexDirection: "column",
+        marginLeft: 2,
+        marginY: 1
+    }, slowestTargetRuns.slice(0, 10).filter((run)=>!run.target.hidden).map((targetRun)=>/*#__PURE__*/ _react.createElement(_ink.Text, {
+            key: targetRun.target.id
+        }, targetRun.target.id, " - ", (0, _formatHrtime.formatDuration)((0, _formatHrtime.hrToSeconds)(targetRun.duration))))), errors.size > 0 ? /*#__PURE__*/ _react.createElement(_errorMessages.ErrorMessages, {
+        errors: errors
+    }) : null, /*#__PURE__*/ _react.createElement(_ink.Text, null, `success: ${success.length}, skipped: ${skipped.length}, pending: ${pending.length}, aborted: ${aborted.length}, failed: ${failed.length}`), /*#__PURE__*/ _react.createElement(_ink.Text, null, "Took a total of ", (0, _formatHrtime.formatDuration)((0, _formatHrtime.hrToSeconds)(duration)), " to complete."));
+}

package/lib/components/ThreadItem.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export declare function ThreadItem(props: {
+    threadId: string | number;
+    targetId: string;
+}): JSX.Element;

package/lib/components/ThreadItem.js

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "ThreadItem", {
+    enumerable: true,
+    get: ()=>ThreadItem
+});
+const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
+const _ink = require("ink");
+function _getRequireWildcardCache(nodeInterop) {
+    if (typeof WeakMap !== "function") return null;
+    var cacheBabelInterop = new WeakMap();
+    var cacheNodeInterop = new WeakMap();
+    return (_getRequireWildcardCache = function(nodeInterop) {
+        return nodeInterop ? cacheNodeInterop : cacheBabelInterop;
+    })(nodeInterop);
+}
+function _interopRequireWildcard(obj, nodeInterop) {
+    if (!nodeInterop && obj && obj.__esModule) {
+        return obj;
+    }
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
+        return {
+            default: obj
+        };
+    }
+    var cache = _getRequireWildcardCache(nodeInterop);
+    if (cache && cache.has(obj)) {
+        return cache.get(obj);
+    }
+    var newObj = {};
+    var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+    for(var key in obj){
+        if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+            var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+            if (desc && (desc.get || desc.set)) {
+                Object.defineProperty(newObj, key, desc);
+            } else {
+                newObj[key] = obj[key];
+            }
+        }
+    }
+    newObj.default = obj;
+    if (cache) {
+        cache.set(obj, newObj);
+    }
+    return newObj;
+}
+function ThreadItem(props) {
+    const { targetId , threadId  } = props;
+    return /*#__PURE__*/ _react.createElement(_ink.Box, null, /*#__PURE__*/ _react.createElement(_ink.Box, {
+        width: "2"
+    }, /*#__PURE__*/ _react.createElement(_ink.Text, null, threadId)), targetId ? /*#__PURE__*/ _react.createElement(_ink.Text, {
+        color: "whiteBright"
+    }, targetId, " ") : /*#__PURE__*/ _react.createElement(_ink.Text, {
+        color: "gray"
+    }, "IDLE"));
+}

package/lib/types/progressBarTypes.d.ts

@@ -0,0 +1,14 @@
+import type { LogEntry } from "@lage-run/logger";
+import type { SchedulerRunSummary } from "@lage-run/scheduler-types";
+export interface Progress {
+    waiting: number;
+    completed: number;
+    total: number;
+}
+export interface ThreadInfo {
+    [threadId: string]: string;
+}
+export interface SummaryWithLogs {
+    schedulerRunSummary: SchedulerRunSummary;
+    logEntries: Map<string, LogEntry[]>;
+}

package/lib/types/progressBarTypes.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lage-run/reporters",
-  "version": "0.2.41",
+  "version": "0.2.43",
   "description": "Log reporters for Lage",
   "repository": {
     "url": "https://github.com/microsoft/lage"
@@ -26,7 +26,7 @@
     "react": "^18.2.0"
   },
   "devDependencies": {
-    "@types/react": "18.0.25",
+    "@types/react": "18.0.26",
     "memory-streams": "0.1.3"
   },
   "publishConfig": {