Skip to content

Commit

Permalink
Merge branch 'main' into feat/search-widget-accessibility
Browse files Browse the repository at this point in the history
  • Loading branch information
markuczy committed Feb 28, 2024
2 parents d6511c8 + f2e7606 commit 463e794
Show file tree
Hide file tree
Showing 30 changed files with 305 additions and 94 deletions.
19 changes: 19 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,22 @@
## [4.9.0](https://github.com/onecx/onecx-portal-ui-libs/compare/v4.8.0...v4.9.0) (2024-02-28)


### Features

* column group floating label displayed ([#148](https://github.com/onecx/onecx-portal-ui-libs/issues/148)) ([70cf90e](https://github.com/onecx/onecx-portal-ui-libs/commit/70cf90ed8f906d640ea7280ec850a377b6b7f785))
* lifecycle component ([#153](https://github.com/onecx/onecx-portal-ui-libs/issues/153)) ([c9c8cdf](https://github.com/onecx/onecx-portal-ui-libs/commit/c9c8cdfbc2071d65e21d3f809d97355e1201e079))
* search header allows to provide subheader now ([#147](https://github.com/onecx/onecx-portal-ui-libs/issues/147)) ([d4bf6c5](https://github.com/onecx/onecx-portal-ui-libs/commit/d4bf6c5edb15f49f293290ddd2fdd4639e44fcd8))


### Bug Fixes

* adapt SearchConfig interface and use the type PrimeIcon for icons ([#152](https://github.com/onecx/onecx-portal-ui-libs/issues/152)) ([56e09ac](https://github.com/onecx/onecx-portal-ui-libs/commit/56e09acc4d312b9006da378817fa944f3f1eec59))


### Refactoring

* migrate icons in TS to PrimeIcons ([#151](https://github.com/onecx/onecx-portal-ui-libs/issues/151)) ([186fae8](https://github.com/onecx/onecx-portal-ui-libs/commit/186fae874a752f734b87c45d35a9c4c5c0e79bc2))

## [4.8.0](https://github.com/onecx/onecx-portal-ui-libs/compare/v4.7.0...v4.8.0) (2024-02-26)


Expand Down
2 changes: 1 addition & 1 deletion libs/accelerator/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@onecx/accelerator",
"version": "4.8.0",
"version": "4.9.0",
"peerDependencies": {
"tslib": "^2.3.0",
"rxjs": "7.8.1"
Expand Down
2 changes: 1 addition & 1 deletion libs/integration-interface/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@onecx/integration-interface",
"version": "4.8.0",
"version": "4.9.0",
"peerDependencies": {
"tslib": "^2.3.0",
"rxjs": "7.8.1",
Expand Down
2 changes: 1 addition & 1 deletion libs/keycloak-auth/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@onecx/keycloak-auth",
"version": "4.8.0",
"version": "4.9.0",
"peerDependencies": {
"@angular/common": ">=15.2.7",
"@angular/core": ">=15.2.7",
Expand Down
2 changes: 1 addition & 1 deletion libs/portal-integration-angular/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@onecx/portal-integration-angular",
"version": "4.8.0",
"version": "4.9.0",
"peerDependencies": {
"@angular-architects/module-federation": "15.0.0",
"@angular/common": "^15.2.7",
Expand Down
2 changes: 2 additions & 0 deletions libs/portal-integration-angular/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,7 @@ export * from './lib/core/components/loading-indicator/loading-indicator.compone
export * from './lib/core/components/content-container/content-container.component'
export * from './lib/core/components/content/content.component'
export * from './lib/core/components/create-or-edit-search-config-dialog/create-or-edit-search-config-dialog.component'
export * from './lib/core/components/lifecycle/lifecycle.component'

// services
export * from './lib/services/app.menu.service'
Expand Down Expand Up @@ -127,3 +128,4 @@ export * from './lib/core/utils/add-initialize-module-guard.utils'
export * from './lib/core/utils/translate-service-initializer.utils'
export * from './lib/core/utils/portal-api-configuration.utils'
export * from './lib/core/utils/caching-translate-loader.utils'
export * from './lib/core/utils/primeicon.utils'
Original file line number Diff line number Diff line change
@@ -1,25 +1,25 @@
<div>
<ng-container #container></ng-container>
<ng-content></ng-content>
<div class="w-full flex justify-content-end mb-3">
<button
id="buttonDialogSecondaryButton"
pButton
*ngIf="dialogData.config.secondaryButtonIncluded"
class="mx-2"
[icon]="dialogData.config.secondaryButtonDetails!.icon !== undefined ? dialogData.config.secondaryButtonDetails!.icon : ''"
(click)="secondaryButtonAction()"
[label]="dialogData.config.secondaryButtonDetails!.key | translate:dialogData.config.secondaryButtonDetails?.parameters"
[disabled]="secondaryButtonDisabled$ | async"
></button>
<button
id="buttonDialogPrimaryButton"
pButton
class="mx-2"
[icon]="dialogData.config.primaryButtonDetails!.icon !== undefined ? dialogData.config.primaryButtonDetails!.icon : ''"
(click)="primaryButtonAction()"
[label]="dialogData.config.primaryButtonDetails!.key | translate:dialogData.config.primaryButtonDetails?.parameters"
[disabled]="primaryButtonDisabled$ | async"
></button>
</div>
</div>
<ng-container #container></ng-container>
<ng-content></ng-content>
<div class="w-full flex justify-content-end mb-3">
<button
id="buttonDialogSecondaryButton"
pButton
*ngIf="dialogData.config.secondaryButtonIncluded"
class="mx-2"
[icon]="dialogData.config.secondaryButtonDetails!.icon !== undefined ? dialogData.config.secondaryButtonDetails!.icon : ''"
(click)="secondaryButtonAction()"
[label]="dialogData.config.secondaryButtonDetails!.key | translate:dialogData.config.secondaryButtonDetails?.parameters"
[disabled]="secondaryButtonDisabled$ | async"
></button>
<button
id="buttonDialogPrimaryButton"
pButton
class="mx-2"
[icon]="dialogData.config.primaryButtonDetails!.icon !== undefined ? dialogData.config.primaryButtonDetails!.icon : ''"
(click)="primaryButtonAction()"
[label]="dialogData.config.primaryButtonDetails!.key | translate:dialogData.config.primaryButtonDetails?.parameters"
[disabled]="primaryButtonDisabled$ | async"
></button>
</div>
</div>
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core'
import { PrimeIcons } from 'primeng/api'
import { PrimeIcon } from '../../utils/primeicon.utils'

interface ViewingLayouts {
icon: PrimeIcons
icon: PrimeIcon
layout: 'grid' | 'list' | 'table'
title?: string
titleKey: string
Expand Down Expand Up @@ -39,7 +40,7 @@ export class DataLayoutSelectionComponent implements OnInit {
this.layout = 'table'
}

onDataViewLayoutChange(event: { icon: PrimeIcons; layout: 'grid' | 'list' | 'table' }): void {
onDataViewLayoutChange(event: { icon: PrimeIcon; layout: 'grid' | 'list' | 'table' }): void {
this.dataViewLayoutChange.emit(event.layout)
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,22 @@ import { ColumnViewTemplate } from '../../../model/column-view-template'
import { ColumnTogglerComponent } from './column-toggler-component/column-toggler.component'
import { ViewTemplatePickerComponent } from './view-template-picker/view-template-picker.component'
import { PrimeIcons } from 'primeng/api'
import { PrimeIcon } from '../../utils/primeicon.utils'

interface ViewingModes {
icon: PrimeIcons
icon: PrimeIcon
mode: string
title?: string
titleKey?: string
}

const ALL_VIEW_MODES = [
type ViewMode = {
icon: PrimeIcon
mode: string
titleKey: string
}

const ALL_VIEW_MODES: ViewMode[] = [
{ icon: PrimeIcons.LIST, mode: 'list', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.LIST' },
{ icon: PrimeIcons.TH_LARGE, mode: 'grid', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.GRID' },
{ icon: PrimeIcons.TABLE, mode: 'table', titleKey: 'OCX_DATA_LAYOUT_SELECTION.LAYOUT.TABLE' },
Expand Down Expand Up @@ -249,7 +256,7 @@ export class DataViewControlsComponent implements OnInit, OnChanges {
})
}

viewModeChange(event: { icon: PrimeIcons; mode: string }): void {
viewModeChange(event: { icon: PrimeIcon; mode: string }): void {
this.dataViewChange.emit(event.mode)
this.enableToggleColumnButton(event.mode)
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -6,24 +6,33 @@ import { PrimeIcons } from 'primeng/api'
import { DiagramData } from '../../../model/diagram-data'
import { DiagramType } from '../../../model/diagram-type'
import { ColorUtils } from '../../utils/colorutils'
import { PrimeIcon } from '../../utils/primeicon.utils'

export interface DiagramLayouts {
icon: PrimeIcons
icon: PrimeIcon
layout: DiagramType
title?: string
titleKey: string
}

const allDiagramTypes: DiagramLayouts[] = [
{ icon: PrimeIcons.CHART_PIE, layout: DiagramType.PIE, titleKey: 'OCX_DIAGRAM.SWITCH_DIAGRAM_TYPE.PIE' },
{ icon: PrimeIcons.BARS, layout: DiagramType.HORIZONTAL_BAR, titleKey: 'OCX_DIAGRAM.SWITCH_DIAGRAM_TYPE.HORIZONTAL_BAR' },
{ icon: PrimeIcons.CHART_BAR, layout: DiagramType.VERTICAL_BAR, titleKey: 'OCX_DIAGRAM.SWITCH_DIAGRAM_TYPE.VERTICAL_BAR' },
{
icon: PrimeIcons.BARS,
layout: DiagramType.HORIZONTAL_BAR,
titleKey: 'OCX_DIAGRAM.SWITCH_DIAGRAM_TYPE.HORIZONTAL_BAR',
},
{
icon: PrimeIcons.CHART_BAR,
layout: DiagramType.VERTICAL_BAR,
titleKey: 'OCX_DIAGRAM.SWITCH_DIAGRAM_TYPE.VERTICAL_BAR',
},
]

@Component({
selector: 'ocx-diagram',
templateUrl: './diagram.component.html',
styleUrls: ['./diagram.component.scss']
styleUrls: ['./diagram.component.scss'],
})
export class DiagramComponent implements OnInit, OnChanges {
@Input() data: DiagramData[] | undefined
Expand All @@ -41,7 +50,7 @@ export class DiagramComponent implements OnInit, OnChanges {
this.chartType = this.diagramTypeToChartType(value)
}
private _supportedDiagramTypes: DiagramType[] = []
@Input()
@Input()
get supportedDiagramTypes(): DiagramType[] {
return this._supportedDiagramTypes
}
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<p-timeline [value]="steps">
<ng-template pTemplate="marker" let-step>
<span class="p-timeline-event-marker" [ngClass]="activeStepId && activeStepId === step.id ? 'bg-primary' : ''"></span>
</ng-template>
<ng-template pTemplate="content" let-step>
<div class="pb-4 h-full">
<div class="card h-full" [ngClass]="activeStepId && activeStepId === step.id ? 'bg-primary' : ''">
<p class="font-bold text-xl" [ngClass]="step.details ? 'mb-2' : ''">{{ step.title }}</p>
<p *ngIf="step.details" [ngClass]="activeStepId && activeStepId === step.id ? '' : 'text-color-secondary'">{{ step.details }}</p>
</div>
</div>
</ng-template>
</p-timeline>
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
import { ComponentFixture, TestBed } from '@angular/core/testing'
import { LifecycleComponent, LifecycleStep } from './lifecycle.component'
import { TimelineModule } from 'primeng/timeline'
import { LifecycleHarness, TestbedHarnessEnvironment } from '../../../../../testing'
import { PrimeNgModule } from '../../primeng.module'
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
import { PortalCoreModule } from '../../portal-core.module'

const mockSteps: LifecycleStep[] = [
{
id: 'test1',
title: 'Test 1',
},
{
id: 'test2',
title: 'Test 2',
details: 'Test 2 description',
},
{
id: 'test3',
title: 'Test 3',
},
]

describe('LifecycleComponent', () => {
let component: LifecycleComponent
let fixture: ComponentFixture<LifecycleComponent>
let lifecycle: LifecycleHarness

beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [LifecycleComponent],
imports: [TimelineModule, PrimeNgModule, BrowserAnimationsModule, PortalCoreModule],
}).compileComponents()

fixture = TestBed.createComponent(LifecycleComponent)
component = fixture.componentInstance
fixture.detectChanges()
lifecycle = await TestbedHarnessEnvironment.harnessForFixture(fixture, LifecycleHarness)
})

it('should create', () => {
expect(component).toBeTruthy()
expect(lifecycle).toBeTruthy()
})

it('should not render any initial lifecycle steps', async () => {
const steps = await lifecycle.getSteps()
expect(steps.length).toBe(0)
})

it('should render given lifecycle steps', async () => {
component.steps = mockSteps
const steps = await lifecycle.getSteps()
const highlightedSteps = await lifecycle.getHighlightedSteps()
expect(steps.length).toBe(3)
expect(highlightedSteps.length).toBe(0)
mockSteps.forEach(async (step, index) => {
expect(await steps[index].text()).toEqual(step.title + (step.details ?? ''))
})
})

it('should highlight a given lifecycle step', async () => {
component.steps = mockSteps
component.activeStepId = 'test2'
const steps = await lifecycle.getSteps()
const highlightedSteps = await lifecycle.getHighlightedSteps()
mockSteps.forEach(async (step, index) => {
if(step.id == component.activeStepId) {
expect(await steps[index].hasClass('bg-primary')).toEqual(true)
}
})
expect(steps.length).toBe(3)
expect(highlightedSteps.length).toBe(1)
})
})
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
import { importProvidersFrom } from '@angular/core'
import { BrowserModule } from '@angular/platform-browser'
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'
import { Meta, StoryFn, applicationConfig, moduleMetadata } from '@storybook/angular'
import { StorybookTranslateModule } from '../../storybook-translate.module'
import { LifecycleComponent, LifecycleStep } from './lifecycle.component'
import { TimelineModule } from 'primeng/timeline'
import { CardModule } from 'primeng/card'

export default {
title: 'LifecycleComponent',
component: LifecycleComponent,
decorators: [
applicationConfig({
providers: [importProvidersFrom(BrowserModule), importProvidersFrom(BrowserAnimationsModule)],
}),
moduleMetadata({
declarations: [LifecycleComponent],
imports: [StorybookTranslateModule, TimelineModule, CardModule],
}),
],
} as Meta<LifecycleComponent>

const Template: StoryFn<LifecycleComponent> = (args: LifecycleComponent) => ({
props: args,
})

const mockData: LifecycleStep[] = [
{
id: "todo",
title: "ToDo"
},
{
id: "in_progress",
title: "In Progress",
details: "This event is currently in progress"
},
{
id: "done",
title: "Done"
}
]

export const WithoutHighlightedStep = {
render: Template,
args: {
steps: mockData
}
}

export const WithHighlightedStep = {
render: Template,
args: {
steps: mockData,
activeStepId: 'in_progress'
}
}
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import { Component, Input } from '@angular/core'

export interface LifecycleStep {
id: string
title: string,
details?: string,
}

@Component({
selector: 'ocx-lifecycle',
templateUrl: './lifecycle.component.html',
})
export class LifecycleComponent {
@Input() steps: LifecycleStep[] = []
@Input() activeStepId: string | undefined
}
Loading

0 comments on commit 463e794

Please sign in to comment.