From 8198cc55d2a67d019c7cd652f6171f9a417ad52c Mon Sep 17 00:00:00 2001 From: Sebastian Date: Sun, 23 Aug 2020 18:39:19 +0200 Subject: [PATCH] Angular fix. --- frontend/app-config/webpack.config.js | 6 ++-- frontend/app/app.routes.ts | 2 +- .../framework/angular/pipes/markdown.pipe.ts | 2 +- .../angular/routers/router-2-state.ts | 8 ++--- .../framework/angular/stateful.component.ts | 5 +++- frontend/app/framework/module.ts | 2 +- .../components/help/help-markdown.pipe.ts | 2 +- frontend/app/shared/components/pipes.ts | 4 ++- frontend/app/shared/module.ts | 2 +- frontend/package-lock.json | 29 ++++++++++++++++--- frontend/package.json | 5 ++-- 11 files changed, 48 insertions(+), 19 deletions(-) diff --git a/frontend/app-config/webpack.config.js b/frontend/app-config/webpack.config.js index 609ef0da8..e389e9e7f 100644 --- a/frontend/app-config/webpack.config.js +++ b/frontend/app-config/webpack.config.js @@ -157,7 +157,7 @@ module.exports = function (env) { }, { loader: 'sass-loader', options: { - prependData: ` + additionalData: ` @import '_vars'; @import '_mixins'; `, @@ -178,7 +178,9 @@ module.exports = function (env) { * * See: https://github.com/webpack-contrib/mini-css-extract-plugin */ - new plugins.MiniCssExtractPlugin('[name].css'), + new plugins.MiniCssExtractPlugin({ + filename: '[name].css' + }), new webpack.LoaderOptionsPlugin({ options: { diff --git a/frontend/app/app.routes.ts b/frontend/app/app.routes.ts index fb214fa90..e8ed6b9e2 100644 --- a/frontend/app/app.routes.ts +++ b/frontend/app/app.routes.ts @@ -86,4 +86,4 @@ export const routes: Routes = [ } ]; -export const routing: ModuleWithProviders = RouterModule.forRoot(routes, { useHash: false }); \ No newline at end of file +export const routing: ModuleWithProviders = RouterModule.forRoot(routes, { useHash: false }); \ No newline at end of file diff --git a/frontend/app/framework/angular/pipes/markdown.pipe.ts b/frontend/app/framework/angular/pipes/markdown.pipe.ts index 48bd48df5..58a2e2d7d 100644 --- a/frontend/app/framework/angular/pipes/markdown.pipe.ts +++ b/frontend/app/framework/angular/pipes/markdown.pipe.ts @@ -11,7 +11,7 @@ import marked from 'marked'; const renderer = new marked.Renderer(); renderer.link = (href, _, text) => { - if (href.startsWith('mailto')) { + if (href && href.startsWith('mailto')) { return text; } else { return `${text} `; diff --git a/frontend/app/framework/angular/routers/router-2-state.ts b/frontend/app/framework/angular/routers/router-2-state.ts index 1372d6126..4b5abf78e 100644 --- a/frontend/app/framework/angular/routers/router-2-state.ts +++ b/frontend/app/framework/angular/routers/router-2-state.ts @@ -150,18 +150,18 @@ export class Router2State implements OnDestroy, StateSynchronizer { } public ngOnDestroy() { - this.mapper?.ngOnDestroy(); + this.mapper?.destroy(); } public mapTo(state: State) { - this.mapper?.ngOnDestroy(); + this.mapper?.destroy(); this.mapper = this.mapper || new Router2StateMap(state, this.route, this.router, this.localStore); return this.mapper; } } -export class Router2StateMap implements OnDestroy, StateSynchronizerMap { +export class Router2StateMap implements StateSynchronizerMap { private readonly syncs: { [field: string]: { synchronizer: RouteSynchronizer, value: any } } = {}; private readonly keysToKeep: string[] = []; private syncDone: (() => void)[] = []; @@ -187,7 +187,7 @@ export class Router2StateMap implements OnDestroy, StateSynchr .subscribe(s => this.syncToRoute(s)); } - public ngOnDestroy() { + public destroy() { this.syncDone = []; this.subscriptionQueryParams?.unsubscribe(); diff --git a/frontend/app/framework/angular/stateful.component.ts b/frontend/app/framework/angular/stateful.component.ts index 390888ada..5e5410740 100644 --- a/frontend/app/framework/angular/stateful.component.ts +++ b/frontend/app/framework/angular/stateful.component.ts @@ -6,8 +6,9 @@ */ // tslint:disable: readonly-array +// tslint:disable: directive-class-suffix -import { ChangeDetectorRef, OnDestroy } from '@angular/core'; +import { ChangeDetectorRef, Directive, OnDestroy } from '@angular/core'; import { ControlValueAccessor } from '@angular/forms'; import { Observable, Subscription } from 'rxjs'; import { onErrorResumeNext, skip } from 'rxjs/operators'; @@ -16,6 +17,7 @@ import { Types } from './../utils/types'; declare type UnsubscribeFunction = () => void; +@Directive() export class ResourceOwner implements OnDestroy { private subscriptions: (Subscription | UnsubscribeFunction)[] = []; @@ -50,6 +52,7 @@ export class ResourceOwner implements OnDestroy { } } +@Directive() export abstract class StatefulComponent extends State implements OnDestroy { private readonly subscriptions = new ResourceOwner(); private readonly subscription: Subscription; diff --git a/frontend/app/framework/module.ts b/frontend/app/framework/module.ts index c8472722d..c79355aed 100644 --- a/frontend/app/framework/module.ts +++ b/frontend/app/framework/module.ts @@ -178,7 +178,7 @@ import { AnalyticsService, AutocompleteComponent, AvatarComponent, CachingInterc ] }) export class SqxFrameworkModule { - public static forRoot(): ModuleWithProviders { + public static forRoot(): ModuleWithProviders { return { ngModule: SqxFrameworkModule, providers: [ diff --git a/frontend/app/shared/components/help/help-markdown.pipe.ts b/frontend/app/shared/components/help/help-markdown.pipe.ts index 192c0479e..c93d53247 100644 --- a/frontend/app/shared/components/help/help-markdown.pipe.ts +++ b/frontend/app/shared/components/help/help-markdown.pipe.ts @@ -11,7 +11,7 @@ import marked from 'marked'; const renderer = new marked.Renderer(); renderer.link = (href, _, text) => { - if (!href.startsWith('http')) { + if (href && !href.startsWith('http')) { href = `https://docs.squidex.io/${href}`; } diff --git a/frontend/app/shared/components/pipes.ts b/frontend/app/shared/components/pipes.ts index defc7ed50..48c2baf00 100644 --- a/frontend/app/shared/components/pipes.ts +++ b/frontend/app/shared/components/pipes.ts @@ -6,12 +6,14 @@ */ // tslint:disable: no-pipe-impure +// tslint:disable: directive-class-suffix -import { ChangeDetectorRef, OnDestroy, Pipe, PipeTransform } from '@angular/core'; +import { ChangeDetectorRef, Directive, OnDestroy, Pipe, PipeTransform } from '@angular/core'; import { ApiUrlConfig, UserDto, UsersProviderService } from '@app/shared/internal'; import { Observable, of, Subscription } from 'rxjs'; import { map } from 'rxjs/operators'; +@Directive() class UserAsyncPipe implements OnDestroy { private lastUserId: string; private lastValue: string | undefined = undefined; diff --git a/frontend/app/shared/module.ts b/frontend/app/shared/module.ts index e9b5d9f80..39bc44ab1 100644 --- a/frontend/app/shared/module.ts +++ b/frontend/app/shared/module.ts @@ -119,7 +119,7 @@ import { SearchService } from './services/search.service'; ] }) export class SqxSharedModule { - public static forRoot(): ModuleWithProviders { + public static forRoot(): ModuleWithProviders { return { ngModule: SqxSharedModule, providers: [ diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 9962706b6..33019984c 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -1094,6 +1094,14 @@ "integrity": "sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==", "dev": true }, + "@types/codemirror": { + "version": "0.0.97", + "resolved": "https://registry.npmjs.org/@types/codemirror/-/codemirror-0.0.97.tgz", + "integrity": "sha512-n5d7o9nWhC49DjfhsxANP7naWSeTzrjXASkUDQh7626sM4zK9XP2EVcHp1IcCf/IPV6c7ORzDUDF3Bkt231VKg==", + "requires": { + "@types/tern": "*" + } + }, "@types/color-name": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/@types/color-name/-/color-name-1.1.1.tgz", @@ -1105,6 +1113,11 @@ "integrity": "sha512-F9RHpjuPSit4dCCRXgi7XcqA01DAjy9QY+v9yICoxXsjXD9cgQpyZyL2eSZnTkBGXGaQnea8waZOZTogLDB+rA==", "dev": true }, + "@types/estree": { + "version": "0.0.45", + "resolved": "https://registry.npmjs.org/@types/estree/-/estree-0.0.45.tgz", + "integrity": "sha512-jnqIUKDUqJbDIUxm0Uj7bnlMnRm1T/eZ9N+AVMqhPgzrba2GhGG5o/jCTwmdPK709nEZsGoMzXEDUjcXHa3W0g==" + }, "@types/glob": { "version": "7.1.3", "resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.1.3.tgz", @@ -1172,9 +1185,9 @@ "dev": true }, "@types/mousetrap": { - "version": "1.6.0", - "resolved": "https://registry.npmjs.org/@types/mousetrap/-/mousetrap-1.6.0.tgz", - "integrity": "sha512-Jn2cF8X6RAMiSmJaATGjf2r3GzIfpZQpvnQhKprQ5sAbMaNXc7hc9sA2XHdMl3bEMEQhTV79JVW7n4Pgg7sjtg==", + "version": "1.6.3", + "resolved": "https://registry.npmjs.org/@types/mousetrap/-/mousetrap-1.6.3.tgz", + "integrity": "sha512-13gmo3M2qVvjQrWNseqM3+cR6S2Ss3grbR2NZltgMq94wOwqJYQdgn8qzwDshzgXqMlSUtyPZjysImmktu22ew==", "dev": true }, "@types/node": { @@ -1251,6 +1264,14 @@ "integrity": "sha512-W+bw9ds02rAQaMvaLYxAbJ6cvguW/iJXNT6lTssS1ps6QdrMKttqEAMEG/b5CR8TZl3/L7/lH0ZV5nNR1LXikA==", "dev": true }, + "@types/tern": { + "version": "0.23.3", + "resolved": "https://registry.npmjs.org/@types/tern/-/tern-0.23.3.tgz", + "integrity": "sha512-imDtS4TAoTcXk0g7u4kkWqedB3E4qpjXzCpD2LU5M5NAXHzCDsypyvXSaG7mM8DKYkCRa7tFp4tS/lp/Wo7Q3w==", + "requires": { + "@types/estree": "*" + } + }, "@types/tinymce": { "version": "4.5.24", "resolved": "https://registry.npmjs.org/@types/tinymce/-/tinymce-4.5.24.tgz", @@ -14135,7 +14156,7 @@ "dependencies": { "json5": { "version": "1.0.1", - "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.1.tgz", + "resolved": "http://registry.npmjs.org/json5/-/json5-1.0.1.tgz", "integrity": "sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow==", "dev": true, "requires": { diff --git a/frontend/package.json b/frontend/package.json index 41ecf0e95..b30d9e021 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -27,9 +27,10 @@ "@angular/platform-browser-dynamic": "10.0.11", "@angular/platform-server": "10.0.11", "@angular/router": "10.0.11", + "@egjs/hammerjs": "2.0.17", "@ngx-translate/core": "13.0.0", "@ngx-translate/http-loader": "6.0.0", - "@egjs/hammerjs": "2.0.17", + "@types/codemirror": "0.0.97", "ace-builds": "1.4.12", "angular-gridster2": "10.1.4", "angular-mentions": "1.2.0", @@ -72,7 +73,7 @@ "@types/jasmine": "3.5.13", "@types/marked": "1.1.0", "@types/mersenne-twister": "1.1.2", - "@types/mousetrap": "1.6", + "@types/mousetrap": "^1.6.3", "@types/node": "14.6.0", "@types/react": "16.9.46", "@types/react-dom": "16.9.8",