Development

apps/ramp-client/Dockerfile

@@ -1,4 +1,4 @@
-FROM node:18.16-alpine3.17 AS build
+FROM node:20.11-alpine3.18 AS build
 
 ENV npm_config_unsafe_perm=true
 
@@ -20,7 +20,7 @@ RUN npm install -g nx
 RUN npm install
 RUN nx g @nrwl/workspace:fix-configuration
 RUN npm i
-RUN NODE_OPTIONS=--max_old_space_size=4096 nx run ramp-client:prerender:production --verbose
+RUN NODE_OPTIONS=--max_old_space_size=8192 nx run ramp-client:build:production --verbose
 
 FROM registry.ncats.nih.gov:5000/labshare/docker-base-web
 

apps/ramp-client/project.json

@@ -4,12 +4,16 @@
   "projectType": "application",
   "prefix": "ramp-client",
   "sourceRoot": "apps/ramp-client/src",
+  "tags": ["app:ramp-client"],
   "targets": {
     "build": {
       "executor": "@angular-devkit/build-angular:application",
       "outputs": ["{options.outputPath}"],
       "options": {
-        "outputPath": "dist/ramp-client/browser",
+        "allowedCommonJsDependencies": [
+          "swagger-ui"
+        ],
+        "outputPath": "dist/ramp-client",
         "index": "apps/ramp-client/src/index.html",
         "browser": "apps/ramp-client/src/main.ts",
         "polyfills": ["zone.js"],
@@ -38,7 +42,10 @@
         ],
         "scripts": [],
         "server": "apps/ramp-client/src/main.server.ts",
-        "prerender": true,
+        "prerender": {
+         "discoverRoutes": false,
+          "routesFile": "./apps/ramp-client/routes.txt"
+        },
         "ssr": {
           "entry": "apps/ramp-client/server.ts"
         }
@@ -48,13 +55,13 @@
           "budgets": [
             {
               "type": "initial",
-              "maximumWarning": "500kb",
-              "maximumError": "1000mb"
+              "maximumWarning": "5000kb",
+              "maximumError": "10000mb"
             },
             {
               "type": "anyComponentStyle",
-              "maximumWarning": "2kb",
-              "maximumError": "500kb"
+              "maximumWarning": "2000kb",
+              "maximumError": "5000kb"
             }
           ],
           "fileReplacements": [
@@ -63,7 +70,15 @@
               "with": "apps/ramp-client/src/environments/environment.prod.ts"
             }
           ],
-          "outputHashing": "all"
+          "outputHashing": "all",
+          "optimization": {
+            "scripts": true,
+            "styles": {
+              "minify": true,
+              "inlineCritical": true
+            },
+            "fonts": false
+          }
         },
         "development": {
           "optimization": false,
@@ -185,6 +200,5 @@
       },
       "defaultConfiguration": "production"
     }
-  },
-  "tags": ["app:ramp-client"]
+  }
 }

apps/ramp-client/server.ts

@@ -2,7 +2,7 @@ import 'zone.js/node';
 
 import { APP_BASE_HREF } from '@angular/common';
 import { CommonEngine } from '@angular/ssr';
-import * as express from 'express';
+import {default as express} from 'express';
 import { existsSync } from 'node:fs';
 import { join } from 'node:path';
 import bootstrap from './src/main.server';

libs/features/ramp/reaction-classes-from-analytes/.eslintrc.json

@@ -0,0 +1,36 @@
+{
+  "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": "lib",
+            "style": "camelCase"
+          }
+        ],
+        "@angular-eslint/component-selector": [
+          "error",
+          {
+            "type": "element",
+            "prefix": "lib",
+            "style": "kebab-case"
+          }
+        ]
+      }
+    },
+    {
+      "files": ["*.html"],
+      "extends": ["plugin:@nx/angular-template"],
+      "rules": {}
+    }
+  ]
+}

libs/features/ramp/reaction-classes-from-analytes/README.md

@@ -0,0 +1,7 @@
+# features-ramp-reaction-classes-from-analytes
+
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `nx test features-ramp-reaction-classes-from-analytes` to execute the unit tests.

libs/features/ramp/reaction-classes-from-analytes/jest.config.ts

@@ -0,0 +1,23 @@
+/* eslint-disable */
+export default {
+  displayName: 'features-ramp-reaction-classes-from-analytes',
+  preset: '../../../../jest.preset.js',
+  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
+  coverageDirectory:
+    '../../../../coverage/libs/features/ramp/reaction-classes-from-analytes',
+  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/features/ramp/reaction-classes-from-analytes/project.json

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

libs/features/ramp/reaction-classes-from-analytes/src/index.ts

@@ -0,0 +1 @@
+export * from './lib/features-ramp-reaction-classes-from-analytes/features-ramp-reaction-classes-from-analytes.component';

libs/features/ramp/reaction-classes-from-analytes/src/lib/features-ramp-reaction-classes-from-analytes/features-ramp-reaction-classes-from-analytes.component.html

@@ -0,0 +1,41 @@
+<div class="content-panel">
+  <div class="row space-around-row">
+    <div class="full-width">
+      <h1 class="page-title">
+        {{ title | titlecase }}
+      </h1>
+    </div>
+  </div>
+  <div class="row space-around-row">
+    <div class="full-width">
+      <ramp-description
+        [supportedIds]="supportedIds"
+        [description]="description"
+      ></ramp-description>
+    </div>
+  </div>
+
+  <ramp-input-row
+    [input]="input"
+    [examples]="examples"
+    (dataSearch)="fetchReactions($event)"
+    (dataDownload)="fetchReactionsFile($event)"
+  >
+  </ramp-input-row>
+
+  <ramp-feedback-panel
+    [matchesLength]="matches.length"
+    [dataLength]="dataAsDataProperty.length"
+    [inputLength]="inputList.length"
+    [noMatches]="noMatches"
+    [inputType]="input"
+    [function]="query.functionCall"
+  >
+  </ramp-feedback-panel>
+
+  <ramp-query-page
+    [dataColumns]="reactionColumns"
+    [dataAsDataProperty]="dataAsDataProperty"
+  >
+  </ramp-query-page>
+</div>

libs/features/ramp/reaction-classes-from-analytes/src/lib/features-ramp-reaction-classes-from-analytes/features-ramp-reaction-classes-from-analytes.component.spec.ts

@@ -0,0 +1,39 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
+import { provideEffects } from "@ngrx/effects";
+import { provideStore, StoreModule } from "@ngrx/store";
+import { provideStoreDevtools } from "@ngrx/store-devtools";
+import { RampEffects, rampReducer } from "@ramp/stores/ramp-store";
+import { FeaturesRampReactionClassesFromAnalytesComponent } from './features-ramp-reaction-classes-from-analytes.component';
+
+describe('FeaturesRampReactionClassesFromAnalytesComponent', () => {
+  let component: FeaturesRampReactionClassesFromAnalytesComponent;
+  let fixture: ComponentFixture<FeaturesRampReactionClassesFromAnalytesComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [
+        BrowserAnimationsModule,
+        FeaturesRampReactionClassesFromAnalytesComponent,
+        StoreModule
+      ],
+      providers: [
+        provideStore({
+          rampStore: rampReducer
+        }),
+        provideEffects([RampEffects]),
+        provideStoreDevtools({ maxAge: 25, logOnly: false }),
+      ],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(
+      FeaturesRampReactionClassesFromAnalytesComponent,
+    );
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

libs/features/ramp/reaction-classes-from-analytes/src/lib/features-ramp-reaction-classes-from-analytes/features-ramp-reaction-classes-from-analytes.component.ts

@@ -0,0 +1,34 @@
+import { ChangeDetectorRef, Component, OnInit } from "@angular/core";
+import { CommonModule, TitleCasePipe } from "@angular/common";
+import { InputRowComponent } from "@ramp/shared/ramp/input-row";
+import { PageCoreComponent } from "@ramp/shared/ramp/page-core";
+import { QueryPageComponent } from "@ramp/shared/ramp/query-page";
+import { DescriptionComponent } from "@ramp/shared/ui/description-panel";
+import { FeedbackPanelComponent } from "@ramp/shared/ui/feedback-panel";
+
+@Component({
+  selector: 'lib-features-ramp-reaction-classes-from-analytes',
+  standalone: true,
+  imports: [
+    CommonModule,
+    DescriptionComponent,
+    InputRowComponent,
+    FeedbackPanelComponent,
+    QueryPageComponent,
+    TitleCasePipe,
+  ],
+  templateUrl: './features-ramp-reaction-classes-from-analytes.component.html',
+  styleUrl: './features-ramp-reaction-classes-from-analytes.component.scss',
+})
+export class FeaturesRampReactionClassesFromAnalytesComponent
+  extends PageCoreComponent
+  implements OnInit {
+
+  constructor(private ref: ChangeDetectorRef) {
+    super();
+  }
+
+  ngOnInit() {
+  }
+
+}

libs/features/ramp/reaction-classes-from-analytes/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/features/ramp/reaction-classes-from-analytes/tsconfig.json

@@ -0,0 +1,29 @@
+{
+  "compilerOptions": {
+    "target": "es2022",
+    "useDefineForClassFields": false,
+    "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/features/ramp/reaction-classes-from-analytes/tsconfig.lib.json

@@ -0,0 +1,17 @@
+{
+  "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/features/ramp/reaction-classes-from-analytes/tsconfig.spec.json

@@ -0,0 +1,16 @@
+{
+  "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"
+  ]
+}