feat(sandbox): create the sandox-angular-lib project (ARCH-285) (#2848

)

apps/sandbox/angular-app/src/app/app.component.html

@@ -1 +1,3 @@
-<app-nx-welcome></app-nx-welcome> <router-outlet></router-outlet>
+<app-nx-welcome></app-nx-welcome>
+<sandbox-angular-lib></sandbox-angular-lib>
+<router-outlet></router-outlet>

apps/sandbox/angular-app/src/app/app.component.ts

@@ -1,10 +1,11 @@
 import { Component } from '@angular/core';
 import { RouterModule } from '@angular/router';
 import { NxWelcomeComponent } from './nx-welcome.component';
+import { SandboxAngularLibComponent } from '@sagebionetworks/sandbox-angular-lib';
 
 @Component({
   standalone: true,
-  imports: [NxWelcomeComponent, RouterModule],
+  imports: [NxWelcomeComponent, RouterModule, SandboxAngularLibComponent],
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrl: './app.component.scss',

libs/sandbox/angular-lib/.eslintrc.json

@@ -0,0 +1,33 @@
+{
+  "extends": ["../../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts"],
+      "extends": ["plugin:@nx/angular", "plugin:@angular-eslint/template/process-inline-templates"],
+      "rules": {
+        "@angular-eslint/directive-selector": [
+          "error",
+          {
+            "type": "attribute",
+            "prefix": "sandbox",
+            "style": "camelCase"
+          }
+        ],
+        "@angular-eslint/component-selector": [
+          "error",
+          {
+            "type": "element",
+            "prefix": "sandbox",
+            "style": "kebab-case"
+          }
+        ]
+      }
+    },
+    {
+      "files": ["*.html"],
+      "extends": ["plugin:@nx/angular-template"],
+      "rules": {}
+    }
+  ]
+}

libs/sandbox/angular-lib/README.md

@@ -0,0 +1,7 @@
+# sandbox-angular-lib
+
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `nx test sandbox-angular-lib` to execute the unit tests.

libs/sandbox/angular-lib/jest.config.ts

@@ -0,0 +1,21 @@
+export default {
+  displayName: 'sandbox-angular-lib',
+  preset: '../../../jest.preset.js',
+  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
+  coverageDirectory: '../../../coverage/libs/sandbox/angular-lib',
+  transform: {
+    '^.+\\.(ts|mjs|js|html)$': [
+      'jest-preset-angular',
+      {
+        tsconfig: '<rootDir>/tsconfig.spec.json',
+        stringifyContentPathRegex: '\\.(html|svg)$',
+      },
+    ],
+  },
+  transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
+  snapshotSerializers: [
+    'jest-preset-angular/build/serializers/no-ng-attributes',
+    'jest-preset-angular/build/serializers/ng-snapshot',
+    'jest-preset-angular/build/serializers/html-comment',
+  ],
+};

libs/sandbox/angular-lib/project.json

@@ -0,0 +1,20 @@
+{
+  "name": "sandbox-angular-lib",
+  "$schema": "../../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "libs/sandbox/angular-lib/src",
+  "prefix": "lib",
+  "projectType": "library",
+  "tags": [],
+  "targets": {
+    "test": {
+      "executor": "@nx/jest:jest",
+      "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
+      "options": {
+        "jestConfig": "libs/sandbox/angular-lib/jest.config.ts"
+      }
+    },
+    "lint": {
+      "executor": "@nx/eslint:lint"
+    }
+  }
+}

libs/sandbox/angular-lib/src/index.ts

@@ -0,0 +1 @@
+export * from './lib/sandbox-angular-lib/sandbox-angular-lib.component';

libs/sandbox/angular-lib/src/lib/sandbox-angular-lib/sandbox-angular-lib.component.html

@@ -0,0 +1 @@
+<p>sandbox-angular-lib works!</p>

libs/sandbox/angular-lib/src/lib/sandbox-angular-lib/sandbox-angular-lib.component.spec.ts

@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { SandboxAngularLibComponent } from './sandbox-angular-lib.component';
+
+describe('SandboxAngularLibComponent', () => {
+  let component: SandboxAngularLibComponent;
+  let fixture: ComponentFixture<SandboxAngularLibComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [SandboxAngularLibComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(SandboxAngularLibComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

libs/sandbox/angular-lib/src/lib/sandbox-angular-lib/sandbox-angular-lib.component.ts

@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+@Component({
+  selector: 'sandbox-angular-lib',
+  standalone: true,
+  imports: [CommonModule],
+  templateUrl: './sandbox-angular-lib.component.html',
+  styleUrl: './sandbox-angular-lib.component.css',
+})
+export class SandboxAngularLibComponent {}

libs/sandbox/angular-lib/src/test-setup.ts

@@ -0,0 +1,8 @@
+// @ts-expect-error https://thymikee.github.io/jest-preset-angular/docs/getting-started/test-environment
+globalThis.ngJest = {
+  testEnvironmentOptions: {
+    errorOnUnknownElements: true,
+    errorOnUnknownProperties: true,
+  },
+};
+import 'jest-preset-angular/setup-jest';

libs/sandbox/angular-lib/tsconfig.json

@@ -0,0 +1,28 @@
+{
+  "compilerOptions": {
+    "target": "es2022",
+    "forceConsistentCasingInFileNames": true,
+    "strict": true,
+    "noImplicitOverride": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true
+  },
+  "files": [],
+  "include": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ],
+  "extends": "../../../tsconfig.base.json",
+  "angularCompilerOptions": {
+    "enableI18nLegacyMessageIdFormat": false,
+    "strictInjectionParameters": true,
+    "strictInputAccessModifiers": true,
+    "strictTemplates": true
+  }
+}

libs/sandbox/angular-lib/tsconfig.lib.json

@@ -0,0 +1,12 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../../dist/out-tsc",
+    "declaration": true,
+    "declarationMap": true,
+    "inlineSources": true,
+    "types": []
+  },
+  "exclude": ["src/**/*.spec.ts", "src/test-setup.ts", "jest.config.ts", "src/**/*.test.ts"],
+  "include": ["src/**/*.ts"]
+}

libs/sandbox/angular-lib/tsconfig.spec.json

@@ -0,0 +1,11 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../../dist/out-tsc",
+    "module": "commonjs",
+    "target": "es2016",
+    "types": ["jest", "node"]
+  },
+  "files": ["src/test-setup.ts"],
+  "include": ["jest.config.ts", "src/**/*.test.ts", "src/**/*.spec.ts", "src/**/*.d.ts"]
+}

tsconfig.base.json

@@ -68,7 +68,8 @@
       "@sagebionetworks/shared/util": ["libs/shared/typescript/util/src/index.ts"],
       "@sagebionetworks/shared/web-components": [
         "libs/shared/typescript/web-components/src/index.ts"
-      ]
+      ],
+      "@sagebionetworks/sandbox-angular-lib": ["libs/sandbox/angular-lib/src/index.ts"]
     }
   },
   "exclude": ["node_modules", "tmp"]