feat: create react-components and source-iotsitewise pkgs (#57)

* move core build files away from stencil config into package.json to prepare moving away from stencil to build core * fix various typing issues in iot-app-kit * remove unused code * remove unecessary `AssetQuery` type, which collides with other types * make test runner fail if uncommited changes present
awslabs · Feb 16, 2022 · 16451b1 · 16451b1
1 parent 1927053
commit 16451b1
Show file tree

Hide file tree

Showing 63 changed files with 886 additions and 1,352 deletions.
diff --git a/package.json b/package.json
@@ -15,12 +15,12 @@
     "start": "cd packages/components && yarn run start",
     "build": "lerna run build --stream",
     "clean": "git clean -dxf -e /.idea -e /.vscode -e creds.json",
-    "lint": "npm-run-all -p lint:eslint",
-    "lint:eslint": "eslint --ext .js,.ts,.tsx . --max-warnings 0",
     "fix": "npm-run-all -p fix:eslint",
     "fix:eslint": "eslint --fix --ext .js,.ts,.tsx .",
-    "test": "npm-run-all -p test:unit lint",
+    "test": "npm-run-all -p test:unit test:eslint test:git",
+    "test:eslint": "eslint --ext .js,.ts,.tsx . --max-warnings 0",
     "test:unit": "lerna run test --stream --concurrency 1",
+    "test:git": "git diff --exit-code",
     "pack": "lerna run pack"
   },
   "devDependencies": {
@@ -55,7 +55,6 @@
     "cypress-shadow-dom": "^1.3.0",
     "eslint": "^8.2.0",
     "eslint-config-airbnb-base": "^15.0.0",
-    "eslint-config-airbnb-typescript": "14.0.1",
     "eslint-config-prettier": "8.3.0",
     "eslint-plugin-chai-friendly": "0.7.2",
     "eslint-plugin-cypress": "2.12.1",

diff --git a/packages/components/package.json b/packages/components/package.json
@@ -30,10 +30,10 @@
     "@awsui/collection-hooks": "^1.0.0",
     "@awsui/components-react": "^3.0.0",
     "@awsui/design-tokens": "^3.0.0",
-    "@iot-app-kit/core": "^0.0.1",
-    "@iot-app-kit/related-table": "^1.0.0",
+    "@iot-app-kit/core": "0.0.1",
+    "@iot-app-kit/related-table": "1.0.0",
     "@stencil/core": "^2.7.0",
-    "@synchro-charts/core": "^1.0.8",
+    "@synchro-charts/core": "^1.1.1",
     "styled-components": "^5.3.0"
   },
   "devDependencies": {
@@ -50,6 +50,8 @@
     "cypress": "7.7.0",
     "cypress-image-snapshot": "^4.0.1",
     "cypress-wait-until": "^1.7.2",
+    "jest": "26.3.0",
+    "jest-cli": "^26.5.1",
     "vue": "^3.2.26"
   },
   "license": "Apache-2.0"

diff --git a/packages/components/src/integration/iot-connector/iot-connector.spec.component.ts b/packages/components/src/integration/iot-connector/iot-connector.spec.component.ts
@@ -1,8 +1,9 @@
-import { renderChart, testChartContainerClassNameSelector } from '@iot-app-kit/components/src/testing/renderChart';
-import { SECOND_IN_MS } from '@iot-app-kit/core/src/common/time';
+import { renderChart, testChartContainerClassNameSelector } from '../../testing/renderChart';
 import { mockGetAggregatedOrRawResponse } from '../../testing/mocks/mockGetAggregatedOrRawResponse';
 import { mockGetAssetSummary } from '../../testing/mocks/mockGetAssetSummaries';
 
+const SECOND_IN_MS = 1000;
+
 const snapshotOptions = {
   clip: { x: 0, y: 0, width: 400, height: 500 },
 };

diff --git a/packages/components/src/testing/mockWidgetProperties.ts b/packages/components/src/testing/mockWidgetProperties.ts
@@ -1,72 +1,12 @@
-import {
-  COMPARISON_OPERATOR,
-  DataStreamInfo,
-  DataType,
-  StatusIcon,
-  StreamType,
-  Threshold,
-  ViewPort,
-} from '@synchro-charts/core';
 import { DataStream } from '@iot-app-kit/core';
 import { toDataStreamId } from './dataStreamId';
-const DAY_IN_MS = 1000 * 60 * 60 * 24;
 
-const VIEW_PORT: ViewPort = {
-  start: new Date(2000, 0, 0, 0),
-  end: new Date(2001, 0, 0, 0),
-  yMin: 0,
-  yMax: 100,
-};
-
-/**
- * Shared Mock Data
- */
-// Number 1
-export const NUMBER_INFO_1: DataStreamInfo = {
-  id: 'number-some-id',
-  resolution: 0,
-  dataType: DataType.NUMBER,
-  color: 'cyan',
-  name: 'number-some-name',
-};
-export const NUMBER_STREAM_1: DataStream<number> = {
-  id: NUMBER_INFO_1.id,
-  color: 'cyan',
-  name: 'number-some-name',
-  dataType: 'NUMBER',
-  resolution: 0,
-  data: [
-    {
-      x: new Date(2000, 0, 0, 0, 0).getTime(),
-      y: 100,
-    },
-  ],
-};
-
-/**
- * String Mock Data
- */
-
-// String Info 1
-export const STRING_INFO_1: DataStreamInfo = {
-  id: 'some-string-info',
-  resolution: 0,
-  dataType: DataType.STRING,
-  color: 'red',
-  name: 'some-name',
-};
-
-export const DATA_STREAM_INFO: DataStreamInfo = {
+export const DATA_STREAM: DataStream<number> = {
   id: toDataStreamId({ assetId: 'some-asset-id', propertyId: 'some-property-id' }),
   resolution: 0,
   detailedName: 'data-stream-name/detailed-name',
   name: 'data-stream-name',
   color: 'black',
-  dataType: DataType.NUMBER,
-};
-
-export const DATA_STREAM: DataStream<number> = {
-  ...DATA_STREAM_INFO,
   dataType: 'NUMBER',
   data: [],
 };
@@ -79,53 +19,3 @@ export const DATA_STREAM_2: DataStream<number> = {
   dataType: 'NUMBER',
   data: [],
 };
-
-export const ALARM = 'alarm';
-export const OK = 'ok';
-
-export const NON_BREACHED_ALARM_INFO: DataStreamInfo = {
-  id: 'alarm-stream-2',
-  resolution: 0,
-  dataType: DataType.STRING,
-  streamType: StreamType.ALARM,
-  name: 'alarm stream 2',
-  color: 'blue',
-};
-export const WITHIN_VIEWPORT_DATE = new Date(2000, 0, 1);
-export const BEFORE_VIEWPORT_DATE = new Date(VIEW_PORT.start.getTime() - DAY_IN_MS);
-
-export const ALARM_STREAM: DataStream<string> = {
-  id: 'alarm-stream',
-  dataType: 'STRING',
-  name: 'alarm stream',
-  color: 'red',
-  streamType: StreamType.ALARM,
-  resolution: 0,
-  data: [
-    {
-      x: WITHIN_VIEWPORT_DATE.getTime(),
-      y: ALARM,
-    },
-  ],
-};
-
-export const ALARM_THRESHOLD: Threshold<string> = {
-  value: ALARM,
-  color: 'orange',
-  comparisonOperator: COMPARISON_OPERATOR.EQUAL,
-  icon: StatusIcon.ACTIVE,
-};
-
-export const STRING_STREAM_1: DataStream<string> = {
-  id: STRING_INFO_1.id,
-  dataType: 'STRING',
-  color: 'red',
-  name: 'some-name',
-  resolution: 0,
-  data: [
-    {
-      x: new Date(2000, 0, 0, 0, 0).getTime(),
-      y: 'ALARM',
-    },
-  ],
-};
diff --git a/packages/components/src/testing/renderChart.tsx b/packages/components/src/testing/renderChart.tsx
@@ -1,5 +1,6 @@
 import { mount } from '@cypress/vue';
 import { h } from 'vue';
+import '@synchro-charts/core';
 import {
   StyleSettingsMap,
   initialize,
@@ -11,10 +12,10 @@ import {
 } from '@iot-app-kit/core';
 import { MinimalViewPortConfig } from '@synchro-charts/core';
 import { MINUTE_IN_MS } from '@iot-app-kit/core/src/common/time';
-const { applyPolyfills, defineCustomElements } = require('@iot-app-kit/components/loader');
+const { defineCustomElements } = require('@iot-app-kit/components/loader');
 import '@synchro-charts/core/dist/synchro-charts/synchro-charts.css';
 
-applyPolyfills().then(() => defineCustomElements());
+defineCustomElements();
 
 export const testChartContainerClassName = 'test-chart-container';
 

diff --git a/packages/components/tsconfig.json b/packages/components/tsconfig.json
@@ -10,6 +10,7 @@
     "target": "es2017",
     "jsx": "react",
     "jsxFactory": "h",
+    "importHelpers": true,
     "esModuleInterop": true,
     "strict": true,
     "strictPropertyInitialization": false,

diff --git a/packages/core/global.d.ts b/packages/core/global.d.ts
@@ -0,0 +1 @@
+import 'jest-extended';
diff --git a/packages/core/jest.config.js b/packages/core/jest.config.js
@@ -0,0 +1,20 @@
+module.exports = {
+  preset: 'ts-jest',
+  testEnvironment: 'node',
+  setupFilesAfterEnv: ['jest-extended/all'],
+  collectCoverageFrom: ['src/**/*.{ts,tsx}'],
+  coveragePathIgnorePatterns: ['/typings/', '/src/testing/', '/src/iotsitewise/__mocks__'],
+  testPathIgnorePatterns: ['/src/testing', '/dist'],
+  coverageReporters: ['text-summary', 'cobertura', 'html', 'json', 'json-summary'],
+  moduleNameMapper: {
+    '\\.(css|scss|svg)$': 'identity-obj-proxy',
+  },
+  coverageThreshold: {
+    global: {
+      statements: 80,
+      branches: 80,
+      functions: 80,
+      lines: 80,
+    },
+  },
+};
diff --git a/packages/core/package.json b/packages/core/package.json
@@ -1,16 +1,11 @@
 {
   "name": "@iot-app-kit/core",
+  "license": "Apache-2.0",
   "version": "0.0.1",
   "description": "IoT Application Kit core",
   "main": "./dist/index.cj.js",
   "module": "./dist/index.js",
-  "es2015": "./dist/esm/index.js",
-  "es2017": "./dist/esm/index.js",
-  "jsnext:main": "./dist/esm/index.js",
-  "types": "./dist/types/interface.d.ts",
-  "collection": "./dist/collection/collection-manifest.json",
-  "collection:main": "./dist/collection/index.js",
-  "unpkg": "./dist/iot-app-kit/iot-app-kit.js",
+  "types": "./dist/index.d.ts",
   "publishConfig": {
     "access": "public"
   },
@@ -23,24 +18,23 @@
   },
   "scripts": {
     "clean": "rm -rf dist && rm -rf screenshot",
-    "build": "stencil build",
-    "start": "stencil build --dev --watch --serve",
-    "test": "npm-run-all -p test:unit-test test:typescript",
-    "test:unit-test": "TZ=UTC stencil test --spec --coverage",
+    "build": "yarn run clean && rollup --config rollup.config.js",
+    "test": "npm-run-all -p test:jest test:typescript",
+    "test:jest": "TZ=UTC jest --coverage",
+    "test.watch": "TZ=UTC jest --watchAll",
     "test:typescript": "tsc --noEmit",
-    "test.watch": "TZ=UTC stencil test --spec --watchAll",
     "copy:license": "cp ../../LICENSE LICENSE",
     "copy:notice": "cp ../../NOTICE NOTICE",
-    "release": "yarn run clean && npm-run-all -p build test lint",
+    "release": "yarn run clean && npm-run-all -p build test",
     "prepublishOnly": "yarn release",
     "prepack": "yarn run copy:license && yarn run copy:notice",
     "pack": "yarn pack"
   },
   "dependencies": {
     "@aws-sdk/client-iotsitewise": "^3.39.0",
     "@aws-sdk/credential-providers": "^3.39.0",
-    "@stencil/core": "^2.10.0",
-    "@synchro-charts/core": "^1.0.8",
+    "@rollup/plugin-typescript": "^8.3.0",
+    "@synchro-charts/core": "^1.1.1",
     "d3-array": "^2.3.2",
     "flush-promises": "^1.0.2",
     "intervals-fn": "^3.0.3",
@@ -56,5 +50,10 @@
     "typescript": "4.4.4",
     "uuid": "^3.3.2"
   },
-  "license": "Apache-2.0"
+  "devDependencies": {
+    "@types/jest": "^27.4.0",
+    "jest": "^27.5.1",
+    "jest-extended": "^2.0.0",
+    "ts-jest": "^27.1.3"
+  }
 }
diff --git a/packages/core/rollup.config.js b/packages/core/rollup.config.js
@@ -0,0 +1,24 @@
+import typescript from '@rollup/plugin-typescript';
+import pkg from './package.json';
+
+export default [
+  {
+    input: 'src/index.ts',
+    output: [
+      {
+        file: pkg.main,
+        format: 'cjs',
+      },
+      {
+        file: pkg.module,
+        format: 'esm',
+      },
+    ],
+    plugins: [typescript({ tsconfig: './tsconfig.json' })],
+  },
+  {
+    input: 'src/testing/index.ts',
+    output: { file: 'dist/testing/index.js', format: 'es' },
+    plugins: [typescript()],
+  },
+];
diff --git a/packages/core/src/asset-modules/sitewise/requestProcessorWorkerGroup.ts b/packages/core/src/asset-modules/sitewise/requestProcessorWorkerGroup.ts
@@ -1,8 +1,7 @@
-import { AssetQuery } from './types';
-import { Observable, Subscriber, Subscription } from 'rxjs';
+import { Observable, Subscriber } from 'rxjs';
 import { RequestProcessorWorker } from './requestProcessorWorker';
 
-export class RequestProcessorWorkerGroup<TQuery extends AssetQuery, TResult> {
+export class RequestProcessorWorkerGroup<TQuery, TResult> {
   private readonly activeQueries: Map<string, RequestProcessorWorker<TResult>> = new Map();
   private readonly workerFactory: (query: TQuery) => Observable<TResult>;
   private readonly queryToKey: (query: TQuery) => string;