Skip to content

Commit bd41e69

Browse files
authored
feat(agora): migration About and related components (AG-1545) (#2837)
1 parent 5632759 commit bd41e69

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

67 files changed

+1590
-160
lines changed

apps/agora/app/src/app/app.routes.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
import { Route } from '@angular/router';
22

33
export const routes: Route[] = [
4+
{
5+
path: 'about',
6+
loadChildren: () => import('@sagebionetworks/agora/about').then((routes) => routes.routes),
7+
},
48
{
59
path: 'not-found',
610
loadChildren: () => import('@sagebionetworks/agora/not-found').then((routes) => routes.routes),

apps/agora/app/src/test-setup.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,9 @@
11
// @ts-expect-error https://thymikee.github.io/jest-preset-angular/docs/getting-started/test-environment
2-
import 'jest-preset-angular/setup-jest';
32
globalThis.ngJest = {
43
testEnvironmentOptions: {
54
errorOnUnknownElements: true,
65
errorOnUnknownProperties: true,
76
},
87
};
8+
9+
import 'jest-preset-angular/setup-jest';

jest.config.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
const { getJestProjects } = require('@nx/jest');
1+
import { getJestProjectsAsync } from '@nx/jest';
22

3-
export default {
4-
projects: getJestProjects(),
5-
};
3+
export default async () => ({
4+
projects: await getJestProjectsAsync(),
5+
});

libs/agora/about/.eslintrc.json

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
{
2+
"extends": ["../../../.eslintrc.json"],
3+
"ignorePatterns": ["!**/*"],
4+
"env": {
5+
"jest": true
6+
},
7+
"overrides": [
8+
{
9+
"files": ["*.ts"],
10+
"extends": [
11+
"plugin:@nx/angular",
12+
"plugin:@angular-eslint/template/process-inline-templates",
13+
"plugin:jest/recommended"
14+
],
15+
"rules": {
16+
"@angular-eslint/directive-selector": [
17+
"error",
18+
{
19+
"type": "attribute",
20+
"prefix": "agora",
21+
"style": "camelCase"
22+
}
23+
],
24+
"@angular-eslint/component-selector": [
25+
"error",
26+
{
27+
"type": "element",
28+
"prefix": "agora",
29+
"style": "kebab-case"
30+
}
31+
]
32+
}
33+
},
34+
{
35+
"files": ["*.html"],
36+
"extends": ["plugin:@nx/angular-template"],
37+
"rules": {}
38+
}
39+
]
40+
}

libs/agora/about/.hintrc

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": ["../../../.hintrc"]
3+
}

libs/agora/about/README.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
# agora-about
2+
3+
This library was generated with [Nx](https://nx.dev).
4+
5+
## Running unit tests
6+
7+
Run `nx test agora-about` to execute the unit tests.

libs/agora/about/jest.config.ts

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
/* eslint-disable */
2+
export default {
3+
displayName: 'agora-about',
4+
preset: '../../../jest.preset.js',
5+
setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
6+
globals: {},
7+
coverageDirectory: '../../../coverage/libs/agora/about',
8+
transform: {
9+
'^.+\\.(ts|mjs|js|html)$': [
10+
'jest-preset-angular',
11+
{
12+
tsconfig: '<rootDir>/tsconfig.spec.json',
13+
stringifyContentPathRegex: '\\.(html|svg)$',
14+
},
15+
],
16+
},
17+
transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
18+
snapshotSerializers: [
19+
'jest-preset-angular/build/serializers/no-ng-attributes',
20+
'jest-preset-angular/build/serializers/ng-snapshot',
21+
'jest-preset-angular/build/serializers/html-comment',
22+
],
23+
};

libs/agora/about/project.json

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{
2+
"name": "agora-about",
3+
"$schema": "../../../node_modules/nx/schemas/project-schema.json",
4+
"projectType": "library",
5+
"sourceRoot": "libs/agora/about/src",
6+
"prefix": "agora",
7+
"targets": {
8+
"test": {
9+
"executor": "@nx/jest:jest",
10+
"outputs": ["{workspaceRoot}/coverage/libs/agora/about"],
11+
"options": {
12+
"jestConfig": "libs/agora/about/jest.config.ts"
13+
}
14+
},
15+
"lint": {
16+
"executor": "@nx/eslint:lint"
17+
},
18+
"lint-fix": {
19+
"executor": "@nx/eslint:lint",
20+
"options": {
21+
"fix": true
22+
}
23+
},
24+
"lint-html": {
25+
"executor": "nx:run-commands",
26+
"options": {
27+
"commands": ["hint src/**/*.html"],
28+
"cwd": "libs/agora/about",
29+
"parallel": false
30+
}
31+
}
32+
},
33+
"tags": ["type:feature", "scope:agora", "language:typescript"],
34+
"implicitDependencies": []
35+
}

libs/agora/about/src/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export * from './lib/about.routes';
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<div class="section section-hero">
2+
<div class="section-inner">
3+
<div class="container-sm">
4+
<h1 class="h2">About</h1>
5+
</div>
6+
</div>
7+
</div>
8+
9+
<div class="section">
10+
<div class="section-inner">
11+
<div class="container-sm">
12+
<agora-wiki [wikiId]="wikiId" [className]="className"></agora-wiki>
13+
</div>
14+
</div>
15+
</div>

libs/agora/about/src/lib/about.component.scss

Whitespace-only changes.
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import { AboutComponent } from './about.component';
2+
3+
describe('AboutComponent', () => {
4+
let component: AboutComponent;
5+
6+
beforeEach(() => {
7+
component = new AboutComponent();
8+
});
9+
10+
it('should create', () => {
11+
expect(component).toBeTruthy();
12+
});
13+
});
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { CommonModule } from '@angular/common';
2+
import { Component } from '@angular/core';
3+
import { WikiComponent } from 'libs/agora/wiki/src/lib/wiki.component';
4+
5+
@Component({
6+
selector: 'agora-about',
7+
standalone: true,
8+
imports: [CommonModule, WikiComponent],
9+
templateUrl: './about.component.html',
10+
styleUrls: ['./about.component.scss'],
11+
})
12+
export class AboutComponent {
13+
wikiId = '612058';
14+
className = 'about-page-content';
15+
}
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
import { Routes } from '@angular/router';
2+
import { AboutComponent } from './about.component';
3+
4+
export const routes: Routes = [{ path: '', component: AboutComponent }];

libs/agora/about/src/test-setup.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
import 'jest-preset-angular/setup-jest';

libs/agora/about/tsconfig.json

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
{
2+
"extends": "../../../tsconfig.base.json",
3+
"files": [],
4+
"include": [],
5+
"references": [
6+
{
7+
"path": "./tsconfig.lib.json"
8+
},
9+
{
10+
"path": "./tsconfig.spec.json"
11+
}
12+
],
13+
"compilerOptions": {
14+
"forceConsistentCasingInFileNames": true,
15+
"strict": true,
16+
"noImplicitOverride": true,
17+
"noPropertyAccessFromIndexSignature": true,
18+
"noImplicitReturns": true,
19+
"noFallthroughCasesInSwitch": true,
20+
"target": "es2020",
21+
"esModuleInterop": true
22+
},
23+
"angularCompilerOptions": {
24+
"strictInjectionParameters": true,
25+
"strictInputAccessModifiers": true,
26+
"strictTemplates": true
27+
}
28+
}

libs/agora/about/tsconfig.lib.json

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"extends": "./tsconfig.json",
3+
"compilerOptions": {
4+
"outDir": "../../../dist/out-tsc",
5+
"declaration": true,
6+
"declarationMap": true,
7+
"inlineSources": true,
8+
"types": []
9+
},
10+
"exclude": ["src/test-setup.ts", "**/*.spec.ts", "**/*.test.ts", "jest.config.ts"],
11+
"include": ["**/*.ts"]
12+
}

libs/agora/about/tsconfig.spec.json

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"extends": "./tsconfig.json",
3+
"compilerOptions": {
4+
"outDir": "../../../dist/out-tsc",
5+
"module": "commonjs",
6+
"types": ["jest", "node"]
7+
},
8+
"files": ["src/test-setup.ts"],
9+
"include": ["**/*.test.ts", "**/*.spec.ts", "**/*.d.ts", "jest.config.ts"]
10+
}

libs/agora/services/tsconfig.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@
1717
"noPropertyAccessFromIndexSignature": true,
1818
"noImplicitReturns": true,
1919
"noFallthroughCasesInSwitch": true,
20+
"target": "es2020",
2021
"esModuleInterop": true
2122
},
2223
"angularCompilerOptions": {

libs/agora/styles/src/_index.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,4 @@
22

33
@use './lib/constants';
44
@use './lib/general';
5+
@use './lib/variables';
Lines changed: 103 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,103 @@
1+
@use 'sass:map';
2+
@use 'sass:meta';
3+
4+
@import 'variables';
5+
6+
@mixin reset-button() {
7+
border: none;
8+
margin: 0;
9+
padding: 0;
10+
width: auto;
11+
overflow: visible;
12+
background: transparent;
13+
color: inherit;
14+
font: inherit;
15+
line-height: normal;
16+
appearance: none;
17+
18+
&::-moz-focus-inner {
19+
border: 0;
20+
padding: 0;
21+
}
22+
}
23+
24+
@mixin reset-ul() {
25+
list-style: none;
26+
padding: 0;
27+
margin: 0;
28+
}
29+
30+
@mixin container($width: 'md') {
31+
max-width: var(--container-max-width-#{$width});
32+
padding-left: 0;
33+
padding-right: 0;
34+
margin-left: auto;
35+
margin-right: auto;
36+
}
37+
38+
/**
39+
* Responsive breakpoint manager
40+
* S. https://sass-guidelin.es/#architecture
41+
*/
42+
@mixin respond-to($breakpoint) {
43+
$raw-query: map.get($breakpoints, $breakpoint);
44+
45+
@if $raw-query {
46+
$query: if(
47+
meta.type-of($raw-query) == 'string',
48+
string.unquote($raw-query),
49+
meta.inspect($raw-query)
50+
);
51+
52+
@media #{$query} {
53+
@content;
54+
}
55+
} @else {
56+
@error 'No value found for `#{$breakpoint}`. '
57+
+ 'Please make sure it is defined in `$breakpoints` map.';
58+
}
59+
}
60+
61+
@mixin link-hover {
62+
color: var(--color-link);
63+
text-decoration: underline;
64+
}
65+
66+
@mixin link {
67+
color: var(--color-link);
68+
cursor: pointer;
69+
text-decoration: none;
70+
71+
&:hover {
72+
@include link-hover;
73+
}
74+
}
75+
76+
@mixin two-tone-icon-hover {
77+
.svg-icon-bg {
78+
fill: rgb(var(--color-action-primary-rgb) / 30%);
79+
}
80+
81+
circle,
82+
rect,
83+
path {
84+
&:not(.svg-icon-bg) {
85+
fill: var(--color-action-primary);
86+
}
87+
}
88+
}
89+
90+
@mixin two-tone-icon {
91+
color: var(--color-gray-600);
92+
transition: $transition-duration;
93+
94+
circle,
95+
rect,
96+
path {
97+
transition: $transition-duration;
98+
}
99+
100+
&:hover {
101+
@include two-tone-icon-hover;
102+
}
103+
}

0 commit comments

Comments
 (0)