Adapt after adding local traceviewer-* libs as subtrees

Small adaptations to root package.json, various tsconfig.json.

Signed-off-by: Marc Dumais <[email protected]>

Add README under local-libs

Signed-off-by: Marc Dumais <[email protected]>

[traceviewer-react] add missing @types/lodash.debounce dev dependency

Signed-off-by: Marc Dumais <[email protected]>

Align eslint config with theia-trace-extension

For smoother sharing of the traceviewer-* libraries

Signed-off-by: Marc Dumais <[email protected]>

[traceviewer-*] align code to respect linter and formatter

Signed-off-by: Marc Dumais <[email protected]>

update yarn.lock

Signed-off-by: Marc Dumais <[email protected]>

Improved watch mode

With a correct tsconfig.json setup, it's possible to watch
all the typescript workspaces' code using a single "tsc -b -w",
executed at the repo root. It's also necessary to cover webpack
where it is used.

https://webpack.js.org/configuration/watch

Signed-off-by: Marc Dumais <[email protected]>

Update root README

Signed-off-by: Marc Dumais <[email protected]>

Author: marcdumais-work

base/.eslintrc.js

@@ -13,9 +13,10 @@ module.exports = {
     },
     extends: [
         'plugin:@typescript-eslint/recommended',
-        '../../configs/base.eslintrc.json',
-        '../../configs/warnings.eslintrc.json',
-        '../../configs/errors.eslintrc.json'
+        '../../../configs/base.eslintrc.json',
+        '../../../configs/warnings.eslintrc.json',
+        '../../../configs/errors.eslintrc.json',
+        "prettier"
     ],
     ignorePatterns: [
         'node_modules',

base/package.json

@@ -34,7 +34,6 @@
         "lint": "eslint .",
         "lint:fix": "eslint . --fix",
         "test": "echo 'test'",
-        "watch": "tsc -w",
         "format:write": "prettier --write ./src",
         "format:check": "prettier --check ./src"
     }

react-components/.eslintrc.js

@@ -17,9 +17,10 @@ module.exports = {
     extends: [
         'plugin:react/recommended',
         'plugin:@typescript-eslint/recommended',
-        '../../configs/base.eslintrc.json',
-        '../../configs/warnings.eslintrc.json',
-        '../../configs/errors.eslintrc.json'
+        '../../../configs/base.eslintrc.json',
+        '../../../configs/warnings.eslintrc.json',
+        '../../../configs/errors.eslintrc.json',
+        "prettier"
     ],
     ignorePatterns: [
         'node_modules',

react-components/package.json

@@ -44,6 +44,7 @@
         "@types/d3": "^7.1.0",
         "@types/jest": "^28.0.0",
         "@types/lodash": "^4.14.142",
+        "@types/lodash.debounce": "4.0.3",
         "@types/react-grid-layout": "^1.1.1",
         "@types/react-modal": "^3.8.2",
         "@types/react-test-renderer": "^18.3.0",
@@ -57,6 +58,7 @@
         "jest": "^28.1.3",
         "jest-canvas-mock": "^2.4.0",
         "jest-environment-jsdom": "^28.1.3",
+        "prettier": "^3.6.2",
         "react-test-renderer": "^18.2.0",
         "rimraf": "^5.0.0",
         "ts-jest": "^28.0.8",
@@ -68,7 +70,6 @@
         "lint": "eslint .",
         "lint:fix": "eslint . --fix",
         "test": "jest  --config jest.config.json",
-        "watch": "tsc -b -w",
         "format:write": "prettier --write ./src",
         "format:check": "prettier --check ./src"
     }

react-components/src/components/abstract-gantt-output-component.tsx

@@ -537,8 +537,8 @@ export abstract class AbstractGanttOutputComponent<
         return this.state.markerCategoryEntries.length <= 1
             ? 0
             : this.state.collapsedMarkerNodes.length
-            ? rowHeight
-            : this.state.markerCategoryEntries.length * rowHeight + scrollbarHeight;
+              ? rowHeight
+              : this.state.markerCategoryEntries.length * rowHeight + scrollbarHeight;
     }
 
     abstract renderTree(): React.ReactNode;

react-components/src/components/abstract-xy-output-component.tsx

@@ -383,12 +383,12 @@ export abstract class AbstractXYOutputComponent<
             d >= 1000000000000
                 ? Math.round(d / 100000000000) / 10 + 'G'
                 : d >= 1000000000
-                ? Math.round(d / 100000000) / 10 + 'B'
-                : d >= 1000000
-                ? Math.round(d / 100000) / 10 + 'M'
-                : d >= 1000
-                ? Math.round(d / 100) / 10 + 'K'
-                : Math.round(d * 10) / 10;
+                  ? Math.round(d / 100000000) / 10 + 'B'
+                  : d >= 1000000
+                    ? Math.round(d / 100000) / 10 + 'M'
+                    : d >= 1000
+                      ? Math.round(d / 100) / 10 + 'K'
+                      : Math.round(d * 10) / 10;
 
         if (this.state.allMax > 0) {
             select(this.yAxisRef.current)

react-components/src/components/data-providers/tsp-data-provider.ts

@@ -197,7 +197,7 @@ export class TspDataProvider {
                         start: arrow.start - offset,
                         end: arrow.end - offset
                     } as TimelineChart.TimeGraphRange
-                } as TimelineChart.TimeGraphArrow)
+                }) as TimelineChart.TimeGraphArrow
         );
         return arrows;
     }

react-components/src/components/utils/xy-output-component-utils.tsx

@@ -130,9 +130,9 @@ export function drawSelection(params: DrawSelectionParams): void {
     const { startPixel, endPixel, isBarPlot, chartArea, props, ctx, invertSelection } = params;
     const minPixel = Math.min(startPixel, endPixel);
     const maxPixel = Math.max(startPixel, endPixel);
-    const initialPoint = isBarPlot ? 0 : chartArea?.left ?? 0;
+    const initialPoint = isBarPlot ? 0 : (chartArea?.left ?? 0);
     const chartHeight = parseInt(props.style.height.toString());
-    const finalPoint = isBarPlot ? chartHeight : chartArea?.bottom ?? 0;
+    const finalPoint = isBarPlot ? chartHeight : (chartArea?.bottom ?? 0);
 
     if (ctx) {
         ctx.save();

react-components/src/components/xy-output-component.tsx

@@ -185,9 +185,9 @@ export class XYOutputComponent extends AbstractXYOutputComponent<AbstractOutputP
     ) {
         const minPixel = Math.min(startPixel, endPixel);
         const maxPixel = Math.max(startPixel, endPixel);
-        const initialPoint = this.isBarPlot ? 0 : chartArea?.left ?? 0;
+        const initialPoint = this.isBarPlot ? 0 : (chartArea?.left ?? 0);
         const chartHeight = parseInt(this.props.style.height.toString());
-        const finalPoint = this.isBarPlot ? chartHeight : chartArea?.bottom ?? 0;
+        const finalPoint = this.isBarPlot ? chartHeight : (chartArea?.bottom ?? 0);
         if (ctx) {
             ctx.save();