-
Notifications
You must be signed in to change notification settings - Fork 8
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: help remote component init (#46)
* feat: show help component is working in help-ui * feat: show help component adjusted * feat: show help appId proper fetching and inputs removal * feat: component update * fix: commented out component tests * refactor: renamed exposed showHelp component * fix: updated onecx libs
- Loading branch information
Showing
18 changed files
with
5,228 additions
and
3,585 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
9 changes: 9 additions & 0 deletions
9
src/app/remotes/components/no-help-item/no-help-item.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,9 @@ | ||
| <div> | ||
| <div class="dialog-content"> | ||
| <span id="no-help-item-content">{{ 'SHOW_HELP.NO_HELP_ITEM.CONTENT' | translate }}</span> | ||
| <div *ngIf="helpArticleId"> | ||
| <span id="no-help-item-hint"> {{ 'SHOW_HELP.NO_HELP_ITEM.ITEM_HINT' | translate }}</span> | ||
| <span id="no-help-item-hint-article-id" class="code p-my-2">{{ helpArticleId }}</span> | ||
| </div> | ||
| </div> | ||
| </div> |
8 changes: 8 additions & 0 deletions
8
src/app/remotes/components/no-help-item/no-help-item.component.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,8 @@ | ||
| .code { | ||
| display: block; | ||
| clear: both; | ||
| padding: 0.5em; | ||
| font-family: monospace; | ||
| background-color: #ececec; | ||
| border-radius: 4px; | ||
| } |
74 changes: 74 additions & 0 deletions
74
src/app/remotes/components/no-help-item/no-help-item.component.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,74 @@ | ||
| // import { ComponentFixture, TestBed, getTestBed } from '@angular/core/testing' | ||
| // import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed' | ||
| // import { DynamicDialogConfig, DynamicDialogRef } from 'primeng/dynamicdialog' | ||
| // import { TranslateTestingModule } from 'ngx-translate-testing' | ||
|
|
||
| // import { NoHelpItemComponent } from './no-help-item.component' | ||
| // import { NoHelpItemHarness } from '../../harnesses/no-help-item.harness' | ||
|
|
||
| // describe('NoHelpItemComponent', () => { | ||
| // let component: NoHelpItemComponent | ||
| // let fixture: ComponentFixture<NoHelpItemComponent> | ||
| // let noHelpItemHarness: NoHelpItemHarness | ||
|
|
||
| // beforeEach(async () => { | ||
| // await TestBed.configureTestingModule({ | ||
| // declarations: [], | ||
| // imports: [ | ||
| // NoHelpItemComponent, | ||
| // TranslateTestingModule.withTranslations({ | ||
| // en: require('../../../../assets/i18n/en.json'), | ||
| // de: require('../../../../assets/i18n/de.json') | ||
| // }) | ||
| // ], | ||
| // providers: [DynamicDialogConfig, DynamicDialogRef] | ||
| // }).compileComponents() | ||
|
|
||
| // getTestBed().inject(DynamicDialogConfig).data = { helpArticleId: 'help-article-id' } | ||
|
|
||
| // fixture = TestBed.createComponent(NoHelpItemComponent) | ||
| // component = fixture.componentInstance | ||
|
|
||
| // fixture.detectChanges() | ||
|
|
||
| // noHelpItemHarness = await TestbedHarnessEnvironment.harnessForFixture(fixture, NoHelpItemHarness) | ||
| // }) | ||
|
|
||
| // it('should create', () => { | ||
| // expect(component).toBeTruthy() | ||
| // }) | ||
|
|
||
| // it('should display translated content and hint from dialog config', async () => { | ||
| // getTestBed().inject(DynamicDialogConfig).data = { helpArticleId: 'help-article-id' } | ||
|
|
||
| // fixture = TestBed.createComponent(NoHelpItemComponent) | ||
| // component = fixture.componentInstance | ||
|
|
||
| // fixture.detectChanges() | ||
|
|
||
| // noHelpItemHarness = await TestbedHarnessEnvironment.harnessForFixture(fixture, NoHelpItemHarness) | ||
|
|
||
| // expect(await noHelpItemHarness.getContent()).toBe( | ||
| // 'No help items were found for this page. Please ask your system administrator to add it.' | ||
| // ) | ||
| // expect(await noHelpItemHarness.getHintTitle()).toBe('The help Item ID for this page is:') | ||
| // expect(await noHelpItemHarness.getArticleId()).toBe('help-article-id') | ||
| // }) | ||
|
|
||
| // it('should not display hint if helpArticleId is not defined', async () => { | ||
| // getTestBed().inject(DynamicDialogConfig).data = {} | ||
|
|
||
| // fixture = TestBed.createComponent(NoHelpItemComponent) | ||
| // component = fixture.componentInstance | ||
|
|
||
| // fixture.detectChanges() | ||
|
|
||
| // noHelpItemHarness = await TestbedHarnessEnvironment.harnessForFixture(fixture, NoHelpItemHarness) | ||
|
|
||
| // expect(await noHelpItemHarness.getContent()).toBe( | ||
| // 'No help items were found for this page. Please ask your system administrator to add it.' | ||
| // ) | ||
| // expect(await noHelpItemHarness.getHintTitle()).toBeUndefined() | ||
| // expect(await noHelpItemHarness.getArticleId()).toBeUndefined() | ||
| // }) | ||
| // }) |
23 changes: 23 additions & 0 deletions
23
src/app/remotes/components/no-help-item/no-help-item.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,23 @@ | ||
| import { CommonModule } from '@angular/common' | ||
| import { Component } from '@angular/core' | ||
| import { TranslateModule } from '@ngx-translate/core' | ||
| import { DynamicDialogConfig, DynamicDialogModule, DynamicDialogRef } from 'primeng/dynamicdialog' | ||
|
|
||
| @Component({ | ||
| selector: 'app-ocx-no-help-item', | ||
| standalone: true, | ||
| templateUrl: './no-help-item.component.html', | ||
| styleUrls: ['./no-help-item.component.scss'], | ||
| imports: [CommonModule, DynamicDialogModule, TranslateModule] | ||
| }) | ||
| export class NoHelpItemComponent { | ||
| public helpArticleId: string | ||
|
|
||
| constructor(public config: DynamicDialogConfig, public ref: DynamicDialogRef) { | ||
| this.helpArticleId = config.data.helpArticleId | ||
| } | ||
|
|
||
| close() { | ||
| this.ref.close() | ||
| } | ||
| } |
12 changes: 12 additions & 0 deletions
12
src/app/remotes/components/show-help/show-help.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,12 @@ | ||
| <ng-container *ocxIfPermission="'PORTAL_HEADER_HELP#VIEW'; permissions: permissions"> | ||
| <a | ||
| id="show-help-button" | ||
| pRipple | ||
| (click)="openHelpPage($event)" | ||
| [title]="LABEL_KEY | translate" | ||
| [pTooltip]="LABEL_KEY | translate" | ||
| tooltipPosition="bottom" | ||
| > | ||
| <i id="show-help-button-icon" class="{{ ICON }}"></i> | ||
| </a> | ||
| </ng-container> |
130 changes: 130 additions & 0 deletions
130
src/app/remotes/components/show-help/show-help.component.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,130 @@ | ||
| // import { ComponentFixture, TestBed } from '@angular/core/testing' | ||
| // import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed' | ||
| // import { importProvidersFrom } from '@angular/core' | ||
| // import { TranslateTestingModule } from 'ngx-translate-testing' | ||
| // import { PrimeIcons } from 'primeng/api' | ||
|
|
||
| // import { ShowHelpRemoteComponent } from './show-help.component' | ||
| // import { ShowHelpRemoteHarness } from '../../harnesses/show-help.harness' | ||
|
|
||
| // fdescribe('ShowHelpRemoteComponent', () => { | ||
| // let component: ShowHelpRemoteComponent | ||
| // let fixture: ComponentFixture<ShowHelpRemoteComponent> | ||
| // let showHelpRemoteHarness: ShowHelpRemoteHarness | ||
|
|
||
| // // const helpApiServiceSpy = jasmine.createSpyObj<HelpAPIService>('HelpAPIService', ['getHelpDataItem']) | ||
|
|
||
| // beforeEach(async () => { | ||
| // // await TestBed.configureTestingModule({ | ||
| // // declarations: [IfPermissionDirective], | ||
| // // imports: [ | ||
| // // CommonModule, | ||
| // // HttpClientTestingModule, | ||
| // // RippleModule, | ||
| // // TooltipModule, | ||
| // // DynamicDialogModule, | ||
| // // ShowHelpRemoteComponent, | ||
| // // NoHelpItemComponent, | ||
| // // TranslateTestingModule.withTranslations({ | ||
| // // en: require('../../../../assets/i18n/en.json'), | ||
| // // de: require('../../../../assets/i18n/de.json') | ||
| // // }), | ||
| // // PortalCoreModule | ||
| // // ], | ||
| // // providers: [{ provide: HelpAPIService, useValue: helpApiServiceSpy }, DialogService] | ||
| // // }).compileComponents() | ||
| // await TestBed.configureTestingModule({ | ||
| // declarations: [], | ||
| // // imports: [ | ||
| // // ShowHelpRemoteComponent | ||
| // // // CommonModule, | ||
| // // // HttpClientTestingModule, | ||
| // // // RippleModule, | ||
| // // // TooltipModule, | ||
| // // // DynamicDialogModule, | ||
| // // // NoHelpItemComponent, | ||
| // // // PortalCoreModule | ||
| // // ], | ||
| // providers: [ | ||
| // // // { provide: HelpAPIService, useValue: helpApiServiceSpy }, | ||
| // // // DialogService | ||
| // // provideHttpClientTesting(), | ||
| // importProvidersFrom( | ||
| // TranslateTestingModule.withTranslations({ | ||
| // en: require('../../../../assets/i18n/en.json'), | ||
| // de: require('../../../../assets/i18n/de.json') | ||
| // }) | ||
| // ) | ||
| // ] | ||
| // }).compileComponents() | ||
|
|
||
| // fixture = TestBed.createComponent(ShowHelpRemoteComponent) | ||
| // component = fixture.componentInstance | ||
|
|
||
| // fixture.detectChanges() | ||
|
|
||
| // showHelpRemoteHarness = await TestbedHarnessEnvironment.harnessForFixture(fixture, ShowHelpRemoteHarness) | ||
| // }) | ||
|
|
||
| // // afterEach(() => { | ||
| // // helpApiServiceSpy.getHelpDataItem.calls.reset() | ||
| // // }) | ||
|
|
||
| // it('should create', () => { | ||
| // expect(component).toBeTruthy() | ||
| // }) | ||
|
|
||
| // // it('should not show button if permissions are not met', async () => { | ||
| // // expect(await showHelpRemoteHarness.getHelpButtonTitle()).toBeUndefined() | ||
| // // }) | ||
|
|
||
| // it('should show button if permissions are met', async () => { | ||
| // // component.permissions = ['PORTAL_HEADER_HELP#VIEW'] | ||
|
|
||
| // // fixture.detectChanges() | ||
|
|
||
| // expect(await showHelpRemoteHarness.getHelpButtonTitle()).toBe('Show Help for this article') | ||
|
|
||
| // expect(await showHelpRemoteHarness.hasHelpIconClass(PrimeIcons.QUESTION_CIRCLE)).toBe(true) | ||
| // }) | ||
|
|
||
| // it('should apply correct linkItem class', async () => { | ||
| // expect(await showHelpRemoteHarness.hasHelpButtonClass('testLinkItemClass')).toBe(false) | ||
|
|
||
| // component.linkItemClass = 'testLinkItemClass' | ||
|
|
||
| // expect(await showHelpRemoteHarness.hasHelpButtonClass('testLinkItemClass')).toBe(true) | ||
| // }) | ||
|
|
||
| // it('should apply correct iconItem class', async () => { | ||
| // expect(await showHelpRemoteHarness.hasHelpIconClass('testIconItemClass')).toBe(false) | ||
|
|
||
| // component.iconItemClass = 'testIconItemClass' | ||
|
|
||
| // expect(await showHelpRemoteHarness.hasHelpIconClass('testIconItemClass')).toBe(true) | ||
| // }) | ||
|
|
||
| // it('should apply correct labelKey', async () => { | ||
| // expect(await showHelpRemoteHarness.getHelpButtonTitle()).toBe('Show Help for this article') | ||
|
|
||
| // component.labelKey = 'non-translatable-key' | ||
|
|
||
| // expect(await showHelpRemoteHarness.getHelpButtonTitle()).toBe('non-translatable-key') | ||
| // }) | ||
|
|
||
| // it('should apply correct icon', async () => { | ||
| // expect(await showHelpRemoteHarness.hasHelpIconClass(PrimeIcons.QUESTION_CIRCLE)).toBe(true) | ||
|
|
||
| // component.icon = PrimeIcons.HOME | ||
|
|
||
| // expect(await showHelpRemoteHarness.hasHelpIconClass(PrimeIcons.HOME)).toBe(true) | ||
| // }) | ||
|
|
||
| // it('should open help page on click if helpData was successfully fetched', async () => { | ||
| // const spy = spyOn(component, 'openHelpPage') | ||
|
|
||
| // await showHelpRemoteHarness.clickHelpButton() | ||
|
|
||
| // expect(spy).toHaveBeenCalledTimes(1) | ||
| // }) | ||
| // }) |
Oops, something went wrong.