diff --git a/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts b/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts index 8f98aaaabc..3581a28400 100644 --- a/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts +++ b/src/app/header/context-help-toggle/context-help-toggle.component.spec.ts @@ -1,16 +1,16 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ContextHelpToggleComponent } from './context-help-toggle.component'; -import { TranslateService, TranslateModule } from '@ngx-translate/core'; +import { TranslateModule } from '@ngx-translate/core'; import { ContextHelpService } from '../../shared/context-help.service'; -import { of as observableOf, BehaviorSubject } from 'rxjs'; +import { BehaviorSubject } from 'rxjs'; import { By } from '@angular/platform-browser'; describe('ContextHelpToggleComponent', () => { let component: ContextHelpToggleComponent; let fixture: ComponentFixture; let contextHelpService; - let contextHelpEmpty$ = new BehaviorSubject(true); + const contextHelpEmpty$ = new BehaviorSubject(true); beforeEach(async () => { contextHelpService = jasmine.createSpyObj('contextHelpService', diff --git a/src/app/shared/context-help-wrapper/context-help-wrapper.component.spec.ts b/src/app/shared/context-help-wrapper/context-help-wrapper.component.spec.ts index c0c7f9a821..081fb1050f 100644 --- a/src/app/shared/context-help-wrapper/context-help-wrapper.component.spec.ts +++ b/src/app/shared/context-help-wrapper/context-help-wrapper.component.spec.ts @@ -5,7 +5,7 @@ import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap'; import { TranslateService } from '@ngx-translate/core'; import { ContextHelpService } from '../context-help.service'; import { ContextHelp } from '../context-help.model'; -import { Component, Input, ViewChild, DebugElement } from '@angular/core'; +import { Component, Input, DebugElement } from '@angular/core'; import { PlacementArray } from '@ng-bootstrap/ng-bootstrap/util/positioning'; import { PlacementDir } from './placement-dir.model'; import { By } from '@angular/platform-browser'; @@ -53,9 +53,9 @@ describe('ContextHelpWrapperComponent', () => { let shouldShowIcons$: BehaviorSubject; function makeWrappedElement(): HTMLElement { - let el: HTMLElement = document.createElement('div') - el.innerHTML = 'example element'; - return el; + const wrapped: HTMLElement = document.createElement('div'); + wrapped.innerHTML = 'example element'; + return wrapped; } beforeEach(waitForAsync( () => { @@ -96,8 +96,8 @@ describe('ContextHelpWrapperComponent', () => { fixture = TestBed.createComponent(TemplateComponent); el = fixture.debugElement; templateComponent = fixture.componentInstance; - templateComponent.content = 'lorem' - templateComponent.id = 'test-tooltip' + templateComponent.content = 'lorem'; + templateComponent.id = 'test-tooltip'; templateComponent.tooltipPlacement = ['bottom']; templateComponent.iconPlacement = 'left'; wrapperComponent = el.query(By.css('ds-context-help-wrapper')).componentInstance; @@ -111,7 +111,7 @@ describe('ContextHelpWrapperComponent', () => { it('should not show the context help icon while icon visibility is not turned on', (done) => { fixture.whenStable().then(() => { - let wrapper = el.query(By.css('ds-context-help-wrapper')).nativeElement; + const wrapper = el.query(By.css('ds-context-help-wrapper')).nativeElement; expect(wrapper.children.length).toBe(0); done(); }); @@ -127,9 +127,9 @@ describe('ContextHelpWrapperComponent', () => { it('should show the context help button', (done) => { fixture.whenStable().then(() => { - let wrapper = el.query(By.css('ds-context-help-wrapper')).nativeElement; + const wrapper = el.query(By.css('ds-context-help-wrapper')).nativeElement; expect(wrapper.children.length).toBe(1); - let [i] = wrapper.children; + const [i] = wrapper.children; expect(i.tagName).toBe('I'); done(); }); @@ -160,7 +160,7 @@ describe('ContextHelpWrapperComponent', () => { const nodeList: NodeList = fixture.debugElement.query(By.css('.ds-context-help-content')) .nativeElement .childNodes; - const relevantNodes = Array.from(nodeList).filter(node => node.nodeType != Node.COMMENT_NODE); + const relevantNodes = Array.from(nodeList).filter(node => node.nodeType !== Node.COMMENT_NODE); expect(relevantNodes.length).toBe(4); const [text1, link1, text2, link2] = relevantNodes; @@ -190,7 +190,7 @@ describe('ContextHelpWrapperComponent', () => { const nodeList: NodeList = fixture.debugElement.query(By.css('.ds-context-help-content')) .nativeElement .childNodes; - const relevantNodes = Array.from(nodeList).filter(node => node.nodeType != Node.COMMENT_NODE); + const relevantNodes = Array.from(nodeList).filter(node => node.nodeType !== Node.COMMENT_NODE); expect(relevantNodes.length).toBe(1); const [text] = relevantNodes; diff --git a/src/app/shared/context-help-wrapper/context-help-wrapper.component.ts b/src/app/shared/context-help-wrapper/context-help-wrapper.component.ts index 1bf3dc1ce0..c5bb40cf1b 100644 --- a/src/app/shared/context-help-wrapper/context-help-wrapper.component.ts +++ b/src/app/shared/context-help-wrapper/context-help-wrapper.component.ts @@ -1,10 +1,9 @@ -import { Component, Input, OnInit, TemplateRef, OnDestroy, AfterViewInit, ViewChild } from '@angular/core'; +import { Component, Input, OnInit, TemplateRef, OnDestroy, ViewChild } from '@angular/core'; import { PlacementArray } from '@ng-bootstrap/ng-bootstrap/util/positioning'; import { TranslateService } from '@ngx-translate/core'; -import { Observable, of as observableOf, Subscription, BehaviorSubject, combineLatest } from 'rxjs'; +import { Observable, Subscription, BehaviorSubject, combineLatest } from 'rxjs'; import { map, distinctUntilChanged, mergeMap } from 'rxjs/operators'; import { PlacementDir } from './placement-dir.model'; -import content from '*.scss'; import { ContextHelpService } from '../context-help.service'; import { NgbTooltip } from '@ng-bootstrap/ng-bootstrap'; import { hasValueOperator } from '../empty.util'; @@ -55,8 +54,8 @@ export class ContextHelpWrapperComponent implements OnInit, OnDestroy { tooltip: NgbTooltip; - @Input() set content(content : string) { - this.content$.next(content); + @Input() set content(translateKey: string) { + this.content$.next(translateKey); } private content$: BehaviorSubject = new BehaviorSubject(undefined); @@ -72,11 +71,11 @@ export class ContextHelpWrapperComponent implements OnInit, OnDestroy { ngOnInit() { this.parsedContent$ = combineLatest([ - this.content$.pipe(distinctUntilChanged(), mergeMap(content => this.translateService.get(content))), + this.content$.pipe(distinctUntilChanged(), mergeMap(translateKey => this.translateService.get(translateKey))), this.dontParseLinks$.pipe(distinctUntilChanged()) ]).pipe( - map(([content, dontParseLinks]) => - dontParseLinks ? [content] : this.parseLinks(content)) + map(([text, dontParseLinks]) => + dontParseLinks ? [text] : this.parseLinks(text)) ); this.shouldShowIcon$ = this.contextHelpService.shouldShowIcons$(); this.subs.always = [this.parsedContent$.subscribe(), this.shouldShowIcon$.subscribe()]; @@ -136,7 +135,7 @@ export class ContextHelpWrapperComponent implements OnInit, OnDestroy { * {href: "https://youtube.com", text: "so is this"} * ] */ - private parseLinks(content: string): ParsedContent { + private parseLinks(text: string): ParsedContent { // Implementation note: due to `matchAll` method on strings not being available for all versions, // separate "split" and "parse" steps are needed. @@ -152,7 +151,7 @@ export class ContextHelpWrapperComponent implements OnInit, OnDestroy { // {href: string, text: string} objects. const parseRegexp = /^\[([^\]]*)\]\(([^\)]*)\)$/; - return content.match(splitRegexp).map((substring: string) => { + return text.match(splitRegexp).map((substring: string) => { const match = substring.match(parseRegexp); return match === null ? substring diff --git a/src/app/shared/context-help.actions.ts b/src/app/shared/context-help.actions.ts index 5f985c2f73..a4892758ff 100644 --- a/src/app/shared/context-help.actions.ts +++ b/src/app/shared/context-help.actions.ts @@ -1,3 +1,5 @@ +/* eslint-disable max-classes-per-file */ + import { Action } from '@ngrx/store'; import { type } from './ngrx/type'; import { ContextHelp } from './context-help.model'; diff --git a/src/app/shared/context-help.directive.spec.ts b/src/app/shared/context-help.directive.spec.ts index 70e27b658c..326251da51 100644 --- a/src/app/shared/context-help.directive.spec.ts +++ b/src/app/shared/context-help.directive.spec.ts @@ -1,14 +1,12 @@ -import { Component, DebugElement, Input } from '@angular/core'; -import { ComponentFixture, TestBed, getTestBed, waitForAsync } from '@angular/core/testing'; -import { of as observableOf, Observable, BehaviorSubject } from 'rxjs'; +import { Component, Input } from '@angular/core'; +import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing'; +import { of as observableOf, BehaviorSubject } from 'rxjs'; import { ContextHelpDirective, ContextHelpDirectiveInput } from './context-help.directive'; import { TranslateService } from '@ngx-translate/core'; import { ContextHelpWrapperComponent } from './context-help-wrapper/context-help-wrapper.component'; import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap'; import { ContextHelpService } from './context-help.service'; import { ContextHelp } from './context-help.model'; -import { before } from 'lodash'; -import { By } from '@angular/platform-browser'; @Component({ template: `
some text
` @@ -62,7 +60,7 @@ describe('ContextHelpDirective', () => { { provide: ContextHelpService, useValue: contextHelpService } ], declarations: [TestComponent, ContextHelpWrapperComponent, ContextHelpDirective] - }).compileComponents() + }).compileComponents(); })); beforeEach(() => { @@ -85,10 +83,10 @@ describe('ContextHelpDirective', () => { it('should generate the context help wrapper component', (done) => { fixture.whenStable().then(() => { expect(fixture.nativeElement.children.length).toBe(1); - let [wrapper] = fixture.nativeElement.children; + const [wrapper] = fixture.nativeElement.children; expect(component).toBeDefined(); expect(wrapper.tagName).toBe('DS-CONTEXT-HELP-WRAPPER'); - expect(contextHelpService.add).toHaveBeenCalledWith(exampleContextHelp) + expect(contextHelpService.add).toHaveBeenCalledWith(exampleContextHelp); done(); }); }); diff --git a/src/app/shared/context-help.directive.ts b/src/app/shared/context-help.directive.ts index 83c3908dcf..41d6daec21 100644 --- a/src/app/shared/context-help.directive.ts +++ b/src/app/shared/context-help.directive.ts @@ -2,10 +2,8 @@ import { ComponentFactoryResolver, ComponentRef, Directive, - ElementRef, Input, OnChanges, - OnInit, TemplateRef, ViewContainerRef, OnDestroy @@ -47,7 +45,7 @@ export class ContextHelpDirective implements OnChanges, OnDestroy { private viewContainerRef: ViewContainerRef, private componentFactoryResolver: ComponentFactoryResolver, private contextHelpService: ContextHelpService - ){} + ) {} ngOnChanges() { this.clearMostRecentId(); diff --git a/src/app/shared/context-help.model.ts b/src/app/shared/context-help.model.ts index 9c024dbf1f..ea6fd036cf 100644 --- a/src/app/shared/context-help.model.ts +++ b/src/app/shared/context-help.model.ts @@ -1,4 +1,4 @@ export class ContextHelp { id: string; - isTooltipVisible?: boolean = false; + isTooltipVisible = false; } diff --git a/src/app/shared/context-help.reducer.ts b/src/app/shared/context-help.reducer.ts index 13e9488dfd..3e0d40c25d 100644 --- a/src/app/shared/context-help.reducer.ts +++ b/src/app/shared/context-help.reducer.ts @@ -1,9 +1,9 @@ import { ContextHelp } from './context-help.model'; import { ContextHelpAction, ContextHelpActionTypes } from './context-help.actions'; -export type ContextHelpModels = { +export interface ContextHelpModels { [id: string]: ContextHelp; -}; +} export interface ContextHelpState { allIconsVisible: boolean; @@ -40,8 +40,7 @@ export function contextHelpReducer(state: ContextHelpState = initialState, actio } } -function modifyTooltipVisibility(state: ContextHelpState, id: string, modify: (vis: boolean) => boolean) - : ContextHelpState { +function modifyTooltipVisibility(state: ContextHelpState, id: string, modify: (vis: boolean) => boolean): ContextHelpState { const {[id]: matchingModel, ...otherModels} = state.models; const modifiedModel = {...matchingModel, isTooltipVisible: modify(matchingModel.isTooltipVisible)}; const newModels = {...otherModels, [id]: modifiedModel}; diff --git a/src/app/shared/context-help.service.spec.ts b/src/app/shared/context-help.service.spec.ts index 96b81ee8e1..f06e700210 100644 --- a/src/app/shared/context-help.service.spec.ts +++ b/src/app/shared/context-help.service.spec.ts @@ -8,10 +8,9 @@ import { TestScheduler } from 'rxjs/testing'; describe('ContextHelpService', () => { let service: ContextHelpService; let store; - let initialState; let testScheduler; const booleans = { f: false, t: true }; - const mkContextHelp = (id: string) => ({ 0: {id, isTooltipVisible: false}, 1: {id, isTooltipVisible: true} }) + const mkContextHelp = (id: string) => ({ 0: {id, isTooltipVisible: false}, 1: {id, isTooltipVisible: true} }); beforeEach(async () => { TestBed.configureTestingModule({ @@ -42,11 +41,13 @@ describe('ContextHelpService', () => { it('add and remove calls should be observable in getContextHelp$', () => { testScheduler.run(({cold, expectObservable}) => { const modifications = cold('-abAcCB', { - a: () => service.add({id: 'a'}), b: () => service.add({id: 'b'}), c: () => service.add({id: 'c'}), + a: () => service.add({id: 'a', isTooltipVisible: false}), + b: () => service.add({id: 'b', isTooltipVisible: false}), + c: () => service.add({id: 'c', isTooltipVisible: false}), A: () => service.remove('a'), B: () => service.remove('b'), C: () => service.remove('c'), - }) + }); modifications.subscribe(mod => mod()); - const match = (id) => ({ 0: undefined, 1: {id} }); + const match = (id) => ({ 0: undefined, 1: {id, isTooltipVisible: false} }); expectObservable(service.getContextHelp$('a')).toBe('01-0---', match('a')); expectObservable(service.getContextHelp$('b')).toBe('0-1---0', match('b')); expectObservable(service.getContextHelp$('c')).toBe('0---10-', match('c'));