;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [LfUserFeedbackDocumentationComponent],
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(LfUserFeedbackDocumentationComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/lf-documentation/src/app/lf-user-feedback-documentation/lf-user-feedback-documentation.component.ts b/projects/lf-documentation/src/app/lf-user-feedback-documentation/lf-user-feedback-documentation.component.ts
index 2a25baaa..b42923a9 100644
--- a/projects/lf-documentation/src/app/lf-user-feedback-documentation/lf-user-feedback-documentation.component.ts
+++ b/projects/lf-documentation/src/app/lf-user-feedback-documentation/lf-user-feedback-documentation.component.ts
@@ -1,15 +1,17 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Component } from '@angular/core';
-
-@Component({
- selector: 'app-lf-user-feedback-documentation',
- templateUrl: './lf-user-feedback-documentation.component.html',
- styleUrls: ['./lf-user-feedback-documentation.component.css', './../app.component.css']
-})
-export class LfUserFeedbackDocumentationComponent {
-
- constructor() { }
-
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { LfUserFeedbackComponent } from 'projects/ui-components/projects';
+
+@Component({
+ selector: 'app-lf-user-feedback-documentation',
+ templateUrl: './lf-user-feedback-documentation.component.html',
+ styleUrls: ['./lf-user-feedback-documentation.component.css', './../app.component.css'],
+ standalone: true,
+ imports: [LfUserFeedbackComponent],
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
+})
+export class LfUserFeedbackDocumentationComponent {
+ constructor() {}
+}
diff --git a/projects/lf-documentation/src/app/migrate-modules-to-standalone/migrate-modules-to-standalone.component.css b/projects/lf-documentation/src/app/migrate-modules-to-standalone/migrate-modules-to-standalone.component.css
new file mode 100644
index 00000000..e69de29b
diff --git a/projects/lf-documentation/src/app/migrate-modules-to-standalone/migrate-modules-to-standalone.component.html b/projects/lf-documentation/src/app/migrate-modules-to-standalone/migrate-modules-to-standalone.component.html
new file mode 100644
index 00000000..5370a8d2
--- /dev/null
+++ b/projects/lf-documentation/src/app/migrate-modules-to-standalone/migrate-modules-to-standalone.component.html
@@ -0,0 +1,234 @@
+
+
+Migrating from Modules to Standalone Components
+
+
+ Starting with the Angular 21 version, all Laserfiche UI Components are standalone and zoneless .
+ NgModules (e.g. LfChecklistModule, LfRepositoryBrowserModule) have been removed. Components
+ are now imported directly into other standalone components.
+
+
+
+
+Overview of Changes
+
+
+ No more NgModules: LfChecklistModule, LfLoginModule, LfMetadataModule,
+ LfUserFeedbackModule, and LfRepositoryBrowserModule have been removed.
+
+
+ Standalone components: Import components directly (e.g. LfChecklistComponent) into your
+ standalone component's imports array.
+
+ Zoneless: Laserfiche components no longer depend on zone.js.
+
+Step-by-Step Migration
+
+
+ Remove module imports.
+
+ In your app.module.ts (or any NgModule), remove the Laserfiche module imports:
+
+
+
+import { LfChecklistModule } from '@laserfiche/lf-ui-components/lf-checklist' ;
+import { LfRepositoryBrowserModule } from '@laserfiche/lf-ui-components/lf-repository-browser' ;
+
+
+
+ Make your components standalone.
+
+ Add standalone: true to each component that uses Laserfiche UI Components (if not already
+ standalone).
+
+
+
+ Import the standalone component directly.
+
+ In each component that uses a Laserfiche component, add it to the imports array:
+
+
+
+import { LfChecklistComponent } from '@laserfiche/lf-ui-components/lf-checklist' ;
+
+@Component({
+ selector : 'app-my-component',
+ standalone : true,
+ imports : [LfChecklistComponent],
+ templateUrl : './my-component.component.html',
+})
+export class MyComponent { }
+
+
+
+ Update ViewChild references.
+
+ You no longer need ElementRef wrappers. Reference the component type directly:
+
+
+
+@ViewChild('myChecklist') checklist! : ElementRef<LfChecklistComponent>;
+this.checklist.nativeElement .initAsync (...);
+
+
+@ViewChild('myChecklist') checklist! : LfChecklistComponent;
+this.checklist .initAsync (...);
+
+
+
+ Remove app.module.ts if fully standalone.
+
+ If all your components are standalone, replace your root NgModule with bootstrapApplication():
+
+
+
+import { bootstrapApplication } from '@angular/platform-browser' ;
+import { provideZonelessChangeDetection } from '@angular/core' ;
+import { provideRouter } from '@angular/router' ;
+import { AppComponent } from './app/app.component' ;
+
+bootstrapApplication (AppComponent, {
+ providers : [
+ provideZonelessChangeDetection (),
+ provideRouter (routes),
+ ],
+});
+
+
+
+
+Module-to-Component Mapping
+
+ The following table shows the old module imports and their standalone component replacements:
+
+
+
+ Old Module (removed)
+ New Standalone Component
+ Entry Point
+
+
+ LfChecklistModuleLfChecklistComponent@laserfiche/lf-ui-components/lf-checklist
+
+ LfLoginModuleLfLoginComponent@laserfiche/lf-ui-components/lf-login
+
+ LfMetadataModule
+ LfFieldContainerComponentLfFieldAdhocContainerComponentLfFieldTemplateContainerComponent
+
+ @laserfiche/lf-ui-components/lf-metadata
+
+ LfUserFeedbackModuleLfUserFeedbackComponent@laserfiche/lf-ui-components/lf-user-feedback
+
+ LfRepositoryBrowserModuleLfRepositoryBrowserComponent@laserfiche/lf-ui-components/lf-repository-browser
+
+
+Going Zoneless
+
+ Laserfiche UI Components no longer depend on zone.js. To adopt zoneless change detection in your app:
+
+
+
+ Replace provideZoneChangeDetection() with provideZonelessChangeDetection() in your
+ application config or bootstrap call.
+
+
+ Remove zone.js from your polyfills in angular.json (if present).
+
+
+ Uninstall zone.js if no other dependency requires it:
+ npm uninstall zone.js
+
+
+
+ Note: Going zoneless in your own app is optional. The Laserfiche UI Components work correctly whether your app uses
+ zone.js or not.
+
+
+Before & After Examples
+
+Before: Module-based (old)
+
+
+import { NgModule } from '@angular/core' ;
+import { LfChecklistModule } from '@laserfiche/lf-ui-components/lf-checklist' ;
+
+@NgModule({
+ declarations : [AppComponent, MyComponent],
+ imports : [BrowserModule, LfChecklistModule],
+ bootstrap : [AppComponent],
+})
+export class AppModule { }
+
+
+
+
+@Component({
+ selector : 'app-my-component',
+ template : '<lf-checklist #myChecklist></lf-checklist>',
+})
+export class MyComponent {
+ @ViewChild('myChecklist') checklist! : ElementRef<LfChecklistComponent>;
+
+ ngAfterViewInit () {
+ this.checklist.nativeElement .initAsync (...);
+ }
+}
+
+
+After: Standalone (new)
+
+
+import { bootstrapApplication } from '@angular/platform-browser' ;
+import { provideZonelessChangeDetection } from '@angular/core' ;
+import { AppComponent } from './app/app.component' ;
+
+bootstrapApplication (AppComponent, {
+ providers : [provideZonelessChangeDetection ()],
+});
+
+
+
+
+import { LfChecklistComponent } from '@laserfiche/lf-ui-components/lf-checklist' ;
+
+@Component({
+ selector : 'app-my-component',
+ standalone : true,
+ imports : [LfChecklistComponent],
+ template : '<lf-checklist-component #myChecklist></lf-checklist-component>',
+})
+export class MyComponent {
+ @ViewChild('myChecklist') checklist! : LfChecklistComponent;
+
+ ngAfterViewInit () {
+ this.checklist .initAsync (...);
+ }
+}
+
diff --git a/projects/lf-documentation/src/app/migrate-modules-to-standalone/migrate-modules-to-standalone.component.spec.ts b/projects/lf-documentation/src/app/migrate-modules-to-standalone/migrate-modules-to-standalone.component.spec.ts
new file mode 100644
index 00000000..6948bd53
--- /dev/null
+++ b/projects/lf-documentation/src/app/migrate-modules-to-standalone/migrate-modules-to-standalone.component.spec.ts
@@ -0,0 +1,27 @@
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MigrateModulesToStandaloneComponent } from './migrate-modules-to-standalone.component';
+
+describe('MigrateModulesToStandaloneComponent', () => {
+ let component: MigrateModulesToStandaloneComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [MigrateModulesToStandaloneComponent],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(MigrateModulesToStandaloneComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/lf-documentation/src/app/migrate-modules-to-standalone/migrate-modules-to-standalone.component.ts b/projects/lf-documentation/src/app/migrate-modules-to-standalone/migrate-modules-to-standalone.component.ts
new file mode 100644
index 00000000..c18f01bf
--- /dev/null
+++ b/projects/lf-documentation/src/app/migrate-modules-to-standalone/migrate-modules-to-standalone.component.ts
@@ -0,0 +1,15 @@
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Component } from '@angular/core';
+
+@Component({
+ selector: 'app-migrate-modules-to-standalone',
+ templateUrl: './migrate-modules-to-standalone.component.html',
+ styleUrls: ['./migrate-modules-to-standalone.component.css', './../app.component.css'],
+ standalone: true,
+ imports: [],
+})
+export class MigrateModulesToStandaloneComponent {
+ constructor() {}
+}
diff --git a/projects/lf-documentation/src/app/overview/overview.component.css b/projects/lf-documentation/src/app/overview/overview.component.css
index cc6f2db1..d04a21eb 100644
--- a/projects/lf-documentation/src/app/overview/overview.component.css
+++ b/projects/lf-documentation/src/app/overview/overview.component.css
@@ -1,22 +1,22 @@
-.chrome-logo {
- height: 70px;
- width: 70px;
- background: url("https://lfxstatic.com/Site/laserfiche-ui-components/2.0/chrome-logo.png");
-}
-.firefox-logo {
- height: 75px;
- width: 75px;
- background: url("https://lfxstatic.com/Site/laserfiche-ui-components/2.0/firefox-logo.png");
-}
-.edge-logo {
- height: 65px;
- width: 65px;
- background: url("https://lfxstatic.com/Site/laserfiche-ui-components/2.0/edge-logo.png");
-}
-
-.browser {
- padding: 0px 20px 0px 0px;
- background-repeat: no-repeat;
- display: inline-block;
- vertical-align: bottom;
-}
\ No newline at end of file
+.chrome-logo {
+ height: 70px;
+ width: 70px;
+ background: url("https://lfxstatic.com/Site/laserfiche-ui-components/2.0/chrome-logo.png");
+}
+.firefox-logo {
+ height: 75px;
+ width: 75px;
+ background: url("https://lfxstatic.com/Site/laserfiche-ui-components/2.0/firefox-logo.png");
+}
+.edge-logo {
+ height: 65px;
+ width: 65px;
+ background: url("https://lfxstatic.com/Site/laserfiche-ui-components/2.0/edge-logo.png");
+}
+
+.browser {
+ padding: 0px 20px 0px 0px;
+ background-repeat: no-repeat;
+ display: inline-block;
+ vertical-align: bottom;
+}
diff --git a/projects/lf-documentation/src/app/overview/overview.component.html b/projects/lf-documentation/src/app/overview/overview.component.html
index 57e58200..42e7dec8 100644
--- a/projects/lf-documentation/src/app/overview/overview.component.html
+++ b/projects/lf-documentation/src/app/overview/overview.component.html
@@ -1,48 +1,41 @@
-
-
-
- Laserfiche UI Components
-
-
-
- The Laserfiche UI Components project is a collection of reusable web components that are available as framework-agnostic
- custom elements. The UI components include out-of-the-box Laserfiche experiences (e.g.
- document view, search, and import) as well as lower-level base components (e.g. trees, fields, etc.).
-
-
-
- The Laserfiche UI Components makes it easy for you to integrate Laserfiche experiences into your application with minimal
- code.
-
-
-
-
-
-
-
-
-
-
- The Laserfiche UI Components is intended for developers and integrators looking for an easy way to connect to Laserfiche
- in their web applications.
-
-
-
-
-
-
-
-
-
-
-
- For questions and feature requests, feel free to contact us at e-eng-application-components@laserfiche.com
-
+
+
+Laserfiche UI Components
+
+
+ The Laserfiche UI Components project is a collection of reusable web components that are available as
+ framework-agnostic custom elements. The UI components include out-of-the-box Laserfiche experiences (e.g. document
+ view, search, and import) as well as lower-level base components (e.g. trees, fields, etc.).
+
+
+
+ The Laserfiche UI Components makes it easy for you to integrate Laserfiche experiences into your application with
+ minimal code.
+
+
+
+
+
+
+
+
+
+
+ The Laserfiche UI Components is intended for developers and integrators looking for an easy way to connect to
+ Laserfiche in their web applications.
+
+
+
+
+
+
+
+
+
+
+
+ For questions and feature requests, feel free to contact us at
+ e-eng-application-components@laserfiche.com
+
diff --git a/projects/lf-documentation/src/app/overview/overview.component.spec.ts b/projects/lf-documentation/src/app/overview/overview.component.spec.ts
index 2a1f09c7..ec76ee6e 100644
--- a/projects/lf-documentation/src/app/overview/overview.component.spec.ts
+++ b/projects/lf-documentation/src/app/overview/overview.component.spec.ts
@@ -1,36 +1,29 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { OverviewComponent } from './overview.component';
-import { LfMetadataModule } from './../../../../ui-components/lf-metadata/lf-metadata.module';
-
-describe('OverviewComponent', () => {
- let component: OverviewComponent;
- let fixture: ComponentFixture;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [
- OverviewComponent
- ],
- imports: [
- LfMetadataModule
- ],
- schemas: [ CUSTOM_ELEMENTS_SCHEMA ]
- })
- .compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(OverviewComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { OverviewComponent } from './overview.component';
+
+describe('OverviewComponent', () => {
+ let component: OverviewComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [OverviewComponent],
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(OverviewComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/lf-documentation/src/app/overview/overview.component.ts b/projects/lf-documentation/src/app/overview/overview.component.ts
index 00bf2405..92b52139 100644
--- a/projects/lf-documentation/src/app/overview/overview.component.ts
+++ b/projects/lf-documentation/src/app/overview/overview.component.ts
@@ -1,23 +1,26 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { AfterViewInit, Component, ElementRef, ViewChild } from '@angular/core';
-import { LfFieldContainerComponent } from './../../../../ui-components/lf-metadata/lf-metadata-public-api';
-import { LfFieldContainerDemoService } from '../lf-field-container-documentation/lf-field-container-demo.service';
-
-@Component({
- selector: 'app-overview',
- templateUrl: './overview.component.html',
- styleUrls: ['./overview.component.css', './../app.component.css']
-})
-export class OverviewComponent implements AfterViewInit {
-
- @ViewChild('overviewField') elementFieldContainerRef!: ElementRef;
-
- constructor() { }
-
- async ngAfterViewInit() {
- const elementService = new LfFieldContainerDemoService();
- await this.elementFieldContainerRef?.nativeElement.initAsync(elementService, 1);
- }
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { AfterViewInit, Component, ViewChild, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { LfFieldContainerComponent } from './../../../../ui-components/lf-metadata/lf-metadata-public-api';
+import { LfFieldContainerDemoService } from '../lf-field-container-documentation/lf-field-container-demo.service';
+import { CardComponent } from '../card/card.component';
+
+@Component({
+ selector: 'app-overview',
+ templateUrl: './overview.component.html',
+ styleUrls: ['./overview.component.css', './../app.component.css'],
+ standalone: true,
+ imports: [CardComponent, LfFieldContainerComponent],
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
+})
+export class OverviewComponent implements AfterViewInit {
+ @ViewChild('overviewField') elementFieldContainerRef!: LfFieldContainerComponent;
+
+ constructor() {}
+
+ async ngAfterViewInit() {
+ const elementService = new LfFieldContainerDemoService();
+ await this.elementFieldContainerRef?.initAsync(elementService, 1);
+ }
+}
diff --git a/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.css b/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.css
index 772a2e93..279ea49a 100644
--- a/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.css
+++ b/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.css
@@ -1,15 +1,14 @@
-.tab-content {
- background-color: lightgrey;
- overflow: auto;
-}
-
-.lf-link {
- background-color: #00866B;
- color: #FAFAFA;
-}
-
-.ms-link {
- background-color: #0078d4;
- color: white;
-}
-
\ No newline at end of file
+.tab-content {
+ background-color: lightgrey;
+ overflow: auto;
+}
+
+.lf-link {
+ background-color: #00866b;
+ color: #fafafa;
+}
+
+.ms-link {
+ background-color: #0078d4;
+ color: white;
+}
diff --git a/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.html b/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.html
index 6100f724..b862bb48 100644
--- a/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.html
+++ b/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.html
@@ -1,181 +1,180 @@
-
-
-
- Styling Components
-
-
-
-
-
- You can use the stylesheets in one of two ways:
-
-
- A <link> element inside your <head> element in your index.html with the relevant url.
- (Recommended)
- An import at the top of your styles.css, styles.scss file, or equivalent.
-
-
- Once this is included, all RWC components will be styled.
-
-
-
- Example Code: index.html
- styles.css
-
-
- <link id="lf-stylesheet" href="https://lfxstatic.com/npm/@laserfiche/lf-ui-components@NPM_VERSION/cdn/lf-laserfiche-lite.css" rel="stylesheet" />
-
-
- @import "https://lfxstatic.com/npm/@laserfiche/lf-ui-components@NPM_VERSION/cdn/lf-laserfiche-lite.css";
-
-
-
-
-
-
- Once you have imported the stylesheet, you can also style simple elements that are not part of the components, for
- example: buttons and text fields.
- You do this by adding a class to the element. Some elements will also have subtypes/substyles which you will have to
- specify. Common Elements: lf-element-name Examples: lf-button, lf-checkbox Element Subtypes: subtype-element-name Examples: primary-button, sec-button
-
-
- Show HTML
-
-
- Unstyled
- Primary
- Secondary
- No Subtype
-
-
-
- Show HTML
-
-
- <input value="Unstyled">
- <input class="lf-text-field" value="Styled">
-
-
-
-
-
-
- This can only be done if you import the stylesheet in the index.html via a link element. Example implementations are
- provided below (styling not included).
-
-
-
-
-
View HTML
-
View Typescript
-
-
-
- Laserfiche
- Microsoft
- No Theme
-
-
-
-
-
-
View HTML
-
View Typescript
-
-
- <select id="theme-selector" (change)="setTheme()">
- <option value="laserfiche">Laserfiche Theme</option>
- <option value="microsoft">Microsoft Theme</option>
- </select>
-
-
-
-
- setTheme() {
- const selectElement = (<HTMLSelectElement>document.getElementById('theme-selector'));
- const themeSelected = selectElement.options[selectElement.selectedIndex].value;
- if (themeSelected === 'laserfiche') {
- this.setThemeLaserfiche();
- }
- else if (themeSelected === 'microsoft') {
- this.setThemeMicrosoft();
- }
- }
-
-
-
-
- Laserfiche Theme
- Microsoft Theme
-
-
-
+
+
+Styling Components
+
+
+
+You can use the stylesheets in one of two ways:
+
+
+ A <link> element inside your <head> element in your index.html with the relevant url.
+ (Recommended)
+
+
+ An import at the top of your styles.css, styles.scss file, or equivalent.
+
+Once this is included, all RWC components will be styled.
+
+
+ Example Code: index.html
+ styles.css
+
+
+ <link id="lf-stylesheet"
+ href="https://lfxstatic.com/npm/@laserfiche/lf-ui-components@NPM_VERSION/cdn/lf-laserfiche-lite.css"
+ rel="stylesheet" />
+
+
+ @import
+ "https://lfxstatic.com/npm/@laserfiche/lf-ui-components@NPM_VERSION/cdn/lf-laserfiche-lite.css";
+
+
+
+
+
+
+ Once you have imported the stylesheet, you can also style simple elements that are not part of the components, for
+ example: buttons and text fields. You do this by adding a class to the element. Some elements will also have
+ subtypes/substyles which you will have to specify. Common Elements: lf-element-name Examples: lf-button, lf-checkbox Element Subtypes: subtype-element-name Examples: primary-button, sec-button
+
+
+ Show HTML
+
+
+ Unstyled
+ Primary
+ Secondary
+ No Subtype
+
+
+
+ Show HTML
+
+
+ <input value="Unstyled">
+ <input class="lf-text-field" value="Styled">
+
+
+
+
+
+
+ This can only be done if you import the stylesheet in the index.html via a link element. Example implementations are
+ provided below (styling not included).
+
+
+
+
+
View HTML
+
View Typescript
+
+
+
+ Laserfiche
+ Microsoft
+ No Theme
+
+
+
+
+
+
View HTML
+
View Typescript
+
+
+ <select id="theme-selector" (change)="setTheme()">
+ <option value="laserfiche">Laserfiche Theme</option>
+ <option value="microsoft">Microsoft Theme</option>
+ </select>
+
+
+
+
+ setTheme() {
+ const selectElement = (<HTMLSelectElement>document.getElementById('theme-selector'));
+ const themeSelected = selectElement.options[selectElement.selectedIndex].value;
+ if (themeSelected === 'laserfiche') {
+ this.setThemeLaserfiche();
+ }
+ else if (themeSelected === 'microsoft') {
+ this.setThemeMicrosoft();
+ }
+ }
+
+
+
+
+ Laserfiche Theme
+ Microsoft Theme
+
+
+
diff --git a/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.spec.ts b/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.spec.ts
index ed926dfb..db3cff99 100644
--- a/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.spec.ts
+++ b/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.spec.ts
@@ -1,34 +1,29 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { MatCardModule } from '@angular/material/card';
-import { CardComponent } from '../card/card.component';
-
-import { StylingDocumentationComponent } from './styling-documentation.component';
-
-describe('StylingDocumentationComponent', () => {
- let component: StylingDocumentationComponent;
- let fixture: ComponentFixture;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [
- StylingDocumentationComponent,
- CardComponent
- ],
- imports: [ MatCardModule ]
- })
- .compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(StylingDocumentationComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { MatCardModule } from '@angular/material/card';
+import { CardComponent } from '../card/card.component';
+
+import { StylingDocumentationComponent } from './styling-documentation.component';
+
+describe('StylingDocumentationComponent', () => {
+ let component: StylingDocumentationComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [StylingDocumentationComponent, CardComponent, MatCardModule],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(StylingDocumentationComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.ts b/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.ts
index 09ed4922..af958880 100644
--- a/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.ts
+++ b/projects/lf-documentation/src/app/styling-documentation/styling-documentation.component.ts
@@ -1,50 +1,49 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Component } from '@angular/core';
-import { ThemeService } from '../theme.service';
-
-@Component({
- selector: 'app-styling-documentation',
- templateUrl: './styling-documentation.component.html',
- styleUrls: ['./styling-documentation.component.css', './../app.component.css']
-})
-export class StylingDocumentationComponent {
-
- constructor(private themeService: ThemeService) {
- }
-
- showCode(divID: string, tabGroup: string): void {
- const divElement = document.getElementById(divID);
- if (!divElement) {
- console.warn(`showCode: ${divID} not found`);
- return;
- }
-
- if (divElement.style.display === 'none') {
- const tabContent = Array.from(document.getElementsByClassName(tabGroup) as HTMLCollectionOf);
- for (const tab of tabContent) {
- tab.style.display = 'none';
- }
- divElement.style.display = 'block';
- }
- else {
- divElement.style.display = 'none';
- }
- }
-
- setTheme(selectClassName: string): void {
- const selectElement = document.getElementById(selectClassName) as HTMLSelectElement;
- const themeSelected = selectElement.options[selectElement.selectedIndex].value;
- this.changeStylesheet(themeSelected);
- }
-
- changeStylesheet(stylesheetName: string): void {
- this.themeService.changeStylesheet(stylesheetName);
- }
-
- removeTheme(): void {
- this.themeService.removeTheme();
- }
-
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Component, inject } from '@angular/core';
+import { ThemeService } from '../theme.service';
+import { CardComponent } from '../card/card.component';
+
+@Component({
+ selector: 'app-styling-documentation',
+ templateUrl: './styling-documentation.component.html',
+ styleUrls: ['./styling-documentation.component.css', './../app.component.css'],
+ standalone: true,
+ imports: [CardComponent],
+})
+export class StylingDocumentationComponent {
+ private themeService = inject(ThemeService);
+
+ showCode(divID: string, tabGroup: string): void {
+ const divElement = document.getElementById(divID);
+ if (!divElement) {
+ console.warn(`showCode: ${divID} not found`);
+ return;
+ }
+
+ if (divElement.style.display === 'none') {
+ const tabContent = Array.from(document.getElementsByClassName(tabGroup) as HTMLCollectionOf);
+ for (const tab of tabContent) {
+ tab.style.display = 'none';
+ }
+ divElement.style.display = 'block';
+ } else {
+ divElement.style.display = 'none';
+ }
+ }
+
+ setTheme(selectClassName: string): void {
+ const selectElement = document.getElementById(selectClassName) as HTMLSelectElement;
+ const themeSelected = selectElement.options[selectElement.selectedIndex].value;
+ this.changeStylesheet(themeSelected);
+ }
+
+ changeStylesheet(stylesheetName: string): void {
+ this.themeService.changeStylesheet(stylesheetName);
+ }
+
+ removeTheme(): void {
+ this.themeService.removeTheme();
+ }
+}
diff --git a/projects/lf-documentation/src/app/theme.service.spec.ts b/projects/lf-documentation/src/app/theme.service.spec.ts
index c94134cc..608d59e1 100644
--- a/projects/lf-documentation/src/app/theme.service.spec.ts
+++ b/projects/lf-documentation/src/app/theme.service.spec.ts
@@ -1,19 +1,19 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { TestBed } from '@angular/core/testing';
-
-import { ThemeService } from './theme.service';
-
-describe('ThemeService', () => {
- let service: ThemeService;
-
- beforeEach(() => {
- TestBed.configureTestingModule({});
- service = TestBed.inject(ThemeService);
- });
-
- it('should be created', () => {
- expect(service).toBeTruthy();
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { TestBed } from '@angular/core/testing';
+
+import { ThemeService } from './theme.service';
+
+describe('ThemeService', () => {
+ let service: ThemeService;
+
+ beforeEach(() => {
+ TestBed.configureTestingModule({});
+ service = TestBed.inject(ThemeService);
+ });
+
+ it('should be created', () => {
+ expect(service).toBeTruthy();
+ });
+});
diff --git a/projects/lf-documentation/src/app/theme.service.ts b/projects/lf-documentation/src/app/theme.service.ts
index 6ec8bd23..cdf305c4 100644
--- a/projects/lf-documentation/src/app/theme.service.ts
+++ b/projects/lf-documentation/src/app/theme.service.ts
@@ -1,30 +1,28 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Injectable } from '@angular/core';
-
-@Injectable({
- providedIn: 'root'
-})
-export class ThemeService {
-
- constructor() { }
-
- changeStylesheet(stylesheetName: string) {
- if (stylesheetName === 'laserfiche') {
- this.setStyleHref(`./lf-laserfiche-lite.css`);
- }
- else if (stylesheetName === 'microsoft') {
- this.setStyleHref(`./lf-ms-office-lite.css`);
- }
- }
-
- removeTheme() {
- this.setStyleHref('');
- }
-
- private setStyleHref(url: string) {
- const stylesheet = document.getElementById('lf-stylesheet');
- stylesheet?.setAttribute('href', url);
- }
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Injectable } from '@angular/core';
+
+@Injectable({
+ providedIn: 'root',
+})
+export class ThemeService {
+ constructor() {}
+
+ changeStylesheet(stylesheetName: string) {
+ if (stylesheetName === 'laserfiche') {
+ this.setStyleHref(`./lf-laserfiche-lite.css`);
+ } else if (stylesheetName === 'microsoft') {
+ this.setStyleHref(`./lf-ms-office-lite.css`);
+ }
+ }
+
+ removeTheme() {
+ this.setStyleHref('');
+ }
+
+ private setStyleHref(url: string) {
+ const stylesheet = document.getElementById('lf-stylesheet');
+ stylesheet?.setAttribute('href', url);
+ }
+}
diff --git a/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.css b/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.css
index 54ebc887..d265418b 100644
--- a/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.css
+++ b/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.css
@@ -1,7 +1,7 @@
-.level-1-indent {
- margin-left: 25px;
-}
-
-.level-2-indent {
- margin-left: 50px;
-}
+.level-1-indent {
+ margin-left: 25px;
+}
+
+.level-2-indent {
+ margin-left: 50px;
+}
diff --git a/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.html b/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.html
index f5dc2b44..90bd05c0 100644
--- a/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.html
+++ b/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.html
@@ -1,133 +1,133 @@
-
-
-Troubleshooting
-
-
-
-
-
-
- The combination of <ng-content> and ngIf is not recommended by
- Angular , and can sometimes
- make element disappears in the DOM. Try using [hidden] instead of ngIf.
-
-
- Make sure the element initialization happens after ngAfterViewInit. This is to make sure that the initialization
- happens after Angular fully initialized a component's view, which includes the custom element
-
-
-
-
-
-
-
- module.exports = function (config) {
- config.set({
-
- ... files: ["https://lfxstatic.com/Site/laserfiche-ui-components/latest/laserfiche-ui-components.js"]
-
- });
- };
-
-
-
-
- You must use ng-template within the mat-menu or the element will disappear (or the attributes will not be preserved)
- when it is opened more than once.
-
- You can use a nested list within the mat-menu as long as it is within the ng-template
-
-
-
-
- <button
- [matMenuTriggerFor]
- =
- "testMenu"
- >
- Test mat-menu
- </button>
-
-
- <mat-menu
- #testMenu
- =
- "matMenu"
- >
-
-
-
- <ng-template
- matMenuContent
- >
-
-
- <lf-user-feedback
- hosting_module
- =
- "testhostingmodule"
- hosting_context
- =
- "testhostingcontext"
- user_id
- =
- "testuserid"
- account_id
- =
- "testaccountid"
- ></lf-user-feedback>
-
-
- </ng-template>
-
-
- </mat-menu>
-
-
-
-
-
- Test Mat Menu
-
-
-
-
-
-
-
+
+
+Troubleshooting
+
+
+
+
+
+
+ The combination of <ng-content> and ngIf is not recommended by
+ Angular , and can sometimes
+ make element disappears in the DOM. Try using [hidden] instead of ngIf.
+
+
+ Make sure the element initialization happens after ngAfterViewInit. This is to make sure that the initialization
+ happens after Angular fully initialized a component's view, which includes the custom element
+
+
+
+
+
+
+
+ module.exports = function (config) {
+ config.set({
+
+ ... files: ["https://lfxstatic.com/Site/laserfiche-ui-components/latest/laserfiche-ui-components.js"]
+
+ });
+ };
+
+
+
+
+ You must use ng-template within the mat-menu or the element will disappear (or the attributes will not be preserved)
+ when it is opened more than once.
+
+ You can use a nested list within the mat-menu as long as it is within the ng-template
+
+
+
+
+ <button
+ [matMenuTriggerFor]
+ =
+ "testMenu"
+ >
+ Test mat-menu
+ </button>
+
+
+ <mat-menu
+ #testMenu
+ =
+ "matMenu"
+ >
+
+
+
+ <ng-template
+ matMenuContent
+ >
+
+
+ <lf-user-feedback
+ hosting_module
+ =
+ "testhostingmodule"
+ hosting_context
+ =
+ "testhostingcontext"
+ user_id
+ =
+ "testuserid"
+ account_id
+ =
+ "testaccountid"
+ ></lf-user-feedback>
+
+
+ </ng-template>
+
+
+ </mat-menu>
+
+
+
+
+
+ Test Mat Menu
+
+
+
+
+
+
+
diff --git a/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.spec.ts b/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.spec.ts
index 14de59dd..99c0f4f1 100644
--- a/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.spec.ts
+++ b/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.spec.ts
@@ -1,31 +1,29 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { MatMenuModule } from '@angular/material/menu';
-import { CardComponent } from '../card/card.component';
-
-import { TroubleshootingComponent } from './troubleshooting.component';
-
-describe('TroubleshootingComponent', () => {
- let component: TroubleshootingComponent;
- let fixture: ComponentFixture;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [ TroubleshootingComponent, CardComponent ],
- imports: [MatMenuModule]
- })
- .compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(TroubleshootingComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { MatMenuModule } from '@angular/material/menu';
+import { CardComponent } from '../card/card.component';
+
+import { TroubleshootingComponent } from './troubleshooting.component';
+
+describe('TroubleshootingComponent', () => {
+ let component: TroubleshootingComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [TroubleshootingComponent, CardComponent, MatMenuModule],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(TroubleshootingComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.ts b/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.ts
index d0041775..1c1d64bc 100644
--- a/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.ts
+++ b/projects/lf-documentation/src/app/troubleshooting/troubleshooting.component.ts
@@ -1,17 +1,22 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Component, OnInit } from '@angular/core';
-
-@Component({
- selector: 'app-troubleshooting',
- templateUrl: './troubleshooting.component.html',
- styleUrls: ['./troubleshooting.component.css', './../app.component.css']
-})
-export class TroubleshootingComponent {
- testuserid: string = 'test-user-id';
- testaccountid: string = 'test-account-id';
-
- constructor() { }
-
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
+import { CardComponent } from '../card/card.component';
+import { MatMenuModule } from '@angular/material/menu';
+import { LfUserFeedbackComponent } from '../../../../ui-components/projects';
+
+@Component({
+ selector: 'app-troubleshooting',
+ templateUrl: './troubleshooting.component.html',
+ styleUrls: ['./troubleshooting.component.css', './../app.component.css'],
+ standalone: true,
+ imports: [CardComponent, MatMenuModule, LfUserFeedbackComponent],
+ schemas: [CUSTOM_ELEMENTS_SCHEMA],
+})
+export class TroubleshootingComponent {
+ testuserid: string = 'test-user-id';
+ testaccountid: string = 'test-account-id';
+
+ constructor() {}
+}
diff --git a/projects/lf-documentation/src/environments/environment.prod.ts b/projects/lf-documentation/src/environments/environment.prod.ts
index 67aaf48a..3f8768a1 100644
--- a/projects/lf-documentation/src/environments/environment.prod.ts
+++ b/projects/lf-documentation/src/environments/environment.prod.ts
@@ -1,6 +1,6 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-export const environment = {
- production: true
-};
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+export const environment = {
+ production: true,
+};
diff --git a/projects/lf-documentation/src/environments/environment.ts b/projects/lf-documentation/src/environments/environment.ts
index 766bc03d..3b7e0cda 100644
--- a/projects/lf-documentation/src/environments/environment.ts
+++ b/projects/lf-documentation/src/environments/environment.ts
@@ -1,19 +1,10 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-// This file can be replaced during build by using the `fileReplacements` array.
-// `ng build` replaces `environment.ts` with `environment.prod.ts`.
-// The list of file replacements can be found in `angular.json`.
-
-export const environment = {
- production: false
-};
-
-/*
- * For easier debugging in development mode, you can import the following file
- * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
- *
- * This import should be commented out in production mode because it will have a negative impact
- * on performance if an error is thrown.
- */
-// import 'zone.js/plugins/zone-error'; // Included with Angular CLI.
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+// This file can be replaced during build by using the `fileReplacements` array.
+// `ng build` replaces `environment.ts` with `environment.prod.ts`.
+// The list of file replacements can be found in `angular.json`.
+
+export const environment = {
+ production: false,
+};
diff --git a/projects/lf-documentation/src/index.html b/projects/lf-documentation/src/index.html
index 6d0d6bb1..aae9429c 100644
--- a/projects/lf-documentation/src/index.html
+++ b/projects/lf-documentation/src/index.html
@@ -1,25 +1,23 @@
-
-
-
-
-
-
- LfDocumentation
- LfDocumentation
+ = new Map([
['ar-EG', (strings_ar as any).default],
['cs-CZ', (strings_cs as any).default],
@@ -129,8 +127,7 @@ export class AppLocalizationService {
this.internalGetString.next();
}
}
- }
- catch (err: any) {
+ } catch (err: any) {
// Do not log, this will happen on most message events
}
}
@@ -145,7 +142,12 @@ export class AppLocalizationService {
languageChanged(): Observable {
const currentLanguage = this.lfCommonLocalizationService.currentResource?.language;
- return this.internalGetString.pipe(startWith(currentLanguage), map(() => { return this.lfCommonLocalizationService.currentResource?.language; }));
+ return this.internalGetString.pipe(
+ startWith(currentLanguage),
+ map(() => {
+ return this.lfCommonLocalizationService.currentResource?.language;
+ })
+ );
}
get currentLanguage(): string | undefined {
@@ -231,5 +233,4 @@ export class AppLocalizationService {
getString(key: string, params?: string[]): string {
return this.lfCommonLocalizationService.getString(key, params);
}
-
}
diff --git a/projects/ui-components/internal-shared/filter-utils.ts b/projects/ui-components/internal-shared/filter-utils.ts
index 9d99642a..9951197f 100644
--- a/projects/ui-components/internal-shared/filter-utils.ts
+++ b/projects/ui-components/internal-shared/filter-utils.ts
@@ -1,23 +1,25 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-interface ObjectWithName {
- name: string;
-}
-
-/** @internal */
-export function filterObjectsByName(nodesToFilter?: T[], filterText?: string): T[] | undefined {
- if (!filterText) {
- return nodesToFilter;
- }
- else {
- const lowercaseFilterText: string = filterText.toLowerCase();
- return nodesToFilter?.filter(node => {
- if (node.name) {
- const lowercaseName: string = node.name.toLowerCase();
- return lowercaseName.includes(lowercaseFilterText);
- }
- return false;
- });
- }
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+interface ObjectWithName {
+ name: string;
+}
+
+/** @internal */
+export function filterObjectsByName(
+ nodesToFilter?: T[],
+ filterText?: string
+): T[] | undefined {
+ if (!filterText) {
+ return nodesToFilter;
+ } else {
+ const lowercaseFilterText: string = filterText.toLowerCase();
+ return nodesToFilter?.filter((node) => {
+ if (node.name) {
+ const lowercaseName: string = node.name.toLowerCase();
+ return lowercaseName.includes(lowercaseFilterText);
+ }
+ return false;
+ });
+ }
+}
diff --git a/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.html b/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.html
index edb87af4..396a6596 100644
--- a/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.html
+++ b/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.html
@@ -1,16 +1,16 @@
-
-
-
+
+
+
diff --git a/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.spec.ts b/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.spec.ts
index 6a80015a..b7065024 100644
--- a/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.spec.ts
+++ b/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.spec.ts
@@ -1,75 +1,75 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Component, ViewChild, DebugElement } from '@angular/core';
-import { By } from '@angular/platform-browser';
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-
-import { GeneralDialogLayoutComponent } from './general-dialog-layout.component';
-
-@Component({
- selector: 'lf-dialog-layout-tester',
- template: `
-
-
- Content
- Content2
- Content3
-
- `,
-})
-export class DialogLayoutTesterComponent {
- @ViewChild('#layout', /* TODO: add static flag */ {}) layout?: GeneralDialogLayoutComponent;
-}
-
-describe('LfGeneralDialogLayoutComponent UI tests', () => {
- let component: DialogLayoutTesterComponent;
- let fixture: ComponentFixture;
-
- beforeEach(waitForAsync(() => {
- TestBed.configureTestingModule({
- declarations: [ GeneralDialogLayoutComponent, DialogLayoutTesterComponent ]
- })
- .compileComponents();
- }));
-
- beforeEach(() => {
- fixture = TestBed.createComponent(DialogLayoutTesterComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should insert the header div into the LfGeneralDialogLayoutComponent header section', () => {
- expect(fixture.debugElement.query(By.css('.header')).children.length).toBe(2);
- });
-
- it('should insert the content div into the LfGeneralDialogLayoutComponent content section', () => {
- expect(fixture.debugElement.query(By.css('.content-box')).children.length).toBe(3);
- });
-
- it('should insert the footer div into the LfGeneralDialogLayoutComponent footer section', () => {
- expect(fixture.debugElement.query(By.css('.footer')).children.length).toBe(1);
- });
-});
-
-describe('LfGeneralDialogLayoutComponent', () => {
- let component: GeneralDialogLayoutComponent;
- let fixture: ComponentFixture;
-
- beforeEach(waitForAsync(() => {
- TestBed.configureTestingModule({
- declarations: [ GeneralDialogLayoutComponent ]
- })
- .compileComponents();
- }));
-
- beforeEach(() => {
- fixture = TestBed.createComponent(GeneralDialogLayoutComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Component, ViewChild, DebugElement } from '@angular/core';
+import { By } from '@angular/platform-browser';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { GeneralDialogLayoutComponent } from './general-dialog-layout.component';
+
+@Component({
+ selector: 'lf-dialog-layout-tester',
+ template: `
+
+
+ Content
+ Content2
+ Content3
+
+ `,
+ standalone: true,
+ imports: [GeneralDialogLayoutComponent],
+})
+export class DialogLayoutTesterComponent {
+ @ViewChild('#layout', /* TODO: add static flag */ {}) layout?: GeneralDialogLayoutComponent;
+}
+
+describe('LfGeneralDialogLayoutComponent UI tests', () => {
+ let component: DialogLayoutTesterComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [DialogLayoutTesterComponent],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(DialogLayoutTesterComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should insert the header div into the LfGeneralDialogLayoutComponent header section', () => {
+ expect(fixture.debugElement.query(By.css('.header')).children.length).toBe(2);
+ });
+
+ it('should insert the content div into the LfGeneralDialogLayoutComponent content section', () => {
+ expect(fixture.debugElement.query(By.css('.content-box')).children.length).toBe(3);
+ });
+
+ it('should insert the footer div into the LfGeneralDialogLayoutComponent footer section', () => {
+ expect(fixture.debugElement.query(By.css('.footer')).children.length).toBe(1);
+ });
+});
+
+describe('LfGeneralDialogLayoutComponent', () => {
+ let component: GeneralDialogLayoutComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [GeneralDialogLayoutComponent],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(GeneralDialogLayoutComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.ts b/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.ts
index 6f5d992b..ff94dc2d 100644
--- a/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.ts
+++ b/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.component.ts
@@ -1,14 +1,16 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Component } from '@angular/core';
-/**
- * @internal
- * Not for public use
- */
-@Component({
- selector: 'lf-general-dialog-layout',
- templateUrl: './general-dialog-layout.component.html',
- styleUrls: ['./general-dialog-layout.component.css'],
-})
-export class GeneralDialogLayoutComponent {}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Component } from '@angular/core';
+/**
+ * @internal
+ * Not for public use
+ */
+@Component({
+ selector: 'lf-general-dialog-layout',
+ templateUrl: './general-dialog-layout.component.html',
+ styleUrls: ['./general-dialog-layout.component.css'],
+ standalone: true,
+ imports: [],
+})
+export class GeneralDialogLayoutComponent {}
diff --git a/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.module.ts b/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.module.ts
deleted file mode 100644
index 95227348..00000000
--- a/projects/ui-components/internal-shared/general-dialog-layout/general-dialog-layout.module.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { GeneralDialogLayoutComponent } from './general-dialog-layout.component';
-
-/**
- * @internal
- * Not for public use
- */
-@NgModule({
- declarations: [GeneralDialogLayoutComponent],
- imports: [CommonModule],
- providers: [],
- bootstrap: [GeneralDialogLayoutComponent],
- exports: [GeneralDialogLayoutComponent],
- schemas: [CUSTOM_ELEMENTS_SCHEMA],
-})
-export class GeneralDialogLayoutModule { }
diff --git a/projects/ui-components/internal-shared/lf-internal-shared-public-api.ts b/projects/ui-components/internal-shared/lf-internal-shared-public-api.ts
index af8bacce..cb872dc9 100644
--- a/projects/ui-components/internal-shared/lf-internal-shared-public-api.ts
+++ b/projects/ui-components/internal-shared/lf-internal-shared-public-api.ts
@@ -1,20 +1,24 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-export * from './lf-loader/lf-loader.module';
-export * from './lf-loader/lf-loader.component';
-
-export * from './lf-modals/lf-modals.module';
-export * from './lf-modals/lf-popup-modal/lf-popup-modal.component';
-
-export * from './app-localization.service';
-
-export * from './validation-utils';
-
-export * from './filter-utils';
-
-export * from './general-dialog-layout/general-dialog-layout.module';
-export * from './general-dialog-layout/general-dialog-layout.component';
-
-export * from './lf-toast-message/lf-toast-message.module';
-export * from './lf-toast-message/lf-toast-message.component';
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+export { LfLoaderComponent } from './lf-loader/lf-loader.component';
+
+export {
+ LfPopupModalComponent,
+ PopupModalData,
+ PopupModalResult,
+} from './lf-modals/lf-popup-modal/lf-popup-modal.component';
+
+export { AppLocalizationService } from './app-localization.service';
+
+export { ValidationRule, ValidationUtils } from './validation-utils';
+
+export { filterObjectsByName } from './filter-utils';
+
+export { GeneralDialogLayoutComponent } from './general-dialog-layout/general-dialog-layout.component';
+
+export {
+ LfMessageToastTypes,
+ LfToastMessage,
+ LfToastMessageComponent,
+} from './lf-toast-message/lf-toast-message.component';
diff --git a/projects/ui-components/internal-shared/lf-loader/lf-loader.component.css b/projects/ui-components/internal-shared/lf-loader/lf-loader.component.css
index eba4bec0..d71e76cb 100644
--- a/projects/ui-components/internal-shared/lf-loader/lf-loader.component.css
+++ b/projects/ui-components/internal-shared/lf-loader/lf-loader.component.css
@@ -1,65 +1,65 @@
-.lf-loader-text {
- text-overflow: ellipsis;
- overflow: hidden;
- white-space: nowrap;
- vertical-align: middle;
- color: rgb(84,84,84);
- user-select: none;
-}
-
-.loader {
- margin: 0 5px 0 15px;
- background-image: url('https://lfxstatic.com/Site/WA/10.4.2.641_2020-12-31_103500/assets/images/newdoc_sprite.png');
- display: inline-block;
- -moz-animation: spin 2s infinite linear;
- -o-animation: spin 2s infinite linear;
- -webkit-animation: spin 2s infinite linear;
- animation: spin 2s infinite linear;
- width: 16px;
- height: 16px;
- background-position: -76px 0;
- background-repeat: no-repeat;
- line-height: 14px;
- vertical-align: middle;
-}
-
-@-moz-keyframes spin {
- 0% {
- -moz-transform: rotate(0deg);
- }
- 100% {
- -moz-transform: rotate(359deg);
- }
-}
-@-webkit-keyframes spin {
- 0% {
- -webkit-transform: rotate(0deg);
- }
- 100% {
- -webkit-transform: rotate(359deg);
- }
-}
-@-o-keyframes spin {
- 0% {
- -o-transform: rotate(0deg);
- }
- 100% {
- -o-transform: rotate(359deg);
- }
-}
-@-ms-keyframes spin {
- 0% {
- -ms-transform: rotate(0deg);
- }
- 100% {
- -ms-transform: rotate(359deg);
- }
-}
-@keyframes spin {
- 0% {
- transform: rotate(0deg);
- }
- 100% {
- transform: rotate(359deg);
- }
-}
+.lf-loader-text {
+ text-overflow: ellipsis;
+ overflow: hidden;
+ white-space: nowrap;
+ vertical-align: middle;
+ color: rgb(84, 84, 84);
+ user-select: none;
+}
+
+.loader {
+ margin: 0 5px 0 15px;
+ background-image: url("https://lfxstatic.com/Site/WA/10.4.2.641_2020-12-31_103500/assets/images/newdoc_sprite.png");
+ display: inline-block;
+ -moz-animation: spin 2s infinite linear;
+ -o-animation: spin 2s infinite linear;
+ -webkit-animation: spin 2s infinite linear;
+ animation: spin 2s infinite linear;
+ width: 16px;
+ height: 16px;
+ background-position: -76px 0;
+ background-repeat: no-repeat;
+ line-height: 14px;
+ vertical-align: middle;
+}
+
+@-moz-keyframes spin {
+ 0% {
+ -moz-transform: rotate(0deg);
+ }
+ 100% {
+ -moz-transform: rotate(359deg);
+ }
+}
+@-webkit-keyframes spin {
+ 0% {
+ -webkit-transform: rotate(0deg);
+ }
+ 100% {
+ -webkit-transform: rotate(359deg);
+ }
+}
+@-o-keyframes spin {
+ 0% {
+ -o-transform: rotate(0deg);
+ }
+ 100% {
+ -o-transform: rotate(359deg);
+ }
+}
+@-ms-keyframes spin {
+ 0% {
+ -ms-transform: rotate(0deg);
+ }
+ 100% {
+ -ms-transform: rotate(359deg);
+ }
+}
+@keyframes spin {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(359deg);
+ }
+}
diff --git a/projects/ui-components/internal-shared/lf-loader/lf-loader.component.html b/projects/ui-components/internal-shared/lf-loader/lf-loader.component.html
index 905e590e..a73f19c5 100644
--- a/projects/ui-components/internal-shared/lf-loader/lf-loader.component.html
+++ b/projects/ui-components/internal-shared/lf-loader/lf-loader.component.html
@@ -1,5 +1,5 @@
-
-
-{{LOADING | async}}
+
+
+{{ LOADING | async }}
diff --git a/projects/ui-components/internal-shared/lf-loader/lf-loader.component.spec.ts b/projects/ui-components/internal-shared/lf-loader/lf-loader.component.spec.ts
index edfe9c4c..a26b66e4 100644
--- a/projects/ui-components/internal-shared/lf-loader/lf-loader.component.spec.ts
+++ b/projects/ui-components/internal-shared/lf-loader/lf-loader.component.spec.ts
@@ -1,28 +1,27 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { LfLoaderComponent } from './lf-loader.component';
-
-describe('LfLoaderComponent', () => {
- let component: LfLoaderComponent;
- let fixture: ComponentFixture;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [ LfLoaderComponent ]
- })
- .compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(LfLoaderComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LfLoaderComponent } from './lf-loader.component';
+
+describe('LfLoaderComponent', () => {
+ let component: LfLoaderComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [LfLoaderComponent],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(LfLoaderComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/ui-components/internal-shared/lf-loader/lf-loader.component.ts b/projects/ui-components/internal-shared/lf-loader/lf-loader.component.ts
index 3fc27243..8447ed09 100644
--- a/projects/ui-components/internal-shared/lf-loader/lf-loader.component.ts
+++ b/projects/ui-components/internal-shared/lf-loader/lf-loader.component.ts
@@ -1,28 +1,25 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Component } from '@angular/core';
-import { Observable } from 'rxjs';
-import { AppLocalizationService } from '../app-localization.service';
-
-/**
- * @internal
- * Not for public use
- */
-@Component({
- selector: 'lf-loader-component',
- templateUrl: './lf-loader.component.html',
- styleUrls: ['./lf-loader.component.css']
-})
-export class LfLoaderComponent {
-
- /** @internal */
- constructor(
- /**@internal */
- private localizationService: AppLocalizationService
- ) {
- }
-
- readonly LOADING: Observable = this.localizationService.getStringLaserficheObservable('LOADING');
-
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Component, inject } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { Observable } from 'rxjs';
+import { AppLocalizationService } from '../app-localization.service';
+
+/**
+ * @internal
+ * Not for public use
+ */
+@Component({
+ selector: 'lf-loader-component',
+ templateUrl: './lf-loader.component.html',
+ styleUrls: ['./lf-loader.component.css'],
+ standalone: true,
+ imports: [CommonModule],
+})
+export class LfLoaderComponent {
+ /** @internal */
+ private localizationService = inject(AppLocalizationService);
+
+ readonly LOADING: Observable = this.localizationService.getStringLaserficheObservable('LOADING');
+}
diff --git a/projects/ui-components/internal-shared/lf-loader/lf-loader.module.ts b/projects/ui-components/internal-shared/lf-loader/lf-loader.module.ts
deleted file mode 100644
index 2177e34f..00000000
--- a/projects/ui-components/internal-shared/lf-loader/lf-loader.module.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { LfLoaderComponent } from './lf-loader.component';
-
-/**
- * @internal
- * Not for public use
- */
-@NgModule({
- declarations: [LfLoaderComponent],
- imports: [CommonModule],
- providers: [],
- bootstrap: [LfLoaderComponent],
- exports: [LfLoaderComponent],
- schemas: [CUSTOM_ELEMENTS_SCHEMA],
-})
-export class LfLoaderModule { }
diff --git a/projects/ui-components/internal-shared/lf-modals/lf-modals.module.ts b/projects/ui-components/internal-shared/lf-modals/lf-modals.module.ts
deleted file mode 100644
index bef2d754..00000000
--- a/projects/ui-components/internal-shared/lf-modals/lf-modals.module.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { NgModule } from '@angular/core';
-import { LfPopupModalComponent } from './lf-popup-modal/lf-popup-modal.component';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import { FormsModule } from '@angular/forms';
-import { CommonModule } from '@angular/common';
-import { MatInputModule } from '@angular/material/input';
-
-/**
- * @internal
- * Not for public use
- */
-@NgModule({
- declarations: [
- LfPopupModalComponent
- ],
- imports: [
- MatFormFieldModule,
- FormsModule,
- CommonModule,
- MatInputModule,
- ],
- exports: [
- LfPopupModalComponent
- ],
- bootstrap: [
- LfPopupModalComponent
- ]
-})
-export class LfModalsModule { }
diff --git a/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.css b/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.css
index 1fe6629c..cbe85d2a 100644
--- a/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.css
+++ b/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.css
@@ -1,8 +1,8 @@
-.dialog-button {
- float: right;
- margin-left: 10px;
-}
-
-.lf-button.dialog-button {
- min-width: 0px; /* for compatibility with Edge */
-}
+.dialog-button {
+ float: right;
+ margin-left: 10px;
+}
+
+.lf-button.dialog-button {
+ min-width: 0px; /* for compatibility with Edge */
+}
diff --git a/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.html b/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.html
index df52243e..4c117782 100644
--- a/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.html
+++ b/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.html
@@ -1,17 +1,28 @@
-
-
-
-
-
-
{{data.popupMessage | async}}
-
-
- {{data.confirmButtonText | async}}
- {{data.noButtonText | async}}
- {{data.cancelButtonText | async}}
-
-
+
+
+
{{ data.popupMessage | async }}
+
+
+ @if (data.confirmButtonText) {
+
+ {{ data.confirmButtonText | async }}
+
+ }
+ @if (data.noButtonText) {
+
+ {{ data.noButtonText | async }}
+
+ }
+ @if (data.cancelButtonText) {
+
+ {{ data.cancelButtonText | async }}
+
+ }
+
+
;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [ LfPopupModalComponent ]
- })
- .compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(LfPopupModalComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { LfPopupModalComponent } from './lf-popup-modal.component';
+
+describe('LfPopupModalComponent', () => {
+ let component: LfPopupModalComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [LfPopupModalComponent],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(LfPopupModalComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.ts b/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.ts
index a96c535c..961228ed 100644
--- a/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.ts
+++ b/projects/ui-components/internal-shared/lf-modals/lf-popup-modal/lf-popup-modal.component.ts
@@ -1,51 +1,55 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Component, ElementRef, EventEmitter, Input, Output, ViewChild } from '@angular/core';
-import { Observable } from 'rxjs';
-
-/**
- * @internal
- * Not for public use
- */
-@Component({
- selector: 'lf-popup-modal-component',
- templateUrl: './lf-popup-modal.component.html',
- styleUrls: ['./lf-popup-modal.component.css']
-})
-export class LfPopupModalComponent {
- @Input() data!: PopupModalData;
- @Output() buttonClick: EventEmitter = new EventEmitter();
-
- /** @internal */
- onConfirmClick(): void {
- this.buttonClick.emit(PopupModalResult.CONFIRM);
- }
-
- /** @internal */
- onCancelClick(): void {
- this.buttonClick.emit(PopupModalResult.CANCEL);
- }
-
- /** @internal */
- onNoClick(): void {
- this.buttonClick.emit(PopupModalResult.NO);
- }
-}
-
-/** @internal */
-export interface PopupModalData {
- popupTitle: Observable;
- popupMessage: Observable;
- confirmButtonText?: Observable;
- cancelButtonText?: Observable;
- noButtonText?: Observable;
- data?: any;
-}
-
-/** @internal */
-export enum PopupModalResult {
- CONFIRM = 'CONFIRM',
- NO='NO',
- CANCEL='CANCEL'
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Component, ElementRef, EventEmitter, Input, Output, ViewChild } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { CdkTrapFocus } from '@angular/cdk/a11y';
+import { Observable } from 'rxjs';
+
+/**
+ * @internal
+ * Not for public use
+ */
+@Component({
+ selector: 'lf-popup-modal-component',
+ templateUrl: './lf-popup-modal.component.html',
+ styleUrls: ['./lf-popup-modal.component.css'],
+ standalone: true,
+ imports: [CommonModule, CdkTrapFocus],
+})
+export class LfPopupModalComponent {
+ @Input() data!: PopupModalData;
+ @Output() buttonClick: EventEmitter = new EventEmitter();
+
+ /** @internal */
+ onConfirmClick(): void {
+ this.buttonClick.emit(PopupModalResult.CONFIRM);
+ }
+
+ /** @internal */
+ onCancelClick(): void {
+ this.buttonClick.emit(PopupModalResult.CANCEL);
+ }
+
+ /** @internal */
+ onNoClick(): void {
+ this.buttonClick.emit(PopupModalResult.NO);
+ }
+}
+
+/** @internal */
+export interface PopupModalData {
+ popupTitle: Observable;
+ popupMessage: Observable;
+ confirmButtonText?: Observable;
+ cancelButtonText?: Observable;
+ noButtonText?: Observable;
+ data?: any;
+}
+
+/** @internal */
+export enum PopupModalResult {
+ CONFIRM = 'CONFIRM',
+ NO = 'NO',
+ CANCEL = 'CANCEL',
+}
diff --git a/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.css b/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.css
index 3b2a49d1..56649515 100644
--- a/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.css
+++ b/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.css
@@ -1,127 +1,127 @@
-:host {
- pointer-events: none;
-}
-
-:host:not(.relative) {
- display: flex;
- flex-direction: column;
- place-content: center;
- align-items: center;
- position: absolute;
- width: 100%;
- z-index: 9999;
-}
-
-:host(.relative) {
- display: block;
- left: calc(var(--lf-toast-message-offset, 48px) / 2);
- width: 100%;
- z-index: 9999;
-}
-
-:host:not(.bottom-align) {
- top: 10px;
-}
-
-:host(.bottom-align) {
- bottom: 10px;
-}
-
-.lf-flexbox-row {
- display: flex;
- flex-direction: row;
-}
-
-.lf-flexbox-col {
- display: flex;
- flex-direction: column;
-}
-
-.lf-flexbox-center.both-axis {
- align-items: center;
- place-content: center;
-}
-
-.lf-flex-item {
- flex: 1 1 auto;
-}
-
-.hide-icon {
- display: none;
-}
-
-.message-holder {
- margin: 1px 0;
- padding: 8px 8px 8px 20px;
- border-radius: 5px;
- min-width: 300px;
- max-width: 560px;
- cursor: pointer;
- -ms-text-overflow: ellipsis;
- -o-text-overflow: ellipsis;
- text-overflow: ellipsis;
-
- font-weight: 600;
- font-size: 14px;
-
- pointer-events: auto;
-}
-
-.no-left-padding {
- padding-left: 0;
-}
-
-.message-holder.error {
- color: #ab2227;
- background-color: #f7e8e9;
- border: #ab2227 1px solid;
-}
-
-.message-holder.warning {
- background-color: #fff9eb;
- border: #facb5e 1px solid;
-}
-
-.warning {
- color: #333333;
-}
-
-.warningIcon {
- color: #333333;
-}
-
-.message-holder.validation {
- color: #216352;
- background-color: #e8efed;
- border: #216352 1px solid;
-}
-
-.message-holder.informational {
- color: #0058ad;
- background-color: #c1d6eb;
- border: #0058ad 1px solid;
-}
-
-.message-text {
- font-size: 13px;
- font-weight: 600;
- padding: 0 10px;
- white-space: pre-line;
- max-height: 85px;
- overflow-y: auto;
-}
-
-.message-wrapper {
- margin: auto 0;
-}
-
-#close-btn {
- width: 24px;
- height: 24px;
- color: inherit;
- border: none;
- background: inherit;
- cursor: pointer;
- padding: 0;
- pointer-events: all;
-}
\ No newline at end of file
+:host {
+ pointer-events: none;
+}
+
+:host:not(.relative) {
+ display: flex;
+ flex-direction: column;
+ place-content: center;
+ align-items: center;
+ position: absolute;
+ width: 100%;
+ z-index: 9999;
+}
+
+:host(.relative) {
+ display: block;
+ left: calc(var(--lf-toast-message-offset, 48px) / 2);
+ width: 100%;
+ z-index: 9999;
+}
+
+:host:not(.bottom-align) {
+ top: 10px;
+}
+
+:host(.bottom-align) {
+ bottom: 10px;
+}
+
+.lf-flexbox-row {
+ display: flex;
+ flex-direction: row;
+}
+
+.lf-flexbox-col {
+ display: flex;
+ flex-direction: column;
+}
+
+.lf-flexbox-center.both-axis {
+ align-items: center;
+ place-content: center;
+}
+
+.lf-flex-item {
+ flex: 1 1 auto;
+}
+
+.hide-icon {
+ display: none;
+}
+
+.message-holder {
+ margin: 1px 0;
+ padding: 8px 8px 8px 20px;
+ border-radius: 5px;
+ min-width: 300px;
+ max-width: 560px;
+ cursor: pointer;
+ -ms-text-overflow: ellipsis;
+ -o-text-overflow: ellipsis;
+ text-overflow: ellipsis;
+
+ font-weight: 600;
+ font-size: 14px;
+
+ pointer-events: auto;
+}
+
+.no-left-padding {
+ padding-left: 0;
+}
+
+.message-holder.error {
+ color: #ab2227;
+ background-color: #f7e8e9;
+ border: #ab2227 1px solid;
+}
+
+.message-holder.warning {
+ background-color: #fff9eb;
+ border: #facb5e 1px solid;
+}
+
+.warning {
+ color: #333333;
+}
+
+.warningIcon {
+ color: #333333;
+}
+
+.message-holder.validation {
+ color: #216352;
+ background-color: #e8efed;
+ border: #216352 1px solid;
+}
+
+.message-holder.informational {
+ color: #0058ad;
+ background-color: #c1d6eb;
+ border: #0058ad 1px solid;
+}
+
+.message-text {
+ font-size: 13px;
+ font-weight: 600;
+ padding: 0 10px;
+ white-space: pre-line;
+ max-height: 85px;
+ overflow-y: auto;
+}
+
+.message-wrapper {
+ margin: auto 0;
+}
+
+#close-btn {
+ width: 24px;
+ height: 24px;
+ color: inherit;
+ border: none;
+ background: inherit;
+ cursor: pointer;
+ padding: 0;
+ pointer-events: all;
+}
diff --git a/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.html b/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.html
index 2daf1b7d..797c0b1f 100644
--- a/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.html
+++ b/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.html
@@ -1,51 +1,52 @@
-
-
-
-
-
- {{ _computeTypeIcon(message.type) }}
-
-
-
- {{ message.message }}
-
-
-
- close
-
-
-
+
+
+ {{ _computeTypeIcon(message.type) }}
+
+
+
+ {{ message.message }}
+
+
+
+ close
+
+
+
;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [LfToastMessageComponent]
- })
- .compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(LfToastMessageComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-
- it('should add message to the messages array when passed in', () => {
- const message: LfToastMessage = {
- message: 'Test',
- type: LfMessageToastTypes.Error,
- timeToShow: 100,
- noIcon: false,
- hideMessage: false,
- };
- component.messages = [message];
- expect(component.allMessages.length).toBe(1);
- });
-
- it('should add multiple messages to the messages array when passed in', () => {
- const message: LfToastMessage = {
- message: 'Test',
- type: LfMessageToastTypes.Error,
- timeToShow: 100,
- noIcon: false,
- hideMessage: false,
- };
- component.messages = [message, message, message];
- expect(component.allMessages.length).toBe(3);
- });
-
- it('should remove validation and informational after the alloted time', (done) => {
- const timeToShow = 100;
- const validationMessage: LfToastMessage = {
- message: 'Test',
- type: LfMessageToastTypes.Validation,
- timeToShow: timeToShow,
- noIcon: false,
- hideMessage: false,
- };
- const informationalMessage: LfToastMessage = {
- message: 'Test',
- type: LfMessageToastTypes.Informational,
- timeToShow: timeToShow,
- noIcon: false,
- hideMessage: false,
- };
- component.messages = [validationMessage, informationalMessage];
- window.setTimeout(() => {
- expect(component.allMessages.length).toBe(0);
- done();
- }, timeToShow + 100);
- return;
- });
-
- it('should not remove error or warning messages after alloted time', (done) => {
- const timeToShow = 100;
- const errorMessage: LfToastMessage = {
- message: 'Test',
- type: LfMessageToastTypes.Error,
- timeToShow: timeToShow,
- noIcon: false,
- hideMessage: false,
- };
-
- const warningMessage: LfToastMessage = {
- message: 'Test',
- type: LfMessageToastTypes.Warning,
- timeToShow: timeToShow,
- noIcon: false,
- hideMessage: false,
- };
- component.messages = [errorMessage, warningMessage];
- window.setTimeout(() => {
- expect(component.allMessages.length).toBe(2);
- done();
- }, timeToShow + 100);
- return;
- });
-
- it('should remove all messages when clearToasts is called', () => {
- const message: LfToastMessage = {
- message: 'Test',
- type: LfMessageToastTypes.Error,
- timeToShow: 100,
- noIcon: false,
- hideMessage: false,
- };
- component.messages = [message, message, message, message];
- expect(component.allMessages.length).toBe(4);
- component.clearToasts();
- expect(component.allMessages.length).toBe(0);
- });
-
- it('should only clear the messages of toastFilter type when clearToasts is called', () => {
- const errorMessage: LfToastMessage = {
- message: 'Test',
- type: LfMessageToastTypes.Error,
- timeToShow: 100,
- noIcon: false,
- hideMessage: false,
- };
- const validMessage: LfToastMessage = {
- message: 'Test',
- type: LfMessageToastTypes.Validation,
- timeToShow: 100,
- noIcon: false,
- hideMessage: false,
- };
- component.messages = [errorMessage, validMessage, validMessage, validMessage];
- expect(component.allMessages.filter(message => message.type === LfMessageToastTypes.Error).length).toBe(1);
- expect(component.allMessages.filter(message => message.type === LfMessageToastTypes.Validation).length).toBe(3);
- component.clearToasts(LfMessageToastTypes.Validation);
- expect(component.allMessages.length).toBe(1);
- expect(component.allMessages[0].type).toBe(LfMessageToastTypes.Error);
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LfToastMessageComponent, LfMessageToastTypes, LfToastMessage } from './lf-toast-message.component';
+
+describe('LfToastMessageComponent', () => {
+ let component: LfToastMessageComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [LfToastMessageComponent],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(LfToastMessageComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+
+ it('should add message to the messages array when passed in', () => {
+ const message: LfToastMessage = {
+ message: 'Test',
+ type: LfMessageToastTypes.Error,
+ timeToShow: 100,
+ noIcon: false,
+ hideMessage: false,
+ };
+ component.messages = [message];
+ expect(component.allMessages.length).toBe(1);
+ });
+
+ it('should add multiple messages to the messages array when passed in', () => {
+ const message: LfToastMessage = {
+ message: 'Test',
+ type: LfMessageToastTypes.Error,
+ timeToShow: 100,
+ noIcon: false,
+ hideMessage: false,
+ };
+ component.messages = [message, message, message];
+ expect(component.allMessages.length).toBe(3);
+ });
+
+ it('should remove validation and informational after the alloted time', () => {
+ return new Promise((done) => {
+ const timeToShow = 100;
+ const validationMessage: LfToastMessage = {
+ message: 'Test',
+ type: LfMessageToastTypes.Validation,
+ timeToShow: timeToShow,
+ noIcon: false,
+ hideMessage: false,
+ };
+ const informationalMessage: LfToastMessage = {
+ message: 'Test',
+ type: LfMessageToastTypes.Informational,
+ timeToShow: timeToShow,
+ noIcon: false,
+ hideMessage: false,
+ };
+ component.messages = [validationMessage, informationalMessage];
+ window.setTimeout(() => {
+ expect(component.allMessages.length).toBe(0);
+ done();
+ }, timeToShow + 100);
+ });
+ });
+
+ it('should not remove error or warning messages after alloted time', () => {
+ return new Promise((done) => {
+ const timeToShow = 100;
+ const errorMessage: LfToastMessage = {
+ message: 'Test',
+ type: LfMessageToastTypes.Error,
+ timeToShow: timeToShow,
+ noIcon: false,
+ hideMessage: false,
+ };
+
+ const warningMessage: LfToastMessage = {
+ message: 'Test',
+ type: LfMessageToastTypes.Warning,
+ timeToShow: timeToShow,
+ noIcon: false,
+ hideMessage: false,
+ };
+ component.messages = [errorMessage, warningMessage];
+ window.setTimeout(() => {
+ expect(component.allMessages.length).toBe(2);
+ done();
+ }, timeToShow + 100);
+ });
+ });
+
+ it('should remove all messages when clearToasts is called', () => {
+ const message: LfToastMessage = {
+ message: 'Test',
+ type: LfMessageToastTypes.Error,
+ timeToShow: 100,
+ noIcon: false,
+ hideMessage: false,
+ };
+ component.messages = [message, message, message, message];
+ expect(component.allMessages.length).toBe(4);
+ component.clearToasts();
+ expect(component.allMessages.length).toBe(0);
+ });
+
+ it('should only clear the messages of toastFilter type when clearToasts is called', () => {
+ const errorMessage: LfToastMessage = {
+ message: 'Test',
+ type: LfMessageToastTypes.Error,
+ timeToShow: 100,
+ noIcon: false,
+ hideMessage: false,
+ };
+ const validMessage: LfToastMessage = {
+ message: 'Test',
+ type: LfMessageToastTypes.Validation,
+ timeToShow: 100,
+ noIcon: false,
+ hideMessage: false,
+ };
+ component.messages = [errorMessage, validMessage, validMessage, validMessage];
+ expect(component.allMessages.filter((message) => message.type === LfMessageToastTypes.Error).length).toBe(1);
+ expect(component.allMessages.filter((message) => message.type === LfMessageToastTypes.Validation).length).toBe(3);
+ component.clearToasts(LfMessageToastTypes.Validation);
+ expect(component.allMessages.length).toBe(1);
+ expect(component.allMessages[0].type).toBe(LfMessageToastTypes.Error);
+ });
+});
diff --git a/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.ts b/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.ts
index f7a629d0..65909b89 100644
--- a/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.ts
+++ b/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.component.ts
@@ -1,87 +1,100 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Component, Input } from '@angular/core';
-
-/** @internal */
-export enum LfMessageToastTypes {
- Error = 'Error',
- Warning = 'Warning',
- Validation = 'Validation',
- Informational = 'Informational',
-}
-
-/** @internal */
-export interface LfToastMessage {
- message: string;
- timeToShow?: number;
- type: LfMessageToastTypes;
- noIcon: boolean;
- hideMessage?: boolean;
- id?: string;
-}
-
-/** @internal */
-@Component({
- selector: 'lf-toast-message',
- templateUrl: './lf-toast-message.component.html',
- styleUrls: ['./lf-toast-message.component.css'],
-})
-export class LfToastMessageComponent {
- @Input()
- set messages(messages: LfToastMessage[]) {
- if (typeof messages === 'undefined') {
- return;
- }
- for (const message of messages) {
- let messageId = message.id;
- if (!messageId) {
- messageId = message.id = Math.random().toString();
- }
-
- this.allMessages.push(message);
- // Errors and Warnings will not auto dismiss
- if (
- (message.type === LfMessageToastTypes.Validation || message.type === LfMessageToastTypes.Informational) &&
- message.timeToShow &&
- message.timeToShow > 0
- ) {
- window.setTimeout(this._removeToast.bind(this, messageId), message.timeToShow);
- }
- }
- }
-
- allMessages: LfToastMessage[];
-
- constructor() {
- this.allMessages = [];
- }
-
- _computeTypeIcon(type: LfMessageToastTypes): string {
- switch (type) {
- case LfMessageToastTypes.Validation:
- return 'check_circle_outline';
- case LfMessageToastTypes.Warning:
- return 'warning_amber';
- case LfMessageToastTypes.Informational:
- return 'info';
- default:
- return 'error_outline';
- }
- }
-
- _closeToast(messageId: string) {
- this._removeToast(messageId);
- }
-
- _removeToast(messageId: string) {
- const idx = this.allMessages.findIndex((message) => message.id === messageId);
- if (idx !== -1) {
- this.allMessages.splice(idx, 1);
- }
- }
-
- clearToasts(toastFilter?: LfMessageToastTypes) {
- this.allMessages = toastFilter ? this.allMessages.filter((message) => message.type !== toastFilter) : [];
- }
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ChangeDetectorRef, Component, Input, inject } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+/** @internal */
+export enum LfMessageToastTypes {
+ Error = 'Error',
+ Warning = 'Warning',
+ Validation = 'Validation',
+ Informational = 'Informational',
+}
+
+/** @internal */
+export interface LfToastMessage {
+ message: string;
+ timeToShow?: number;
+ type: LfMessageToastTypes;
+ noIcon: boolean;
+ hideMessage?: boolean;
+ id?: string;
+}
+
+/** @internal */
+@Component({
+ selector: 'lf-toast-message',
+ templateUrl: './lf-toast-message.component.html',
+ styleUrls: ['./lf-toast-message.component.css'],
+ standalone: true,
+ imports: [CommonModule],
+})
+export class LfToastMessageComponent {
+ private ref = inject(ChangeDetectorRef);
+
+ @Input()
+ set messages(messages: LfToastMessage[]) {
+ if (typeof messages === 'undefined') {
+ return;
+ }
+ for (const message of messages) {
+ let messageId = message.id;
+ if (!messageId) {
+ messageId = message.id = Math.random().toString();
+ }
+
+ this.allMessages.push(message);
+ // Errors and Warnings will not auto dismiss
+ if (
+ (message.type === LfMessageToastTypes.Validation || message.type === LfMessageToastTypes.Informational) &&
+ message.timeToShow &&
+ message.timeToShow > 0
+ ) {
+ window.setTimeout(this._removeToast.bind(this, messageId), message.timeToShow);
+ }
+ }
+ }
+
+ allMessages: LfToastMessage[];
+
+ constructor() {
+ this.allMessages = [];
+ }
+
+ _computeTypeIcon(type: LfMessageToastTypes): string {
+ switch (type) {
+ case LfMessageToastTypes.Validation:
+ return 'check_circle_outline';
+ case LfMessageToastTypes.Warning:
+ return 'warning_amber';
+ case LfMessageToastTypes.Informational:
+ return 'info';
+ default:
+ return 'error_outline';
+ }
+ }
+
+ _closeToast(messageId?: string) {
+ if (!messageId) {
+ return;
+ }
+ this._removeToast(messageId);
+ }
+
+ _removeToast(messageId?: string) {
+ if (!messageId) {
+ return;
+ }
+ const idx = this.allMessages.findIndex((message) => message.id === messageId);
+ if (idx !== -1) {
+ this.allMessages.splice(idx, 1);
+ this.ref.markForCheck();
+ }
+ }
+
+ clearToasts(toastFilter?: LfMessageToastTypes) {
+ this.allMessages = toastFilter ? this.allMessages.filter((message) => message.type !== toastFilter) : [];
+ this.ref.markForCheck();
+ }
+}
diff --git a/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.module.ts b/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.module.ts
deleted file mode 100644
index 451c6869..00000000
--- a/projects/ui-components/internal-shared/lf-toast-message/lf-toast-message.module.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { LfToastMessageComponent } from './lf-toast-message.component';
-/**
- * @internal
- * Not for public use
- */
-@NgModule({
- declarations: [LfToastMessageComponent],
- imports: [CommonModule],
- providers: [],
- bootstrap: [LfToastMessageComponent],
- exports: [LfToastMessageComponent],
- schemas: [CUSTOM_ELEMENTS_SCHEMA],
-})
-export class LfToastMessageModule { }
diff --git a/projects/ui-components/internal-shared/ng-package.json b/projects/ui-components/internal-shared/ng-package.json
index b2de6a0c..1127c140 100644
--- a/projects/ui-components/internal-shared/ng-package.json
+++ b/projects/ui-components/internal-shared/ng-package.json
@@ -1,5 +1,6 @@
{
+ "$schema": "../../../node_modules/ng-packagr/ng-package.schema.json",
"lib": {
- "entryFile": "./lf-internal-shared-public-api.ts"
+ "entryFile": "./lf-internal-shared-public-api.ts"
}
}
diff --git a/projects/ui-components/internal-shared/strings/ar.json b/projects/ui-components/internal-shared/strings/ar.json
index 09a64254..e861f62c 100644
--- a/projects/ui-components/internal-shared/strings/ar.json
+++ b/projects/ui-components/internal-shared/strings/ar.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "ستساعدنا ملاحظاتك واقتراحاتك في تحسين منتجاتنا وخدماتنا.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "إذا كانت لديك مشكلة فنية أو مشكلة في الدعم، أو كنت بحاجة إلى مساعدة فورية، فيرجى الاتصال بمسؤول Laserfiche أو مزود الحلول كما هو موضح في اتفاقية الخدمة الخاصة بك.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "هل وجدت شيئا يعجبك أو لا يعجبك؟ اسمحوا لنا أن نعرف عنها.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "هل لديك فكرة عن ميزة جديدة أو تحسين؟ نتطلع إلى سماع ذلك.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "يرجى عدم تضمين أي معلومات سرية أو شخصية في ملاحظاتك",
- "TELL_US_ABOUT_EXPERIENCE": "أخبرنا عن تجربتك",
- "TELL_US_ABOUT_IDEA": "أخبرنا عن فكرتك",
- "I_HAVE_FEEDBACK": "لدي ملاحظات",
- "I_HAVE_SUGGESTION": "لدي اقتراح",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "يمكنك الاتصال بي بخصوص هذه الملاحظات",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "إذا كنت ترغب في الانضمام إلى لوحة العملاء الخاصة بنا ،",
- "PLEASE_CLICK_HERE": "الرجاء الضغط هنا.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "تتجاوز الصورة الحد الأقصى لحجم الملف {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "الصورة تالفة أو بتنسيق غير معروف.",
- "ACCEPTED_FORMATS_ARE_0": "التنسيقات المقبولة هي: {0}.",
- "IMAGE_NOT_ATTACHED": "الصورة غير مرفقة.",
- "ATTACH_IMAGE": "إرفاق الصورة",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "يرجى إرفاق صورة واحدة فقط."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "ستساعدنا ملاحظاتك واقتراحاتك في تحسين منتجاتنا وخدماتنا.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "إذا كانت لديك مشكلة فنية أو مشكلة في الدعم، أو كنت بحاجة إلى مساعدة فورية، فيرجى الاتصال بمسؤول Laserfiche أو مزود الحلول كما هو موضح في اتفاقية الخدمة الخاصة بك.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "هل وجدت شيئا يعجبك أو لا يعجبك؟ اسمحوا لنا أن نعرف عنها.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "هل لديك فكرة عن ميزة جديدة أو تحسين؟ نتطلع إلى سماع ذلك.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "يرجى عدم تضمين أي معلومات سرية أو شخصية في ملاحظاتك",
+ "TELL_US_ABOUT_EXPERIENCE": "أخبرنا عن تجربتك",
+ "TELL_US_ABOUT_IDEA": "أخبرنا عن فكرتك",
+ "I_HAVE_FEEDBACK": "لدي ملاحظات",
+ "I_HAVE_SUGGESTION": "لدي اقتراح",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "يمكنك الاتصال بي بخصوص هذه الملاحظات",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "إذا كنت ترغب في الانضمام إلى لوحة العملاء الخاصة بنا ،",
+ "PLEASE_CLICK_HERE": "الرجاء الضغط هنا.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "تتجاوز الصورة الحد الأقصى لحجم الملف {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "الصورة تالفة أو بتنسيق غير معروف.",
+ "ACCEPTED_FORMATS_ARE_0": "التنسيقات المقبولة هي: {0}.",
+ "IMAGE_NOT_ATTACHED": "الصورة غير مرفقة.",
+ "ATTACH_IMAGE": "إرفاق الصورة",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "يرجى إرفاق صورة واحدة فقط."
+}
diff --git a/projects/ui-components/internal-shared/strings/cs.json b/projects/ui-components/internal-shared/strings/cs.json
index 29978dd9..9fdce2a8 100644
--- a/projects/ui-components/internal-shared/strings/cs.json
+++ b/projects/ui-components/internal-shared/strings/cs.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Vaše zpětná vazba a návrhy nám pomohou zlepšit náš produkt a služby.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Pokud máte technický nebo podpůrný problém, nebo potřebujete okamžitou pomoc, kontaktujte prosím svého Laserfiche administrátora nebo poskytovatele řešení, jak je uvedeno ve vaší servisní smlouvě.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Našli jste něco, co se vám líbí nebo nelíbí? Dejte nám o tom vědět.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Máte nápad na novou funkci nebo vylepšení? Těšíme se, až se o něm dozvíme.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Do své zpětné vazby prosím nezahrnujte žádné důvěrné nebo osobní informace",
- "TELL_US_ABOUT_EXPERIENCE": "Řekněte nám o svých zkušenostech",
- "TELL_US_ABOUT_IDEA": "Řekněte nám o svém nápadu",
- "I_HAVE_FEEDBACK": "Mám zpětnou vazbu",
- "I_HAVE_SUGGESTION": "Mám návrh",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Můžete mě kontaktovat ohledně této zpětné vazby",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Pokud byste se chtěli připojit k našemu zákaznickému panelu,",
- "PLEASE_CLICK_HERE": "klikněte prosím zde.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Obrázek překračuje maximální velikost souboru {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Obrázek je poškozený nebo ve formátu, který není rozpoznán.",
- "ACCEPTED_FORMATS_ARE_0": "Přijaté formáty jsou: {0}.",
- "IMAGE_NOT_ATTACHED": "Obrázek nebyl připojen.",
- "ATTACH_IMAGE": "Připojit obrázek",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Připojte prosím pouze jeden obrázek."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Vaše zpětná vazba a návrhy nám pomohou zlepšit náš produkt a služby.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Pokud máte technický nebo podpůrný problém, nebo potřebujete okamžitou pomoc, kontaktujte prosím svého Laserfiche administrátora nebo poskytovatele řešení, jak je uvedeno ve vaší servisní smlouvě.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Našli jste něco, co se vám líbí nebo nelíbí? Dejte nám o tom vědět.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Máte nápad na novou funkci nebo vylepšení? Těšíme se, až se o něm dozvíme.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Do své zpětné vazby prosím nezahrnujte žádné důvěrné nebo osobní informace",
+ "TELL_US_ABOUT_EXPERIENCE": "Řekněte nám o svých zkušenostech",
+ "TELL_US_ABOUT_IDEA": "Řekněte nám o svém nápadu",
+ "I_HAVE_FEEDBACK": "Mám zpětnou vazbu",
+ "I_HAVE_SUGGESTION": "Mám návrh",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Můžete mě kontaktovat ohledně této zpětné vazby",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Pokud byste se chtěli připojit k našemu zákaznickému panelu,",
+ "PLEASE_CLICK_HERE": "klikněte prosím zde.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Obrázek překračuje maximální velikost souboru {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Obrázek je poškozený nebo ve formátu, který není rozpoznán.",
+ "ACCEPTED_FORMATS_ARE_0": "Přijaté formáty jsou: {0}.",
+ "IMAGE_NOT_ATTACHED": "Obrázek nebyl připojen.",
+ "ATTACH_IMAGE": "Připojit obrázek",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Připojte prosím pouze jeden obrázek."
+}
diff --git a/projects/ui-components/internal-shared/strings/de.json b/projects/ui-components/internal-shared/strings/de.json
index ca06421e..7698c690 100644
--- a/projects/ui-components/internal-shared/strings/de.json
+++ b/projects/ui-components/internal-shared/strings/de.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Ihr Feedback und Ihre Vorschläge helfen uns, unser Produkt und unsere Dienstleistungen zu verbessern.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Wenn Sie ein technisches Problem oder Support benötigen oder sofortige Hilfe brauchen, wenden Sie sich bitte an Ihren Laserfiche-Administrator oder Lösungspartner, wie in Ihrem Servicevertrag angegeben.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Haben Sie etwas gefunden, das Ihnen gefällt oder nicht gefällt? Lassen Sie es uns wissen.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Haben Sie eine Idee für eine neue Funktion oder eine Verbesserung? Wir freuen uns darauf, davon zu hören.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Bitte fügen Sie in Ihrem Feedback keine vertraulichen oder persönlichen Informationen ein.",
- "TELL_US_ABOUT_EXPERIENCE": "Berichten Sie uns von Ihren Erfahrungen",
- "TELL_US_ABOUT_IDEA": "Berichten Sie uns von Ihrer Idee",
- "I_HAVE_FEEDBACK": "Ich habe Rückmeldungen",
- "I_HAVE_SUGGESTION": "Ich habe einen Vorschlag",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Sie können mich bezüglich dieses Feedbacks kontaktieren",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Wenn Sie unserem Kundenpanel beitreten möchten,",
- "PLEASE_CLICK_HERE": "Bitte klicken Sie hier.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Das Bild überschreitet die maximale Dateigröße von {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Das Bild ist beschädigt oder in einem nicht erkannten Format.",
- "ACCEPTED_FORMATS_ARE_0": "Die akzeptierten Formate sind: {0}.",
- "IMAGE_NOT_ATTACHED": "Bild nicht angehängt.",
- "ATTACH_IMAGE": "Bild anhängen",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Bitte fügen Sie nur ein Bild an."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Ihr Feedback und Ihre Vorschläge helfen uns, unser Produkt und unsere Dienstleistungen zu verbessern.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Wenn Sie ein technisches Problem oder Support benötigen oder sofortige Hilfe brauchen, wenden Sie sich bitte an Ihren Laserfiche-Administrator oder Lösungspartner, wie in Ihrem Servicevertrag angegeben.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Haben Sie etwas gefunden, das Ihnen gefällt oder nicht gefällt? Lassen Sie es uns wissen.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Haben Sie eine Idee für eine neue Funktion oder eine Verbesserung? Wir freuen uns darauf, davon zu hören.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Bitte fügen Sie in Ihrem Feedback keine vertraulichen oder persönlichen Informationen ein.",
+ "TELL_US_ABOUT_EXPERIENCE": "Berichten Sie uns von Ihren Erfahrungen",
+ "TELL_US_ABOUT_IDEA": "Berichten Sie uns von Ihrer Idee",
+ "I_HAVE_FEEDBACK": "Ich habe Rückmeldungen",
+ "I_HAVE_SUGGESTION": "Ich habe einen Vorschlag",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Sie können mich bezüglich dieses Feedbacks kontaktieren",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Wenn Sie unserem Kundenpanel beitreten möchten,",
+ "PLEASE_CLICK_HERE": "Bitte klicken Sie hier.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Das Bild überschreitet die maximale Dateigröße von {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Das Bild ist beschädigt oder in einem nicht erkannten Format.",
+ "ACCEPTED_FORMATS_ARE_0": "Die akzeptierten Formate sind: {0}.",
+ "IMAGE_NOT_ATTACHED": "Bild nicht angehängt.",
+ "ATTACH_IMAGE": "Bild anhängen",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Bitte fügen Sie nur ein Bild an."
+}
diff --git a/projects/ui-components/internal-shared/strings/el.json b/projects/ui-components/internal-shared/strings/el.json
index f6158825..967daa98 100644
--- a/projects/ui-components/internal-shared/strings/el.json
+++ b/projects/ui-components/internal-shared/strings/el.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Τα σχόλια και οι προτάσεις σας θα μας βοηθήσουν να βελτιώσουμε το προϊόν και τις υπηρεσίες μας.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Εάν αντιμετωπίζετε τεχνικό ή υποστηρικτικό πρόβλημα ή χρειάζεστε άμεση βοήθεια, παρακαλώ επικοινωνήστε με τον Διαχειριστή Laserfiche ή τον Πάροχο Λύσεων όπως αναφέρεται στη συμφωνία υπηρεσιών σας.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Βρήκατε κάτι που σας αρέσει ή δεν σας αρέσει; Ενημερώστε μας γι' αυτό.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Έχετε μια ιδέα για μια νέα λειτουργία ή βελτίωση; Ανυπομονούμε να την ακούσουμε.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Παρακαλούμε μην συμπεριλάβετε εμπιστευτικές ή προσωπικές πληροφορίες στα σχόλιά σας",
- "TELL_US_ABOUT_EXPERIENCE": "Πείτε μας για την εμπειρία σας",
- "TELL_US_ABOUT_IDEA": "Πείτε μας για την ιδέα σας",
- "I_HAVE_FEEDBACK": "Έχω σχόλια",
- "I_HAVE_SUGGESTION": "Έχω μια πρόταση",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Μπορείτε να επικοινωνήσετε μαζί μου σχετικά με αυτά τα σχόλια",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Εάν επιθυμείτε να συμμετάσχετε στην Επιτροπή Πελατών μας,",
- "PLEASE_CLICK_HERE": "παρακαλώ κάντε κλικ εδώ.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Η εικόνα υπερβαίνει το μέγιστο μέγεθος αρχείου των {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Η εικόνα είναι κατεστραμμένη ή σε μη αναγνωρισμένη μορφή.",
- "ACCEPTED_FORMATS_ARE_0": "Οι αποδεκτές μορφές είναι: {0}.",
- "IMAGE_NOT_ATTACHED": "Η εικόνα δεν επισυνάφθηκε.",
- "ATTACH_IMAGE": "Επισύναψη εικόνας",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Παρακαλώ επισυνάψτε μόνο μία εικόνα."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Τα σχόλια και οι προτάσεις σας θα μας βοηθήσουν να βελτιώσουμε το προϊόν και τις υπηρεσίες μας.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Εάν αντιμετωπίζετε τεχνικό ή υποστηρικτικό πρόβλημα ή χρειάζεστε άμεση βοήθεια, παρακαλώ επικοινωνήστε με τον Διαχειριστή Laserfiche ή τον Πάροχο Λύσεων όπως αναφέρεται στη συμφωνία υπηρεσιών σας.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Βρήκατε κάτι που σας αρέσει ή δεν σας αρέσει; Ενημερώστε μας γι' αυτό.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Έχετε μια ιδέα για μια νέα λειτουργία ή βελτίωση; Ανυπομονούμε να την ακούσουμε.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Παρακαλούμε μην συμπεριλάβετε εμπιστευτικές ή προσωπικές πληροφορίες στα σχόλιά σας",
+ "TELL_US_ABOUT_EXPERIENCE": "Πείτε μας για την εμπειρία σας",
+ "TELL_US_ABOUT_IDEA": "Πείτε μας για την ιδέα σας",
+ "I_HAVE_FEEDBACK": "Έχω σχόλια",
+ "I_HAVE_SUGGESTION": "Έχω μια πρόταση",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Μπορείτε να επικοινωνήσετε μαζί μου σχετικά με αυτά τα σχόλια",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Εάν επιθυμείτε να συμμετάσχετε στην Επιτροπή Πελατών μας,",
+ "PLEASE_CLICK_HERE": "παρακαλώ κάντε κλικ εδώ.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Η εικόνα υπερβαίνει το μέγιστο μέγεθος αρχείου των {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Η εικόνα είναι κατεστραμμένη ή σε μη αναγνωρισμένη μορφή.",
+ "ACCEPTED_FORMATS_ARE_0": "Οι αποδεκτές μορφές είναι: {0}.",
+ "IMAGE_NOT_ATTACHED": "Η εικόνα δεν επισυνάφθηκε.",
+ "ATTACH_IMAGE": "Επισύναψη εικόνας",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Παρακαλώ επισυνάψτε μόνο μία εικόνα."
+}
diff --git a/projects/ui-components/internal-shared/strings/en.json b/projects/ui-components/internal-shared/strings/en.json
index 6d17b715..e5bd31c9 100644
--- a/projects/ui-components/internal-shared/strings/en.json
+++ b/projects/ui-components/internal-shared/strings/en.json
@@ -16,5 +16,9 @@
"ACCEPTED_FORMATS_ARE_0": "The accepted formats are: {0}.",
"IMAGE_NOT_ATTACHED": "Image not attached.",
"ATTACH_IMAGE": "Attach Image",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Please attach only one image."
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Please attach only one image.",
+ "TAGS": "Tags",
+ "ADD_TAGS": "Add tags",
+ "ADD_MORE_TAGS": "Add more tags",
+ "NO_TAGS_AVAILABLE": "No tags available"
}
diff --git a/projects/ui-components/internal-shared/strings/es.json b/projects/ui-components/internal-shared/strings/es.json
index 18d4a17c..97ca9878 100644
--- a/projects/ui-components/internal-shared/strings/es.json
+++ b/projects/ui-components/internal-shared/strings/es.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Sus comentarios y sugerencias nos ayudarán a mejorar nuestro producto y servicios.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Si tiene un problema técnico o de soporte, o requiere asistencia inmediata, por favor contacte a su Administrador de Laserfiche o Proveedor de Soluciones según lo indicado en su contrato de servicio.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "¿Encontró algo que le guste o disguste? Háganoslo saber.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "¿Tiene una idea para una nueva función o una mejora? Esperamos conocerla.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Por favor, no incluya información confidencial o personal en sus comentarios",
- "TELL_US_ABOUT_EXPERIENCE": "Cuéntenos sobre su experiencia",
- "TELL_US_ABOUT_IDEA": "Cuéntenos sobre su idea",
- "I_HAVE_FEEDBACK": "Tengo comentarios",
- "I_HAVE_SUGGESTION": "Tengo una sugerencia",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Puede contactarme respecto a este comentario",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Si desea unirse a nuestro Panel de Clientes,",
- "PLEASE_CLICK_HERE": "por favor haga clic aquí.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "La imagen excede el tamaño máximo de archivo de {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "La imagen está dañada o en un formato no reconocido.",
- "ACCEPTED_FORMATS_ARE_0": "Los formatos aceptados son: {0}.",
- "IMAGE_NOT_ATTACHED": "Imagen no adjuntada.",
- "ATTACH_IMAGE": "Adjuntar imagen",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Por favor, adjunte solo una imagen."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Sus comentarios y sugerencias nos ayudarán a mejorar nuestro producto y servicios.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Si tiene un problema técnico o de soporte, o requiere asistencia inmediata, por favor contacte a su Administrador de Laserfiche o Proveedor de Soluciones según lo indicado en su contrato de servicio.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "¿Encontró algo que le guste o disguste? Háganoslo saber.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "¿Tiene una idea para una nueva función o una mejora? Esperamos conocerla.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Por favor, no incluya información confidencial o personal en sus comentarios",
+ "TELL_US_ABOUT_EXPERIENCE": "Cuéntenos sobre su experiencia",
+ "TELL_US_ABOUT_IDEA": "Cuéntenos sobre su idea",
+ "I_HAVE_FEEDBACK": "Tengo comentarios",
+ "I_HAVE_SUGGESTION": "Tengo una sugerencia",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Puede contactarme respecto a este comentario",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Si desea unirse a nuestro Panel de Clientes,",
+ "PLEASE_CLICK_HERE": "por favor haga clic aquí.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "La imagen excede el tamaño máximo de archivo de {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "La imagen está dañada o en un formato no reconocido.",
+ "ACCEPTED_FORMATS_ARE_0": "Los formatos aceptados son: {0}.",
+ "IMAGE_NOT_ATTACHED": "Imagen no adjuntada.",
+ "ATTACH_IMAGE": "Adjuntar imagen",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Por favor, adjunte solo una imagen."
+}
diff --git a/projects/ui-components/internal-shared/strings/fr-FR.json b/projects/ui-components/internal-shared/strings/fr-FR.json
index f0de5255..d381559c 100644
--- a/projects/ui-components/internal-shared/strings/fr-FR.json
+++ b/projects/ui-components/internal-shared/strings/fr-FR.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Vos commentaires et suggestions nous aideront à améliorer notre produit et nos services.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Si vous avez un problème technique ou de support, ou si vous avez besoin d'une assistance immédiate, veuillez contacter votre administrateur Laserfiche ou votre fournisseur de solutions comme indiqué dans votre contrat de service.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Vous avez trouvé quelque chose que vous aimez ou n'aimez pas ? Faites-le nous savoir.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Avez-vous une idée pour une nouvelle fonctionnalité ou une amélioration ? Nous sommes impatients de l'entendre.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Veuillez ne pas inclure d'informations confidentielles ou personnelles dans vos commentaires",
- "TELL_US_ABOUT_EXPERIENCE": "Parlez-nous de votre expérience",
- "TELL_US_ABOUT_IDEA": "Parlez-nous de votre idée",
- "I_HAVE_FEEDBACK": "J'ai des commentaires",
- "I_HAVE_SUGGESTION": "J'ai une suggestion",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Vous pouvez me contacter à propos de ces commentaires",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Si vous souhaitez rejoindre notre panel de clients,",
- "PLEASE_CLICK_HERE": "veuillez cliquer ici.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "L'image dépasse la taille maximale de fichier de {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "L'image est corrompue ou dans un format non reconnu.",
- "ACCEPTED_FORMATS_ARE_0": "Les formats acceptés sont : {0}.",
- "IMAGE_NOT_ATTACHED": "Image non jointe.",
- "ATTACH_IMAGE": "Joindre une image",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Veuillez joindre une seule image."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Vos commentaires et suggestions nous aideront à améliorer notre produit et nos services.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Si vous avez un problème technique ou de support, ou si vous avez besoin d'une assistance immédiate, veuillez contacter votre administrateur Laserfiche ou votre fournisseur de solutions comme indiqué dans votre contrat de service.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Vous avez trouvé quelque chose que vous aimez ou n'aimez pas ? Faites-le nous savoir.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Avez-vous une idée pour une nouvelle fonctionnalité ou une amélioration ? Nous sommes impatients de l'entendre.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Veuillez ne pas inclure d'informations confidentielles ou personnelles dans vos commentaires",
+ "TELL_US_ABOUT_EXPERIENCE": "Parlez-nous de votre expérience",
+ "TELL_US_ABOUT_IDEA": "Parlez-nous de votre idée",
+ "I_HAVE_FEEDBACK": "J'ai des commentaires",
+ "I_HAVE_SUGGESTION": "J'ai une suggestion",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Vous pouvez me contacter à propos de ces commentaires",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Si vous souhaitez rejoindre notre panel de clients,",
+ "PLEASE_CLICK_HERE": "veuillez cliquer ici.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "L'image dépasse la taille maximale de fichier de {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "L'image est corrompue ou dans un format non reconnu.",
+ "ACCEPTED_FORMATS_ARE_0": "Les formats acceptés sont : {0}.",
+ "IMAGE_NOT_ATTACHED": "Image non jointe.",
+ "ATTACH_IMAGE": "Joindre une image",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Veuillez joindre une seule image."
+}
diff --git a/projects/ui-components/internal-shared/strings/fr.json b/projects/ui-components/internal-shared/strings/fr.json
index f0de5255..d381559c 100644
--- a/projects/ui-components/internal-shared/strings/fr.json
+++ b/projects/ui-components/internal-shared/strings/fr.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Vos commentaires et suggestions nous aideront à améliorer notre produit et nos services.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Si vous avez un problème technique ou de support, ou si vous avez besoin d'une assistance immédiate, veuillez contacter votre administrateur Laserfiche ou votre fournisseur de solutions comme indiqué dans votre contrat de service.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Vous avez trouvé quelque chose que vous aimez ou n'aimez pas ? Faites-le nous savoir.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Avez-vous une idée pour une nouvelle fonctionnalité ou une amélioration ? Nous sommes impatients de l'entendre.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Veuillez ne pas inclure d'informations confidentielles ou personnelles dans vos commentaires",
- "TELL_US_ABOUT_EXPERIENCE": "Parlez-nous de votre expérience",
- "TELL_US_ABOUT_IDEA": "Parlez-nous de votre idée",
- "I_HAVE_FEEDBACK": "J'ai des commentaires",
- "I_HAVE_SUGGESTION": "J'ai une suggestion",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Vous pouvez me contacter à propos de ces commentaires",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Si vous souhaitez rejoindre notre panel de clients,",
- "PLEASE_CLICK_HERE": "veuillez cliquer ici.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "L'image dépasse la taille maximale de fichier de {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "L'image est corrompue ou dans un format non reconnu.",
- "ACCEPTED_FORMATS_ARE_0": "Les formats acceptés sont : {0}.",
- "IMAGE_NOT_ATTACHED": "Image non jointe.",
- "ATTACH_IMAGE": "Joindre une image",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Veuillez joindre une seule image."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Vos commentaires et suggestions nous aideront à améliorer notre produit et nos services.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Si vous avez un problème technique ou de support, ou si vous avez besoin d'une assistance immédiate, veuillez contacter votre administrateur Laserfiche ou votre fournisseur de solutions comme indiqué dans votre contrat de service.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Vous avez trouvé quelque chose que vous aimez ou n'aimez pas ? Faites-le nous savoir.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Avez-vous une idée pour une nouvelle fonctionnalité ou une amélioration ? Nous sommes impatients de l'entendre.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Veuillez ne pas inclure d'informations confidentielles ou personnelles dans vos commentaires",
+ "TELL_US_ABOUT_EXPERIENCE": "Parlez-nous de votre expérience",
+ "TELL_US_ABOUT_IDEA": "Parlez-nous de votre idée",
+ "I_HAVE_FEEDBACK": "J'ai des commentaires",
+ "I_HAVE_SUGGESTION": "J'ai une suggestion",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Vous pouvez me contacter à propos de ces commentaires",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Si vous souhaitez rejoindre notre panel de clients,",
+ "PLEASE_CLICK_HERE": "veuillez cliquer ici.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "L'image dépasse la taille maximale de fichier de {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "L'image est corrompue ou dans un format non reconnu.",
+ "ACCEPTED_FORMATS_ARE_0": "Les formats acceptés sont : {0}.",
+ "IMAGE_NOT_ATTACHED": "Image non jointe.",
+ "ATTACH_IMAGE": "Joindre une image",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Veuillez joindre une seule image."
+}
diff --git a/projects/ui-components/internal-shared/strings/id.json b/projects/ui-components/internal-shared/strings/id.json
index 2761b7f7..51d5e656 100644
--- a/projects/ui-components/internal-shared/strings/id.json
+++ b/projects/ui-components/internal-shared/strings/id.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Umpan balik dan saran Anda akan membantu kami meningkatkan produk dan layanan kami.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Jika Anda memiliki masalah teknis atau dukungan, atau memerlukan bantuan segera, harap hubungi Administrator Laserfiche Anda atau Penyedia Solusi seperti yang tercantum dalam perjanjian layanan Anda.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Menemukan sesuatu yang Anda suka atau tidak suka? Beri tahu kami tentang hal itu.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Apakah Anda memiliki ide untuk fitur baru atau perbaikan? Kami menantikan untuk mendengarnya.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Harap jangan sertakan informasi rahasia atau pribadi dalam umpan balik Anda",
- "TELL_US_ABOUT_EXPERIENCE": "Ceritakan kepada kami tentang pengalaman Anda",
- "TELL_US_ABOUT_IDEA": "Ceritakan kepada kami tentang ide Anda",
- "I_HAVE_FEEDBACK": "Saya memiliki umpan balik",
- "I_HAVE_SUGGESTION": "Saya memiliki saran",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Anda dapat menghubungi saya mengenai umpan balik ini",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Jika Anda ingin bergabung dengan Panel Pelanggan kami,",
- "PLEASE_CLICK_HERE": "silakan klik di sini.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Gambar melebihi ukuran file maksimum sebesar {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Gambar rusak atau dalam format yang tidak dikenali.",
- "ACCEPTED_FORMATS_ARE_0": "Format yang diterima adalah: {0}.",
- "IMAGE_NOT_ATTACHED": "Gambar tidak dilampirkan.",
- "ATTACH_IMAGE": "Lampirkan Gambar",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Harap lampirkan hanya satu gambar."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Umpan balik dan saran Anda akan membantu kami meningkatkan produk dan layanan kami.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Jika Anda memiliki masalah teknis atau dukungan, atau memerlukan bantuan segera, harap hubungi Administrator Laserfiche Anda atau Penyedia Solusi seperti yang tercantum dalam perjanjian layanan Anda.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Menemukan sesuatu yang Anda suka atau tidak suka? Beri tahu kami tentang hal itu.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Apakah Anda memiliki ide untuk fitur baru atau perbaikan? Kami menantikan untuk mendengarnya.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Harap jangan sertakan informasi rahasia atau pribadi dalam umpan balik Anda",
+ "TELL_US_ABOUT_EXPERIENCE": "Ceritakan kepada kami tentang pengalaman Anda",
+ "TELL_US_ABOUT_IDEA": "Ceritakan kepada kami tentang ide Anda",
+ "I_HAVE_FEEDBACK": "Saya memiliki umpan balik",
+ "I_HAVE_SUGGESTION": "Saya memiliki saran",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Anda dapat menghubungi saya mengenai umpan balik ini",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Jika Anda ingin bergabung dengan Panel Pelanggan kami,",
+ "PLEASE_CLICK_HERE": "silakan klik di sini.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Gambar melebihi ukuran file maksimum sebesar {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Gambar rusak atau dalam format yang tidak dikenali.",
+ "ACCEPTED_FORMATS_ARE_0": "Format yang diterima adalah: {0}.",
+ "IMAGE_NOT_ATTACHED": "Gambar tidak dilampirkan.",
+ "ATTACH_IMAGE": "Lampirkan Gambar",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Harap lampirkan hanya satu gambar."
+}
diff --git a/projects/ui-components/internal-shared/strings/it.json b/projects/ui-components/internal-shared/strings/it.json
index c0ce9029..7cae87a4 100644
--- a/projects/ui-components/internal-shared/strings/it.json
+++ b/projects/ui-components/internal-shared/strings/it.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Il suo feedback e i suoi suggerimenti ci aiuteranno a migliorare i nostri prodotti e servizi.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Se ha un problema tecnico o di supporto, o necessita di assistenza immediata, la preghiamo di contattare il suo Laserfiche Administrator o Solution Provider come indicato nel suo contratto di servizio.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Ha trovato qualcosa che le piace o non le piace? Facci sapere.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Ha un'idea per una nuova funzionalità o un miglioramento? Attendiamo con interesse di conoscerla.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "La preghiamo di non includere informazioni riservate o personali nel suo feedback",
- "TELL_US_ABOUT_EXPERIENCE": "Ci parli della sua esperienza",
- "TELL_US_ABOUT_IDEA": "Ci parli della sua idea",
- "I_HAVE_FEEDBACK": "Ho un feedback",
- "I_HAVE_SUGGESTION": "Ho un suggerimento",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Può contattarmi riguardo a questo feedback",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Se desidera unirsi al nostro Customer Panel,",
- "PLEASE_CLICK_HERE": "per favore clicchi qui.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "L'immagine supera la dimensione massima del file di {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "L'immagine è corrotta o in un formato non riconosciuto.",
- "ACCEPTED_FORMATS_ARE_0": "I formati accettati sono: {0}.",
- "IMAGE_NOT_ATTACHED": "Immagine non allegata.",
- "ATTACH_IMAGE": "Allega immagine",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "La preghiamo di allegare una sola immagine."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Il suo feedback e i suoi suggerimenti ci aiuteranno a migliorare i nostri prodotti e servizi.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Se ha un problema tecnico o di supporto, o necessita di assistenza immediata, la preghiamo di contattare il suo Laserfiche Administrator o Solution Provider come indicato nel suo contratto di servizio.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Ha trovato qualcosa che le piace o non le piace? Facci sapere.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Ha un'idea per una nuova funzionalità o un miglioramento? Attendiamo con interesse di conoscerla.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "La preghiamo di non includere informazioni riservate o personali nel suo feedback",
+ "TELL_US_ABOUT_EXPERIENCE": "Ci parli della sua esperienza",
+ "TELL_US_ABOUT_IDEA": "Ci parli della sua idea",
+ "I_HAVE_FEEDBACK": "Ho un feedback",
+ "I_HAVE_SUGGESTION": "Ho un suggerimento",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Può contattarmi riguardo a questo feedback",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Se desidera unirsi al nostro Customer Panel,",
+ "PLEASE_CLICK_HERE": "per favore clicchi qui.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "L'immagine supera la dimensione massima del file di {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "L'immagine è corrotta o in un formato non riconosciuto.",
+ "ACCEPTED_FORMATS_ARE_0": "I formati accettati sono: {0}.",
+ "IMAGE_NOT_ATTACHED": "Immagine non allegata.",
+ "ATTACH_IMAGE": "Allega immagine",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "La preghiamo di allegare una sola immagine."
+}
diff --git a/projects/ui-components/internal-shared/strings/ja.json b/projects/ui-components/internal-shared/strings/ja.json
index 558216b2..23181453 100644
--- a/projects/ui-components/internal-shared/strings/ja.json
+++ b/projects/ui-components/internal-shared/strings/ja.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "お客様のフィードバックとご提案は、当社の製品およびサービスの改善に役立ちます。",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "技術的な問題やサポートが必要な場合、または緊急の支援が必要な場合は、サービス契約に記載されているLaserfiche管理者またはソリューションプロバイダーにご連絡ください。",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "気に入った点や気に入らない点がありましたか？ぜひお知らせください。",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "新機能や改善案のアイデアはありますか？ぜひお聞かせください。",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "フィードバックには機密情報や個人情報を含めないでください。",
- "TELL_US_ABOUT_EXPERIENCE": "あなたのご経験について教えてください",
- "TELL_US_ABOUT_IDEA": "あなたのアイデアについて教えてください",
- "I_HAVE_FEEDBACK": "フィードバックがあります",
- "I_HAVE_SUGGESTION": "提案があります",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "このフィードバックについて私に連絡してもよい",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "カスタマーパネルに参加をご希望の場合は、",
- "PLEASE_CLICK_HERE": "こちらをクリックしてください。",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "画像のファイルサイズが最大許容サイズの{0}を超えています。",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "画像が破損しているか、認識できない形式です。",
- "ACCEPTED_FORMATS_ARE_0": "対応している形式は次のとおりです: {0}。",
- "IMAGE_NOT_ATTACHED": "画像が添付されていません。",
- "ATTACH_IMAGE": "画像を添付する",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "画像は1つだけ添付してください。"
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "お客様のフィードバックとご提案は、当社の製品およびサービスの改善に役立ちます。",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "技術的な問題やサポートが必要な場合、または緊急の支援が必要な場合は、サービス契約に記載されているLaserfiche管理者またはソリューションプロバイダーにご連絡ください。",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "気に入った点や気に入らない点がありましたか？ぜひお知らせください。",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "新機能や改善案のアイデアはありますか？ぜひお聞かせください。",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "フィードバックには機密情報や個人情報を含めないでください。",
+ "TELL_US_ABOUT_EXPERIENCE": "あなたのご経験について教えてください",
+ "TELL_US_ABOUT_IDEA": "あなたのアイデアについて教えてください",
+ "I_HAVE_FEEDBACK": "フィードバックがあります",
+ "I_HAVE_SUGGESTION": "提案があります",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "このフィードバックについて私に連絡してもよい",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "カスタマーパネルに参加をご希望の場合は、",
+ "PLEASE_CLICK_HERE": "こちらをクリックしてください。",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "画像のファイルサイズが最大許容サイズの{0}を超えています。",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "画像が破損しているか、認識できない形式です。",
+ "ACCEPTED_FORMATS_ARE_0": "対応している形式は次のとおりです: {0}。",
+ "IMAGE_NOT_ATTACHED": "画像が添付されていません。",
+ "ATTACH_IMAGE": "画像を添付する",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "画像は1つだけ添付してください。"
+}
diff --git a/projects/ui-components/internal-shared/strings/ko.json b/projects/ui-components/internal-shared/strings/ko.json
index 4b40b945..d4cced7c 100644
--- a/projects/ui-components/internal-shared/strings/ko.json
+++ b/projects/ui-components/internal-shared/strings/ko.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "귀하의 의견과 제안은 당사의 제품과 서비스를 개선하는 데 도움이 됩니다.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "기술적 문제나 지원이 필요하거나 즉각적인 도움이 필요하시면 서비스 계약서에 명시된 Laserfiche 관리자 또는 솔루션 제공업체에 문의하십시오.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "마음에 들거나 들지 않는 점을 발견하셨나요? 알려주십시오.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "새로운 기능이나 개선에 대한 아이디어가 있으십니까? 귀하의 의견을 기다립니다.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "피드백에 기밀 또는 개인 정보를 포함하지 마십시오.",
- "TELL_US_ABOUT_EXPERIENCE": "귀하의 경험을 알려주십시오",
- "TELL_US_ABOUT_IDEA": "귀하의 아이디어를 알려주십시오",
- "I_HAVE_FEEDBACK": "피드백이 있습니다",
- "I_HAVE_SUGGESTION": "제안이 있습니다",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "이 피드백에 대해 저에게 연락할 수 있습니다",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "고객 패널에 참여하시려면,",
- "PLEASE_CLICK_HERE": "여기를 클릭하십시오.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "이미지 파일 크기가 최대 {0}를 초과합니다.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "이미지가 손상되었거나 인식할 수 없는 형식입니다.",
- "ACCEPTED_FORMATS_ARE_0": "허용되는 형식은 다음과 같습니다: {0}.",
- "IMAGE_NOT_ATTACHED": "이미지가 첨부되지 않았습니다.",
- "ATTACH_IMAGE": "이미지 첨부",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "이미지는 한 개만 첨부해 주십시오."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "귀하의 의견과 제안은 당사의 제품과 서비스를 개선하는 데 도움이 됩니다.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "기술적 문제나 지원이 필요하거나 즉각적인 도움이 필요하시면 서비스 계약서에 명시된 Laserfiche 관리자 또는 솔루션 제공업체에 문의하십시오.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "마음에 들거나 들지 않는 점을 발견하셨나요? 알려주십시오.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "새로운 기능이나 개선에 대한 아이디어가 있으십니까? 귀하의 의견을 기다립니다.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "피드백에 기밀 또는 개인 정보를 포함하지 마십시오.",
+ "TELL_US_ABOUT_EXPERIENCE": "귀하의 경험을 알려주십시오",
+ "TELL_US_ABOUT_IDEA": "귀하의 아이디어를 알려주십시오",
+ "I_HAVE_FEEDBACK": "피드백이 있습니다",
+ "I_HAVE_SUGGESTION": "제안이 있습니다",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "이 피드백에 대해 저에게 연락할 수 있습니다",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "고객 패널에 참여하시려면,",
+ "PLEASE_CLICK_HERE": "여기를 클릭하십시오.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "이미지 파일 크기가 최대 {0}를 초과합니다.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "이미지가 손상되었거나 인식할 수 없는 형식입니다.",
+ "ACCEPTED_FORMATS_ARE_0": "허용되는 형식은 다음과 같습니다: {0}.",
+ "IMAGE_NOT_ATTACHED": "이미지가 첨부되지 않았습니다.",
+ "ATTACH_IMAGE": "이미지 첨부",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "이미지는 한 개만 첨부해 주십시오."
+}
diff --git a/projects/ui-components/internal-shared/strings/ms.json b/projects/ui-components/internal-shared/strings/ms.json
index baa30d00..b2de9b48 100644
--- a/projects/ui-components/internal-shared/strings/ms.json
+++ b/projects/ui-components/internal-shared/strings/ms.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Maklum balas dan cadangan anda akan membantu kami menambah baik produk dan perkhidmatan kami.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Jika anda mempunyai isu teknikal atau sokongan, atau memerlukan bantuan segera, sila hubungi Pentadbir Laserfiche atau Pembekal Penyelesaian anda seperti yang ditunjukkan dalam perjanjian perkhidmatan anda.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Menemui sesuatu yang anda suka atau tidak suka? Beritahu kami mengenainya.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Adakah anda mempunyai idea untuk ciri baharu atau penambahbaikan? Kami tidak sabar untuk mendengarnya.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Sila jangan sertakan sebarang maklumat sulit atau peribadi dalam maklum balas anda",
- "TELL_US_ABOUT_EXPERIENCE": "Beritahu kami tentang pengalaman anda",
- "TELL_US_ABOUT_IDEA": "Beritahu kami tentang idea anda",
- "I_HAVE_FEEDBACK": "Saya mempunyai maklum balas",
- "I_HAVE_SUGGESTION": "Saya mempunyai cadangan",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Anda boleh menghubungi saya tentang maklum balas ini",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Jika anda ingin menyertai Panel Pelanggan kami,",
- "PLEASE_CLICK_HERE": "Sila klik di sini.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Imej melebihi saiz fail maksimum {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Imej rosak atau dalam format yang tidak dikenali.",
- "ACCEPTED_FORMATS_ARE_0": "Format yang diterima ialah: {0}.",
- "IMAGE_NOT_ATTACHED": "Imej tidak dilampirkan.",
- "ATTACH_IMAGE": "Lampirkan Imej",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Sila lampirkan hanya satu imej."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Maklum balas dan cadangan anda akan membantu kami menambah baik produk dan perkhidmatan kami.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Jika anda mempunyai isu teknikal atau sokongan, atau memerlukan bantuan segera, sila hubungi Pentadbir Laserfiche atau Pembekal Penyelesaian anda seperti yang ditunjukkan dalam perjanjian perkhidmatan anda.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Menemui sesuatu yang anda suka atau tidak suka? Beritahu kami mengenainya.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Adakah anda mempunyai idea untuk ciri baharu atau penambahbaikan? Kami tidak sabar untuk mendengarnya.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Sila jangan sertakan sebarang maklumat sulit atau peribadi dalam maklum balas anda",
+ "TELL_US_ABOUT_EXPERIENCE": "Beritahu kami tentang pengalaman anda",
+ "TELL_US_ABOUT_IDEA": "Beritahu kami tentang idea anda",
+ "I_HAVE_FEEDBACK": "Saya mempunyai maklum balas",
+ "I_HAVE_SUGGESTION": "Saya mempunyai cadangan",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Anda boleh menghubungi saya tentang maklum balas ini",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Jika anda ingin menyertai Panel Pelanggan kami,",
+ "PLEASE_CLICK_HERE": "Sila klik di sini.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Imej melebihi saiz fail maksimum {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Imej rosak atau dalam format yang tidak dikenali.",
+ "ACCEPTED_FORMATS_ARE_0": "Format yang diterima ialah: {0}.",
+ "IMAGE_NOT_ATTACHED": "Imej tidak dilampirkan.",
+ "ATTACH_IMAGE": "Lampirkan Imej",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Sila lampirkan hanya satu imej."
+}
diff --git a/projects/ui-components/internal-shared/strings/nl.json b/projects/ui-components/internal-shared/strings/nl.json
index 91722868..f6114c09 100644
--- a/projects/ui-components/internal-shared/strings/nl.json
+++ b/projects/ui-components/internal-shared/strings/nl.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Uw feedback en suggesties helpen ons onze producten en diensten te verbeteren.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Als u een technisch probleem of ondersteuningsvraag heeft, of onmiddellijke hulp nodig heeft, neem dan contact op met uw Laserfiche-beheerder of Solution Provider zoals aangegeven in uw serviceovereenkomst.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Iets gevonden dat u leuk of niet leuk vindt? Laat het ons weten.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Heeft u een idee voor een nieuwe functie of een verbetering? We horen er graag over.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Gelieve geen vertrouwelijke of persoonlijke informatie in uw feedback op te nemen",
- "TELL_US_ABOUT_EXPERIENCE": "Vertel ons over uw ervaring",
- "TELL_US_ABOUT_IDEA": "Vertel ons over uw idee",
- "I_HAVE_FEEDBACK": "Ik heb feedback",
- "I_HAVE_SUGGESTION": "Ik heb een suggestie",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "U mag contact met mij opnemen over deze feedback",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Als u lid wilt worden van ons Klantenpanel,",
- "PLEASE_CLICK_HERE": "klik dan hier.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "De afbeelding overschrijdt de maximale bestandsgrootte van {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "De afbeelding is beschadigd of in een niet-herkend formaat.",
- "ACCEPTED_FORMATS_ARE_0": "De geaccepteerde formaten zijn: {0}.",
- "IMAGE_NOT_ATTACHED": "Afbeelding niet toegevoegd.",
- "ATTACH_IMAGE": "Afbeelding bijvoegen",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Voeg alstublieft slechts één afbeelding toe."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Uw feedback en suggesties helpen ons onze producten en diensten te verbeteren.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Als u een technisch probleem of ondersteuningsvraag heeft, of onmiddellijke hulp nodig heeft, neem dan contact op met uw Laserfiche-beheerder of Solution Provider zoals aangegeven in uw serviceovereenkomst.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Iets gevonden dat u leuk of niet leuk vindt? Laat het ons weten.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Heeft u een idee voor een nieuwe functie of een verbetering? We horen er graag over.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Gelieve geen vertrouwelijke of persoonlijke informatie in uw feedback op te nemen",
+ "TELL_US_ABOUT_EXPERIENCE": "Vertel ons over uw ervaring",
+ "TELL_US_ABOUT_IDEA": "Vertel ons over uw idee",
+ "I_HAVE_FEEDBACK": "Ik heb feedback",
+ "I_HAVE_SUGGESTION": "Ik heb een suggestie",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "U mag contact met mij opnemen over deze feedback",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Als u lid wilt worden van ons Klantenpanel,",
+ "PLEASE_CLICK_HERE": "klik dan hier.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "De afbeelding overschrijdt de maximale bestandsgrootte van {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "De afbeelding is beschadigd of in een niet-herkend formaat.",
+ "ACCEPTED_FORMATS_ARE_0": "De geaccepteerde formaten zijn: {0}.",
+ "IMAGE_NOT_ATTACHED": "Afbeelding niet toegevoegd.",
+ "ATTACH_IMAGE": "Afbeelding bijvoegen",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Voeg alstublieft slechts één afbeelding toe."
+}
diff --git a/projects/ui-components/internal-shared/strings/pt-BR.json b/projects/ui-components/internal-shared/strings/pt-BR.json
index 3ff8200c..d6fc988e 100644
--- a/projects/ui-components/internal-shared/strings/pt-BR.json
+++ b/projects/ui-components/internal-shared/strings/pt-BR.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Seu feedback e sugestões nos ajudarão a melhorar nosso produto e serviços.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Se você tiver um problema técnico ou de suporte, ou precisar de assistência imediata, por favor contate seu Administrador Laserfiche ou Provedor de Soluções conforme indicado em seu contrato de serviço.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Encontrou algo que gostou ou não gostou? Informe-nos.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Você tem uma ideia para um novo recurso ou uma melhoria? Estamos ansiosos para ouvi-la.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Por favor, não inclua informações confidenciais ou pessoais em seu feedback",
- "TELL_US_ABOUT_EXPERIENCE": "Conte-nos sobre sua experiência",
- "TELL_US_ABOUT_IDEA": "Conte-nos sobre sua ideia",
- "I_HAVE_FEEDBACK": "Tenho um feedback",
- "I_HAVE_SUGGESTION": "Tenho uma sugestão",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Você pode me contatar sobre este feedback",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Se você gostaria de participar do nosso Painel de Clientes,",
- "PLEASE_CLICK_HERE": "por favor clique aqui.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "A imagem excede o tamanho máximo do arquivo de {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "A imagem está corrompida ou em um formato não reconhecido.",
- "ACCEPTED_FORMATS_ARE_0": "Os formatos aceitos são: {0}.",
- "IMAGE_NOT_ATTACHED": "Imagem não anexada.",
- "ATTACH_IMAGE": "Anexar Imagem",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Por favor, anexe apenas uma imagem."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Seu feedback e sugestões nos ajudarão a melhorar nosso produto e serviços.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Se você tiver um problema técnico ou de suporte, ou precisar de assistência imediata, por favor contate seu Administrador Laserfiche ou Provedor de Soluções conforme indicado em seu contrato de serviço.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Encontrou algo que gostou ou não gostou? Informe-nos.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Você tem uma ideia para um novo recurso ou uma melhoria? Estamos ansiosos para ouvi-la.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Por favor, não inclua informações confidenciais ou pessoais em seu feedback",
+ "TELL_US_ABOUT_EXPERIENCE": "Conte-nos sobre sua experiência",
+ "TELL_US_ABOUT_IDEA": "Conte-nos sobre sua ideia",
+ "I_HAVE_FEEDBACK": "Tenho um feedback",
+ "I_HAVE_SUGGESTION": "Tenho uma sugestão",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Você pode me contatar sobre este feedback",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Se você gostaria de participar do nosso Painel de Clientes,",
+ "PLEASE_CLICK_HERE": "por favor clique aqui.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "A imagem excede o tamanho máximo do arquivo de {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "A imagem está corrompida ou em um formato não reconhecido.",
+ "ACCEPTED_FORMATS_ARE_0": "Os formatos aceitos são: {0}.",
+ "IMAGE_NOT_ATTACHED": "Imagem não anexada.",
+ "ATTACH_IMAGE": "Anexar Imagem",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Por favor, anexe apenas uma imagem."
+}
diff --git a/projects/ui-components/internal-shared/strings/ro.json b/projects/ui-components/internal-shared/strings/ro.json
index 7be2cb5e..bb422c87 100644
--- a/projects/ui-components/internal-shared/strings/ro.json
+++ b/projects/ui-components/internal-shared/strings/ro.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Feedback-ul și sugestiile dumneavoastră ne vor ajuta să îmbunătățim produsul și serviciile noastre.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Dacă aveți o problemă tehnică sau de suport, sau aveți nevoie de asistență imediată, vă rugăm să contactați Administratorul Laserfiche sau Furnizorul de Soluții indicat în acordul dumneavoastră de servicii.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Ați găsit ceva ce vă place sau nu vă place? Spuneți-ne despre asta.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Aveți o idee pentru o funcționalitate nouă sau o îmbunătățire? Așteptăm cu interes să o auzim.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Vă rugăm să nu includeți informații confidențiale sau personale în feedback-ul dumneavoastră",
- "TELL_US_ABOUT_EXPERIENCE": "Spuneți-ne despre experiența dumneavoastră",
- "TELL_US_ABOUT_IDEA": "Spuneți-ne despre ideea dumneavoastră",
- "I_HAVE_FEEDBACK": "Am feedback",
- "I_HAVE_SUGGESTION": "Am o sugestie",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Puteți să mă contactați în legătură cu acest feedback",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Dacă doriți să vă alăturați Panelului nostru de Clienți,",
- "PLEASE_CLICK_HERE": "vă rugăm să faceți clic aici.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Imaginea depășește dimensiunea maximă a fișierului de {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Imaginea este coruptă sau într-un format nerecunoscut.",
- "ACCEPTED_FORMATS_ARE_0": "Formatele acceptate sunt: {0}.",
- "IMAGE_NOT_ATTACHED": "Imaginea nu este atașată.",
- "ATTACH_IMAGE": "Atașați imagine",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Vă rugăm să atașați doar o singură imagine."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Feedback-ul și sugestiile dumneavoastră ne vor ajuta să îmbunătățim produsul și serviciile noastre.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Dacă aveți o problemă tehnică sau de suport, sau aveți nevoie de asistență imediată, vă rugăm să contactați Administratorul Laserfiche sau Furnizorul de Soluții indicat în acordul dumneavoastră de servicii.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Ați găsit ceva ce vă place sau nu vă place? Spuneți-ne despre asta.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Aveți o idee pentru o funcționalitate nouă sau o îmbunătățire? Așteptăm cu interes să o auzim.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Vă rugăm să nu includeți informații confidențiale sau personale în feedback-ul dumneavoastră",
+ "TELL_US_ABOUT_EXPERIENCE": "Spuneți-ne despre experiența dumneavoastră",
+ "TELL_US_ABOUT_IDEA": "Spuneți-ne despre ideea dumneavoastră",
+ "I_HAVE_FEEDBACK": "Am feedback",
+ "I_HAVE_SUGGESTION": "Am o sugestie",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Puteți să mă contactați în legătură cu acest feedback",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Dacă doriți să vă alăturați Panelului nostru de Clienți,",
+ "PLEASE_CLICK_HERE": "vă rugăm să faceți clic aici.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Imaginea depășește dimensiunea maximă a fișierului de {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Imaginea este coruptă sau într-un format nerecunoscut.",
+ "ACCEPTED_FORMATS_ARE_0": "Formatele acceptate sunt: {0}.",
+ "IMAGE_NOT_ATTACHED": "Imaginea nu este atașată.",
+ "ATTACH_IMAGE": "Atașați imagine",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Vă rugăm să atașați doar o singură imagine."
+}
diff --git a/projects/ui-components/internal-shared/strings/sr-Latn.json b/projects/ui-components/internal-shared/strings/sr-Latn.json
index 0a732234..94950e98 100644
--- a/projects/ui-components/internal-shared/strings/sr-Latn.json
+++ b/projects/ui-components/internal-shared/strings/sr-Latn.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Vaše povratne informacije i sugestije će nam pomoći da poboljšamo naše proizvode i usluge.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Ako imate problem sa tehničkom podrškom ili podrškom, ili vam je potrebna hitna pomoć, obratite se administratoru Laserfiche ili provajderu rešenja kao što je navedeno u ugovoru o usluzi.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Pronašli ste nešto što vam se sviđa ili ne sviđa? Javite nam o tome.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Da li imate ideju za novu funkciju ili poboljšanje? Radujemo se što ćemo čuti o tome.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Molimo vas da ne uključujete nikakve poverljive ili lične podatke u svoje povratne informacije",
- "TELL_US_ABOUT_EXPERIENCE": "Recite nam svoje iskustvo",
- "TELL_US_ABOUT_IDEA": "Recite nam nešto o svojoj ideji",
- "I_HAVE_FEEDBACK": "Imam povratne informacije",
- "I_HAVE_SUGGESTION": "Imam predlog",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Možete me kontaktirati u vezi sa ovim povratnim informacijama",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Ako želite da se pridružite našem panelu za korisnike,",
- "PLEASE_CLICK_HERE": "kliknite ovde.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Slika prelazi maksimalnu veličinu datoteke {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Slika je oštećena ili u neprepoznatom formatu.",
- "ACCEPTED_FORMATS_ARE_0": "Prihvaćeni formati su: {0}.",
- "IMAGE_NOT_ATTACHED": "Slika nije priložena.",
- "ATTACH_IMAGE": "Priloži sliku",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Molimo Vas da priložite samo jednu sliku."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Vaše povratne informacije i sugestije će nam pomoći da poboljšamo naše proizvode i usluge.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Ako imate problem sa tehničkom podrškom ili podrškom, ili vam je potrebna hitna pomoć, obratite se administratoru Laserfiche ili provajderu rešenja kao što je navedeno u ugovoru o usluzi.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Pronašli ste nešto što vam se sviđa ili ne sviđa? Javite nam o tome.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Da li imate ideju za novu funkciju ili poboljšanje? Radujemo se što ćemo čuti o tome.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Molimo vas da ne uključujete nikakve poverljive ili lične podatke u svoje povratne informacije",
+ "TELL_US_ABOUT_EXPERIENCE": "Recite nam svoje iskustvo",
+ "TELL_US_ABOUT_IDEA": "Recite nam nešto o svojoj ideji",
+ "I_HAVE_FEEDBACK": "Imam povratne informacije",
+ "I_HAVE_SUGGESTION": "Imam predlog",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Možete me kontaktirati u vezi sa ovim povratnim informacijama",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Ako želite da se pridružite našem panelu za korisnike,",
+ "PLEASE_CLICK_HERE": "kliknite ovde.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Slika prelazi maksimalnu veličinu datoteke {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Slika je oštećena ili u neprepoznatom formatu.",
+ "ACCEPTED_FORMATS_ARE_0": "Prihvaćeni formati su: {0}.",
+ "IMAGE_NOT_ATTACHED": "Slika nije priložena.",
+ "ATTACH_IMAGE": "Priloži sliku",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Molimo Vas da priložite samo jednu sliku."
+}
diff --git a/projects/ui-components/internal-shared/strings/th.json b/projects/ui-components/internal-shared/strings/th.json
index cd66cfe1..5521b2dc 100644
--- a/projects/ui-components/internal-shared/strings/th.json
+++ b/projects/ui-components/internal-shared/strings/th.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "ข้อเสนอแนะและข้อเสนอแนะของคุณจะช่วยให้เราปรับปรุงผลิตภัณฑ์และบริการของเรา",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "หากคุณมีปัญหาด้านเทคนิคหรือการสนับสนุน หรือต้องการความช่วยเหลือทันที โปรดติดต่อผู้ดูแลระบบ Laserfiche หรือผู้ให้บริการโซลูชันตามที่ระบุไว้ในข้อตกลงการให้บริการของคุณ",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "พบสิ่งที่คุณชอบหรือไม่ชอบหรือไม่? แจ้งให้เราทราบเกี่ยวกับเรื่องนี้",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "คุณมีไอเดียสําหรับฟีเจอร์ใหม่หรือการปรับปรุงหรือไม่? เราหวังว่าจะได้ยินเกี่ยวกับเรื่องนี้",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "โปรดอย่าใส่ข้อมูลที่เป็นความลับหรือข้อมูลส่วนบุคคลในความคิดเห็นของคุณ",
- "TELL_US_ABOUT_EXPERIENCE": "บอกเราเกี่ยวกับประสบการณ์ของคุณ",
- "TELL_US_ABOUT_IDEA": "บอกเราเกี่ยวกับไอเดียของคุณ",
- "I_HAVE_FEEDBACK": "ฉันมีข้อเสนอแนะ",
- "I_HAVE_SUGGESTION": "ฉันมีข้อเสนอแนะ",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "คุณสามารถติดต่อฉันเกี่ยวกับข้อเสนอแนะนี้",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "หากคุณต้องการเข้าร่วมกลุ่มลูกค้าของเรา",
- "PLEASE_CLICK_HERE": "กรุณาคลิกที่นี่",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "รูปภาพมีขนาดไฟล์เกินขนาดสูงสุดของ {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "รูปภาพเสียหายหรืออยู่ในรูปแบบที่ไม่รู้จัก",
- "ACCEPTED_FORMATS_ARE_0": "รูปแบบที่ยอมรับคือ: {0}.",
- "IMAGE_NOT_ATTACHED": "ไม่ได้แนบรูปภาพ",
- "ATTACH_IMAGE": "แนบรูปภาพ",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "โปรดแนบภาพเพียงภาพเดียว"
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "ข้อเสนอแนะและข้อเสนอแนะของคุณจะช่วยให้เราปรับปรุงผลิตภัณฑ์และบริการของเรา",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "หากคุณมีปัญหาด้านเทคนิคหรือการสนับสนุน หรือต้องการความช่วยเหลือทันที โปรดติดต่อผู้ดูแลระบบ Laserfiche หรือผู้ให้บริการโซลูชันตามที่ระบุไว้ในข้อตกลงการให้บริการของคุณ",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "พบสิ่งที่คุณชอบหรือไม่ชอบหรือไม่? แจ้งให้เราทราบเกี่ยวกับเรื่องนี้",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "คุณมีไอเดียสําหรับฟีเจอร์ใหม่หรือการปรับปรุงหรือไม่? เราหวังว่าจะได้ยินเกี่ยวกับเรื่องนี้",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "โปรดอย่าใส่ข้อมูลที่เป็นความลับหรือข้อมูลส่วนบุคคลในความคิดเห็นของคุณ",
+ "TELL_US_ABOUT_EXPERIENCE": "บอกเราเกี่ยวกับประสบการณ์ของคุณ",
+ "TELL_US_ABOUT_IDEA": "บอกเราเกี่ยวกับไอเดียของคุณ",
+ "I_HAVE_FEEDBACK": "ฉันมีข้อเสนอแนะ",
+ "I_HAVE_SUGGESTION": "ฉันมีข้อเสนอแนะ",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "คุณสามารถติดต่อฉันเกี่ยวกับข้อเสนอแนะนี้",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "หากคุณต้องการเข้าร่วมกลุ่มลูกค้าของเรา",
+ "PLEASE_CLICK_HERE": "กรุณาคลิกที่นี่",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "รูปภาพมีขนาดไฟล์เกินขนาดสูงสุดของ {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "รูปภาพเสียหายหรืออยู่ในรูปแบบที่ไม่รู้จัก",
+ "ACCEPTED_FORMATS_ARE_0": "รูปแบบที่ยอมรับคือ: {0}.",
+ "IMAGE_NOT_ATTACHED": "ไม่ได้แนบรูปภาพ",
+ "ATTACH_IMAGE": "แนบรูปภาพ",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "โปรดแนบภาพเพียงภาพเดียว"
+}
diff --git a/projects/ui-components/internal-shared/strings/tr.json b/projects/ui-components/internal-shared/strings/tr.json
index ecccc675..e57af31a 100644
--- a/projects/ui-components/internal-shared/strings/tr.json
+++ b/projects/ui-components/internal-shared/strings/tr.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Geri bildiriminiz ve önerileriniz ürün ve hizmetlerimizi geliştirmemize yardımcı olacaktır.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Teknik veya destek sorununuz varsa ya da acil yardım gerekiyorsa, lütfen hizmet sözleşmenizde belirtilen Laserfiche Yöneticiniz veya Çözüm Sağlayıcınız ile iletişime geçiniz.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Beğendiğiniz veya beğenmediğiniz bir şey mi buldunuz? Bize bildirin.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Yeni bir özellik veya geliştirme fikriniz mi var? Bunu duymayı sabırsızlıkla bekliyoruz.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Lütfen geri bildiriminizde gizli veya kişisel bilgi eklemeyiniz.",
- "TELL_US_ABOUT_EXPERIENCE": "Deneyiminizi bize anlatın",
- "TELL_US_ABOUT_IDEA": "Fikrinizi bize anlatın",
- "I_HAVE_FEEDBACK": "Geri bildirimim var",
- "I_HAVE_SUGGESTION": "Bir önerim var",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Bu geri bildirimle ilgili benimle iletişime geçebilirsiniz",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Müşteri Panelimize katılmak isterseniz,",
- "PLEASE_CLICK_HERE": "lütfen buraya tıklayın.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Resim, maksimum dosya boyutu olan {0} değerini aşıyor.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Resim bozuk veya tanınmayan bir formatta.",
- "ACCEPTED_FORMATS_ARE_0": "Kabul edilen formatlar: {0}.",
- "IMAGE_NOT_ATTACHED": "Resim eklenmedi.",
- "ATTACH_IMAGE": "Resim Ekle",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Lütfen sadece bir resim ekleyiniz."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Geri bildiriminiz ve önerileriniz ürün ve hizmetlerimizi geliştirmemize yardımcı olacaktır.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Teknik veya destek sorununuz varsa ya da acil yardım gerekiyorsa, lütfen hizmet sözleşmenizde belirtilen Laserfiche Yöneticiniz veya Çözüm Sağlayıcınız ile iletişime geçiniz.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Beğendiğiniz veya beğenmediğiniz bir şey mi buldunuz? Bize bildirin.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Yeni bir özellik veya geliştirme fikriniz mi var? Bunu duymayı sabırsızlıkla bekliyoruz.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Lütfen geri bildiriminizde gizli veya kişisel bilgi eklemeyiniz.",
+ "TELL_US_ABOUT_EXPERIENCE": "Deneyiminizi bize anlatın",
+ "TELL_US_ABOUT_IDEA": "Fikrinizi bize anlatın",
+ "I_HAVE_FEEDBACK": "Geri bildirimim var",
+ "I_HAVE_SUGGESTION": "Bir önerim var",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Bu geri bildirimle ilgili benimle iletişime geçebilirsiniz",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Müşteri Panelimize katılmak isterseniz,",
+ "PLEASE_CLICK_HERE": "lütfen buraya tıklayın.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Resim, maksimum dosya boyutu olan {0} değerini aşıyor.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Resim bozuk veya tanınmayan bir formatta.",
+ "ACCEPTED_FORMATS_ARE_0": "Kabul edilen formatlar: {0}.",
+ "IMAGE_NOT_ATTACHED": "Resim eklenmedi.",
+ "ATTACH_IMAGE": "Resim Ekle",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Lütfen sadece bir resim ekleyiniz."
+}
diff --git a/projects/ui-components/internal-shared/strings/vi.json b/projects/ui-components/internal-shared/strings/vi.json
index f0691ab3..2279a396 100644
--- a/projects/ui-components/internal-shared/strings/vi.json
+++ b/projects/ui-components/internal-shared/strings/vi.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Phản hồi và đề xuất của bạn sẽ giúp chúng tôi cải thiện sản phẩm và dịch vụ của mình.",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Nếu bạn gặp vấn đề về kỹ thuật hoặc hỗ trợ hoặc cần hỗ trợ ngay lập tức, vui lòng liên hệ với Quản trị viên hoặc Nhà cung cấp giải pháp Laserfiche của bạn như được nêu trong thỏa thuận dịch vụ của bạn.",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Tìm thấy thứ gì đó bạn thích hoặc không thích? Hãy cho chúng tôi biết về nó.",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Bạn có ý tưởng cho một tính năng mới hoặc một cải tiến không? Chúng tôi mong được nghe về nó.",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Vui lòng không bao gồm bất kỳ thông tin bí mật hoặc cá nhân nào trong phản hồi của bạn",
- "TELL_US_ABOUT_EXPERIENCE": "Hãy cho chúng tôi biết về trải nghiệm của bạn",
- "TELL_US_ABOUT_IDEA": "Hãy cho chúng tôi biết về ý tưởng của bạn",
- "I_HAVE_FEEDBACK": "Tôi có phản hồi",
- "I_HAVE_SUGGESTION": "Tôi có một đề xuất",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Bạn có thể liên hệ với tôi về phản hồi này",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Nếu bạn muốn tham gia Bảng điều khiển khách hàng của chúng tôi,",
- "PLEASE_CLICK_HERE": "Vui lòng nhấp vào đây.",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Hình ảnh vượt quá kích thước tệp tối đa là {0}.",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Hình ảnh bị hỏng hoặc ở định dạng không được nhận dạng.",
- "ACCEPTED_FORMATS_ARE_0": "Các định dạng được chấp nhận là: {0}.",
- "IMAGE_NOT_ATTACHED": "Hình ảnh không đính kèm.",
- "ATTACH_IMAGE": "Đính kèm hình ảnh",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Vui lòng chỉ đính kèm một hình ảnh."
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "Phản hồi và đề xuất của bạn sẽ giúp chúng tôi cải thiện sản phẩm và dịch vụ của mình.",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "Nếu bạn gặp vấn đề về kỹ thuật hoặc hỗ trợ hoặc cần hỗ trợ ngay lập tức, vui lòng liên hệ với Quản trị viên hoặc Nhà cung cấp giải pháp Laserfiche của bạn như được nêu trong thỏa thuận dịch vụ của bạn.",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "Tìm thấy thứ gì đó bạn thích hoặc không thích? Hãy cho chúng tôi biết về nó.",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "Bạn có ý tưởng cho một tính năng mới hoặc một cải tiến không? Chúng tôi mong được nghe về nó.",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "Vui lòng không bao gồm bất kỳ thông tin bí mật hoặc cá nhân nào trong phản hồi của bạn",
+ "TELL_US_ABOUT_EXPERIENCE": "Hãy cho chúng tôi biết về trải nghiệm của bạn",
+ "TELL_US_ABOUT_IDEA": "Hãy cho chúng tôi biết về ý tưởng của bạn",
+ "I_HAVE_FEEDBACK": "Tôi có phản hồi",
+ "I_HAVE_SUGGESTION": "Tôi có một đề xuất",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "Bạn có thể liên hệ với tôi về phản hồi này",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "Nếu bạn muốn tham gia Bảng điều khiển khách hàng của chúng tôi,",
+ "PLEASE_CLICK_HERE": "Vui lòng nhấp vào đây.",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "Hình ảnh vượt quá kích thước tệp tối đa là {0}.",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "Hình ảnh bị hỏng hoặc ở định dạng không được nhận dạng.",
+ "ACCEPTED_FORMATS_ARE_0": "Các định dạng được chấp nhận là: {0}.",
+ "IMAGE_NOT_ATTACHED": "Hình ảnh không đính kèm.",
+ "ATTACH_IMAGE": "Đính kèm hình ảnh",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "Vui lòng chỉ đính kèm một hình ảnh."
+}
diff --git a/projects/ui-components/internal-shared/strings/zh-Hans.json b/projects/ui-components/internal-shared/strings/zh-Hans.json
index b5d4715d..0a1ad1f9 100644
--- a/projects/ui-components/internal-shared/strings/zh-Hans.json
+++ b/projects/ui-components/internal-shared/strings/zh-Hans.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "您的反馈和建议将帮助我们改进产品和服务。",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "如果您有技术或支持问题，或需要立即协助，请按照您的服务协议联系您的 Laserfiche 管理员或解决方案提供商。",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "发现您喜欢或不喜欢的内容？请告诉我们。",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "您有新功能或改进的想法吗？我们期待您的反馈。",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "请勿在反馈中包含任何机密或个人信息",
- "TELL_US_ABOUT_EXPERIENCE": "告诉我们您的体验",
- "TELL_US_ABOUT_IDEA": "告诉我们您的想法",
- "I_HAVE_FEEDBACK": "我有反馈",
- "I_HAVE_SUGGESTION": "我有一个建议",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "您可以就此反馈联系我",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "如果您想加入我们的客户小组，",
- "PLEASE_CLICK_HERE": "请点击这里。",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "图片超过最大文件大小 {0}。",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "图片已损坏或格式无法识别。",
- "ACCEPTED_FORMATS_ARE_0": "接受的格式为：{0}。",
- "IMAGE_NOT_ATTACHED": "未附加图片。",
- "ATTACH_IMAGE": "附加图片",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "请仅附加一张图片。"
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "您的反馈和建议将帮助我们改进产品和服务。",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "如果您有技术或支持问题，或需要立即协助，请按照您的服务协议联系您的 Laserfiche 管理员或解决方案提供商。",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "发现您喜欢或不喜欢的内容？请告诉我们。",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "您有新功能或改进的想法吗？我们期待您的反馈。",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "请勿在反馈中包含任何机密或个人信息",
+ "TELL_US_ABOUT_EXPERIENCE": "告诉我们您的体验",
+ "TELL_US_ABOUT_IDEA": "告诉我们您的想法",
+ "I_HAVE_FEEDBACK": "我有反馈",
+ "I_HAVE_SUGGESTION": "我有一个建议",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "您可以就此反馈联系我",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "如果您想加入我们的客户小组，",
+ "PLEASE_CLICK_HERE": "请点击这里。",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "图片超过最大文件大小 {0}。",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "图片已损坏或格式无法识别。",
+ "ACCEPTED_FORMATS_ARE_0": "接受的格式为：{0}。",
+ "IMAGE_NOT_ATTACHED": "未附加图片。",
+ "ATTACH_IMAGE": "附加图片",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "请仅附加一张图片。"
+}
diff --git a/projects/ui-components/internal-shared/strings/zh-Hant.json b/projects/ui-components/internal-shared/strings/zh-Hant.json
index 4838b36c..1ec83601 100644
--- a/projects/ui-components/internal-shared/strings/zh-Hant.json
+++ b/projects/ui-components/internal-shared/strings/zh-Hant.json
@@ -1,20 +1,20 @@
-{
- "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "您的反饋和建議將幫助我們改進產品和服務。",
- "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "如果您有技術或支持問題，或需要立即協助，請按照您的服務協議聯繫您的 Laserfiche 管理員或解決方案供應商。",
- "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "發現您喜歡或不喜歡的內容？ 請告訴我們。",
- "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "您有新功能或改進的想法嗎？ 我們期待您的反饋。",
- "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "請勿在反饋中包含任何機密或個人資訊",
- "TELL_US_ABOUT_EXPERIENCE": "告訴我們您的體驗",
- "TELL_US_ABOUT_IDEA": "告訴我們您的想法",
- "I_HAVE_FEEDBACK": "我有反饋",
- "I_HAVE_SUGGESTION": "我有一個建議",
- "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "您可以就此反饋聯繫我",
- "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "如果您想加入我們的客戶小組，",
- "PLEASE_CLICK_HERE": "請點擊這裡。",
- "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "圖片超過最大檔大小 {0}。",
- "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "圖片已損壞或格式無法識別。",
- "ACCEPTED_FORMATS_ARE_0": "接受的格式為：{0}。",
- "IMAGE_NOT_ATTACHED": "未附加圖片。",
- "ATTACH_IMAGE": "附加圖片",
- "PLEASE_ATTACH_ONLY_ONE_IMAGE": "請僅附加一張圖片。"
-}
+{
+ "YOUR_FEEDBACK_SUGGESTION_HELP_IMPROVE_PRODUCT": "您的反饋和建議將幫助我們改進產品和服務。",
+ "TECHNICAL_ISSUES_CONTACT_ADMIN_OR_SP": "如果您有技術或支持問題，或需要立即協助，請按照您的服務協議聯繫您的 Laserfiche 管理員或解決方案供應商。",
+ "FOUND_SOMETHING_LIKE_DISLIKE_LET_US_KNOW": "發現您喜歡或不喜歡的內容？ 請告訴我們。",
+ "DO_YOU_HAVE_IDEA_NEW_FEATURE_IMPROVEMENT_LOOK_FORWARD_TO_HEARING": "您有新功能或改進的想法嗎？ 我們期待您的反饋。",
+ "PLEASE_DO_NOT_INCLUDE_CONFIDENTIAL_OR_PERSONAL_INFO_IN_FEEDBACK": "請勿在反饋中包含任何機密或個人資訊",
+ "TELL_US_ABOUT_EXPERIENCE": "告訴我們您的體驗",
+ "TELL_US_ABOUT_IDEA": "告訴我們您的想法",
+ "I_HAVE_FEEDBACK": "我有反饋",
+ "I_HAVE_SUGGESTION": "我有一個建議",
+ "YOU_MAY_CONTACT_ME_ABOUT_FEEDBACK": "您可以就此反饋聯繫我",
+ "IF_YOUD_LIKE_TO_JOIN_OUR_CUSTOMER_PANEL": "如果您想加入我們的客戶小組，",
+ "PLEASE_CLICK_HERE": "請點擊這裡。",
+ "IMAGE_EXCEEDS_MAX_FILE_SIZE_0": "圖片超過最大檔大小 {0}。",
+ "IMAGE_CORRUPTED_UNRECOGNIZED_FORMAT": "圖片已損壞或格式無法識別。",
+ "ACCEPTED_FORMATS_ARE_0": "接受的格式為：{0}。",
+ "IMAGE_NOT_ATTACHED": "未附加圖片。",
+ "ATTACH_IMAGE": "附加圖片",
+ "PLEASE_ATTACH_ONLY_ONE_IMAGE": "請僅附加一張圖片。"
+}
diff --git a/projects/ui-components/internal-shared/test-validation.spec.ts b/projects/ui-components/internal-shared/test-validation.spec.ts
new file mode 100644
index 00000000..1b9666a1
--- /dev/null
+++ b/projects/ui-components/internal-shared/test-validation.spec.ts
@@ -0,0 +1,7 @@
+import { ValidationRule } from '@laserfiche/lf-ui-components/internal-shared';
+
+describe('validation test', () => {
+ it('should import', () => {
+ expect(ValidationRule).toBeDefined();
+ });
+});
diff --git a/projects/ui-components/internal-shared/validation-utils.spec.ts b/projects/ui-components/internal-shared/validation-utils.spec.ts
index 6fadd4c1..001cda98 100644
--- a/projects/ui-components/internal-shared/validation-utils.spec.ts
+++ b/projects/ui-components/internal-shared/validation-utils.spec.ts
@@ -1,45 +1,38 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { FormControl } from '@angular/forms';
-import { ValidationUtils } from './validation-utils';
-
-
-
-describe('ValidationUtils', () => {
-
- it('should create an instance', () => {
- expect(new ValidationUtils()).toBeTruthy();
- });
-
- it('should create generalRegexValidator that tests regex pattern', () => {
- const twoDigitRegex = new RegExp('^[0-9]{2}[:.,-]?$');
- const validator = ValidationUtils.generalRegexValidator(twoDigitRegex, 'twoDigit');
- const goodFC: FormControl = new FormControl('12', [validator]);
- const badFC: FormControl = new FormControl('123', [validator]);
- expect(goodFC.hasError('twoDigit')).toBeFalse();
- expect(badFC.hasError('twoDigit')).toBeTruthy();
- });
-
- it('should create requiredValidator that tests if the input is empty spaces', () => {
-
- const validator = ValidationUtils.requiredValidator();
- let formControl: FormControl = new FormControl('', [validator]);
- expect(formControl.hasError('required')).toBeTrue();
-
- formControl = new FormControl(' ', [validator]);
- expect(formControl.hasError('required')).toBeTrue();
-
- formControl = new FormControl(null, [validator]);
- expect(formControl.hasError('required')).toBeTrue();
-
- formControl = new FormControl(undefined, [validator]);
- expect(formControl.hasError('required')).toBeTrue();
-
- formControl = new FormControl('123', [validator]);
- expect(formControl.hasError('required')).toBeFalse();
-
- });
-
-});
-
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { FormControl } from '@angular/forms';
+import { ValidationUtils } from './validation-utils';
+
+describe('ValidationUtils', () => {
+ it('should create an instance', () => {
+ expect(new ValidationUtils()).toBeTruthy();
+ });
+
+ it('should create generalRegexValidator that tests regex pattern', () => {
+ const twoDigitRegex = new RegExp('^[0-9]{2}[:.,-]?$');
+ const validator = ValidationUtils.generalRegexValidator(twoDigitRegex, 'twoDigit');
+ const goodFC: FormControl = new FormControl('12', [validator]);
+ const badFC: FormControl = new FormControl('123', [validator]);
+ expect(goodFC.hasError('twoDigit')).toBe(false);
+ expect(badFC.hasError('twoDigit')).toBeTruthy();
+ });
+
+ it('should create requiredValidator that tests if the input is empty spaces', () => {
+ const validator = ValidationUtils.requiredValidator();
+ let formControl: FormControl = new FormControl('', [validator]);
+ expect(formControl.hasError('required')).toBe(true);
+
+ formControl = new FormControl(' ', [validator]);
+ expect(formControl.hasError('required')).toBe(true);
+
+ formControl = new FormControl(null, [validator]);
+ expect(formControl.hasError('required')).toBe(true);
+
+ formControl = new FormControl(undefined, [validator]);
+ expect(formControl.hasError('required')).toBe(true);
+
+ formControl = new FormControl('123', [validator]);
+ expect(formControl.hasError('required')).toBe(false);
+ });
+});
diff --git a/projects/ui-components/internal-shared/validation-utils.ts b/projects/ui-components/internal-shared/validation-utils.ts
index 4cffffb0..8d17521b 100644
--- a/projects/ui-components/internal-shared/validation-utils.ts
+++ b/projects/ui-components/internal-shared/validation-utils.ts
@@ -6,85 +6,87 @@ import { LfMetadataValidationUtils } from '@laserfiche/lf-js-utils';
/** @internal */
export enum ValidationRule {
- LONG_INT = 'longint',
- MAX_LENGTH = 'maxlength',
- NUMBER = 'number',
- PATTERN = 'pattern',
- NUMERIC = 'numeric',
- REQUIRED = 'required',
- SHORT_INT = 'shortint',
- TIME = 'time',
- DATEPICKER_PARSE = 'datepickerParse',
- DATETIME_PICKER_PARSE = 'datetimePickerParse'
+ LONG_INT = 'longint',
+ MAX_LENGTH = 'maxlength',
+ NUMBER = 'number',
+ PATTERN = 'pattern',
+ NUMERIC = 'numeric',
+ REQUIRED = 'required',
+ SHORT_INT = 'shortint',
+ TIME = 'time',
+ DATEPICKER_PARSE = 'datepickerParse',
+ DATETIME_PICKER_PARSE = 'datetimePickerParse',
}
// @dynamic
/** @internal */
export class ValidationUtils {
+ /** Only one error will be displayed at a time (in this priority order) */
+ static validationRulesInPriorityOrder: ValidationRule[] = [
+ ValidationRule.DATEPICKER_PARSE,
+ ValidationRule.DATETIME_PICKER_PARSE,
+ ValidationRule.TIME,
+ ValidationRule.REQUIRED,
+ ValidationRule.MAX_LENGTH,
+ ValidationRule.PATTERN,
+ ValidationRule.NUMERIC,
+ ValidationRule.NUMBER,
+ ValidationRule.LONG_INT,
+ ValidationRule.SHORT_INT,
+ ];
- /** Only one error will be displayed at a time (in this priority order) */
- static validationRulesInPriorityOrder: ValidationRule[] = [
- ValidationRule.DATEPICKER_PARSE,
- ValidationRule.DATETIME_PICKER_PARSE,
- ValidationRule.TIME,
- ValidationRule.REQUIRED,
- ValidationRule.MAX_LENGTH,
- ValidationRule.PATTERN,
- ValidationRule.NUMERIC,
- ValidationRule.NUMBER,
- ValidationRule.LONG_INT,
- ValidationRule.SHORT_INT,
- ];
+ static numericValidator(constraint: string): ValidatorFn {
+ const validatorFn: ValidatorFn = (control: AbstractControl): { [key: string]: any } | null => {
+ // Don't try to match regex if there is no value
+ if (!control.value) {
+ return null;
+ }
+ const validationFailedExplanation = { numeric: { value: control.value } };
+ const matchesConstraint = LfMetadataValidationUtils.evaluateNumericValidationExpression(
+ control.value,
+ constraint
+ );
+ return matchesConstraint ? null : validationFailedExplanation;
+ };
+ return validatorFn;
+ }
- static numericValidator(constraint: string): ValidatorFn {
- const validatorFn: ValidatorFn = (control: AbstractControl): { [key: string]: any } | null => {
- // Don't try to match regex if there is no value
- if (!control.value) {
- return null;
- }
- const validationFailedExplanation = { numeric: { value: control.value } };
- const matchesConstraint = LfMetadataValidationUtils.evaluateNumericValidationExpression(control.value, constraint);
- return matchesConstraint ? null : validationFailedExplanation;
- };
- return validatorFn;
- }
+ static generalRegexValidator(regex: RegExp, ruleName?: string): ValidatorFn {
+ const validatorFn: ValidatorFn = (control: AbstractControl): { [key: string]: any } | null => {
+ // Don't try to match regex if there is no value
+ if (!control.value) {
+ return null;
+ }
+ ruleName = ruleName ?? ValidationRule.PATTERN; // default regex validation key
+ const validationFailedExplanation = {
+ [ruleName]: { value: control.value },
+ };
+ const matchesRegex = regex.test(control.value);
+ return matchesRegex ? null : validationFailedExplanation;
+ };
+ return validatorFn;
+ }
- static generalRegexValidator(regex: RegExp, ruleName?: string): ValidatorFn {
- const validatorFn: ValidatorFn = (control: AbstractControl): { [key: string]: any } | null => {
- // Don't try to match regex if there is no value
- if (!control.value) {
- return null;
- }
- ruleName = ruleName ?? ValidationRule.PATTERN; // default regex validation key
- const validationFailedExplanation = {
- [ruleName]: { value: control.value },
- };
- const matchesRegex = regex.test(control.value);
- return matchesRegex ? null : validationFailedExplanation;
- };
- return validatorFn;
- }
+ static requiredValidator(): ValidatorFn {
+ const validatorFn: ValidatorFn = (control: AbstractControl): { [key: string]: any } | null => {
+ // Don't try to match regex if there is no value
+ const validationFailedExplanation = {
+ ['required']: { value: control.value },
+ };
+ if (control.value == null || control.value === '') {
+ return validationFailedExplanation;
+ }
+ const isEmptyString = LfMetadataValidationUtils.isNullOrEmpty(control.value.toString());
+ return isEmptyString ? validationFailedExplanation : null;
+ };
+ return validatorFn;
+ }
- static requiredValidator(): ValidatorFn {
- const validatorFn: ValidatorFn = (control: AbstractControl): { [key: string]: any } | null => {
- // Don't try to match regex if there is no value
- const validationFailedExplanation = {
- ['required']: { value: control.value },
- };
- if (!control.value) {
- return validationFailedExplanation;
- }
- const isEmptyString = LfMetadataValidationUtils.isNullOrEmpty(control.value.toString());
- return isEmptyString ? validationFailedExplanation : null;
- };
- return validatorFn;
- }
-
- static createTimeValidator(): ValidatorFn {
- const regexAMPM: string = `([0][0-9]|[1][0-2]):[0-5][0-9]:[0-5][0-9] ([AMP]){2}`;
- const regex24Hour: string = `([01]?[0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]`;
- const regexNoSeconds: string = `([01]?[0-9]|2[0-3]):[0-5][0-9]`;
- const timePattern = new RegExp(`${regexAMPM}|${regex24Hour}|${regexNoSeconds}`);
- return ValidationUtils.generalRegexValidator(timePattern, 'time');
- }
+ static createTimeValidator(): ValidatorFn {
+ const regexAMPM: string = `([0][0-9]|[1][0-2]):[0-5][0-9]:[0-5][0-9] ([AMP]){2}`;
+ const regex24Hour: string = `([01]?[0-9]|2[0-3]):[0-5][0-9]:[0-5][0-9]`;
+ const regexNoSeconds: string = `([01]?[0-9]|2[0-3]):[0-5][0-9]`;
+ const timePattern = new RegExp(`${regexAMPM}|${regex24Hour}|${regexNoSeconds}`);
+ return ValidationUtils.generalRegexValidator(timePattern, 'time');
+ }
}
diff --git a/projects/ui-components/karma.conf.js b/projects/ui-components/karma.conf.js
deleted file mode 100644
index d0cc5c7a..00000000
--- a/projects/ui-components/karma.conf.js
+++ /dev/null
@@ -1,40 +0,0 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-// Karma configuration file, see link for more information
-// https://karma-runner.github.io/1.0/config/configuration-file.html
-process.env.CHROME_BIN = require('puppeteer').executablePath();
-
-module.exports = function (config) {
- config.set({
- basePath: '',
- frameworks: ['jasmine', '@angular-devkit/build-angular'],
- plugins: [
- require('karma-jasmine'),
- require('karma-chrome-launcher'),
- require('karma-jasmine-html-reporter'),
- require('karma-coverage-istanbul-reporter'),
- require('@angular-devkit/build-angular/plugins/karma'),
- require('karma-junit-reporter'),
- ],
- client: {
- clearContext: false, // leave Jasmine Spec Runner output visible in browser
- },
- coverageIstanbulReporter: {
- dir: require('path').join(
- __dirname,
- '../../coverage/lf-documentation'
- ),
- reports: ['html', 'lcovonly', 'text-summary'],
- fixWebpackSourcePaths: true,
- },
- reporters: ['progress', 'kjhtml', 'junit'],
- port: 9876,
- colors: true,
- logLevel: config.LOG_INFO,
- autoWatch: true,
- browsers: ['Chrome'],
- singleRun: false,
- restartOnFileChange: true
- });
-};
diff --git a/projects/ui-components/lf-checklist/checklist.ts b/projects/ui-components/lf-checklist/checklist.ts
index ebe84d92..c38ed84c 100644
--- a/projects/ui-components/lf-checklist/checklist.ts
+++ b/projects/ui-components/lf-checklist/checklist.ts
@@ -1,12 +1,12 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { ChecklistOption } from './options/checklist-option';
-import { ChecklistItem } from './items/checklist-item';
-
-export interface Checklist {
- name: string;
- checklistItems: ChecklistItem[];
- checklistOptions: ChecklistOption[];
- collapsible?: boolean;
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ChecklistOption } from './options/checklist-option';
+import { ChecklistItem } from './items/checklist-item';
+
+export interface Checklist {
+ name: string;
+ checklistItems: ChecklistItem[];
+ checklistOptions: ChecklistOption[];
+ collapsible?: boolean;
+}
diff --git a/projects/ui-components/lf-checklist/items/checklist-item.ts b/projects/ui-components/lf-checklist/items/checklist-item.ts
index 36c38156..98e3f92e 100644
--- a/projects/ui-components/lf-checklist/items/checklist-item.ts
+++ b/projects/ui-components/lf-checklist/items/checklist-item.ts
@@ -1,15 +1,15 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-export interface ChecklistItem {
- icon: string | string[];
- name: string;
- id: string;
- checked: boolean;
- disabled: boolean;
- editable: boolean;
- constraint?: string;
- constraintError?: string;
- isRequired?: boolean;
- requiredError?: string;
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+export interface ChecklistItem {
+ icon: string | string[];
+ name: string;
+ id: string;
+ checked: boolean;
+ disabled: boolean;
+ editable: boolean;
+ constraint?: string;
+ constraintError?: string;
+ isRequired?: boolean;
+ requiredError?: string;
+}
diff --git a/projects/ui-components/lf-checklist/items/items-validation-text.pipe.spec.ts b/projects/ui-components/lf-checklist/items/items-validation-text.pipe.spec.ts
index f8522bf5..fdca0394 100644
--- a/projects/ui-components/lf-checklist/items/items-validation-text.pipe.spec.ts
+++ b/projects/ui-components/lf-checklist/items/items-validation-text.pipe.spec.ts
@@ -1,183 +1,195 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { AbstractControl, FormControl, Validators } from '@angular/forms';
-import { CoreUtils } from '@laserfiche/lf-js-utils';
-import { Observable, of } from 'rxjs';
-import { ChecklistItem } from './checklist-item';
-import { ItemsValidationTextPipe } from './items-validation-text.pipe';
-
-describe('ItemsValidationTextPipe', () => {
- const mappedObservables: Map> = new Map>([
- ['REQUIRED', of('required')]
- ]);
- const mappedObservablesNoRequired: Map> = new Map>([
- ['TEST', of('test')]
- ]);
- const pipe = new ItemsValidationTextPipe();
-
- it('create an instance', () => {
- expect(pipe).toBeTruthy();
- });
-
- it('should return localized string if no requiredError', async () => {
- const item: ChecklistItem = {
- checked: true,
- id: '1',
- name: 'test',
- icon: 'test',
- disabled: false,
- editable: true
- };
- const testForm: AbstractControl = new FormControl('test form');
- testForm.setValidators(Validators.required);
- testForm.setValue('');
- let value: string | undefined;
- pipe.transform(item, testForm, mappedObservables).subscribe((val) => {
- value = val;
- });
- // needed to trigger first value of subscription
- testForm.updateValueAndValidity();
- const expectedValue = 'required';
-
- await CoreUtils.waitForConditionAsync(
- () => value === expectedValue,
- () => { throw Error(`Timeout: value was ${value}`); }
- );
- expect(value).toEqual(expectedValue);
- });
-
- it('should return undefined if no localized string and no requiredError', async () => {
- const item: ChecklistItem = {
- checked: true,
- id: '1',
- name: 'test',
- icon: 'test',
- disabled: false,
- editable: true
- };
- const testForm: AbstractControl = new FormControl('test form');
- testForm.setValidators(Validators.required);
- testForm.setValue('');
- let value: string | undefined;
- pipe.transform(item, testForm, mappedObservablesNoRequired).subscribe((val) => {
- value = val;
- });
- // needed to trigger first value of subscription
- testForm.updateValueAndValidity();
-
- await CoreUtils.waitForConditionAsync(
- () => value === undefined,
- () => { throw Error(`Timeout: value was ${value}`); }
- );
- expect(value).toBeUndefined;
- });
-
- it('should return no error if no validators on form', async () => {
- const item: ChecklistItem = {
- checked: true,
- id: '1',
- name: 'test',
- icon: 'test',
- disabled: false,
- editable: true
- };
- const testForm: AbstractControl = new FormControl('test form');
- let value: string | undefined;
- pipe.transform(item, testForm, mappedObservables).subscribe((val) => {
- value = val;
- });
- // needed to trigger first value of subscription
- testForm.updateValueAndValidity();
-
- await CoreUtils.waitForConditionAsync(
- () => value === undefined,
- () => { throw Error(`Timeout: value was ${value}`); }
- );
- expect(value).toBeUndefined();
- });
-
- it('should return requiredError if required field is empty and requiredError exists', async () => {
- const expected: string = 'item is required';
- const item: ChecklistItem = {
- checked: true,
- id: '1',
- name: 'test',
- icon: 'test',
- disabled: false,
- editable: true,
- requiredError: expected
- };
- const testForm: AbstractControl = new FormControl('test form');
- testForm.setValidators(Validators.required);
- testForm.setValue('');
- let value: string | undefined;
- pipe.transform(item, testForm, mappedObservables).subscribe((val) => {
- value = val;
- });
- // needed to trigger first value of subscription
- testForm.updateValueAndValidity();
-
- await CoreUtils.waitForConditionAsync(
- () => value === expected,
- () => { throw Error(`Timeout: value was ${value}`); }
- );
- expect(value).toEqual(expected);
- });
-
- it('should return constraintError if field does not follow constraint', async () => {
- const expected: string = 'item is constrained';
- const item: ChecklistItem = {
- checked: true,
- id: '1',
- name: 'test',
- icon: 'test',
- disabled: false,
- editable: true,
- constraintError: expected
- };
- const testForm: AbstractControl = new FormControl('test form');
- testForm.setValidators(Validators.pattern('^\d$'));
- testForm.setValue('aa');
- let value: string | undefined;
- pipe.transform(item, testForm, mappedObservables).subscribe((val) => {
- value = val;
- });
- // needed to trigger first value of subscription
- testForm.updateValueAndValidity();
-
- await CoreUtils.waitForConditionAsync(
- () => value === expected,
- () => { throw Error(`Timeout: value was ${value}`); }
- );
- expect(value).toEqual(expected);
- });
-
- it('should return constraintError if field does not follow constraint and localizedString does not exist', async () => {
- const expected: string = 'item is constrained';
- const item: ChecklistItem = {
- checked: true,
- id: '1',
- name: 'test',
- icon: 'test',
- disabled: false,
- editable: true,
- constraintError: expected
- };
- const testForm: AbstractControl = new FormControl('test form');
- testForm.setValidators(Validators.pattern('^\d$'));
- testForm.setValue('aa');
- let value: string | undefined;
- pipe.transform(item, testForm, mappedObservablesNoRequired).subscribe((val) => {
- value = val;
- });
- // needed to trigger first value of subscription
- testForm.updateValueAndValidity();
-
- await CoreUtils.waitForConditionAsync(
- () => value === expected,
- () => { throw Error(`Timeout: value was ${value}`); }
- );
- expect(value).toEqual(expected);
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { AbstractControl, FormControl, Validators } from '@angular/forms';
+import { CoreUtils } from '@laserfiche/lf-js-utils';
+import { Observable, of } from 'rxjs';
+import { ChecklistItem } from './checklist-item';
+import { ItemsValidationTextPipe } from './items-validation-text.pipe';
+
+describe('ItemsValidationTextPipe', () => {
+ const mappedObservables: Map> = new Map>([
+ ['REQUIRED', of('required')],
+ ]);
+ const mappedObservablesNoRequired: Map> = new Map>([
+ ['TEST', of('test')],
+ ]);
+ const pipe = new ItemsValidationTextPipe();
+
+ it('create an instance', () => {
+ expect(pipe).toBeTruthy();
+ });
+
+ it('should return localized string if no requiredError', async () => {
+ const item: ChecklistItem = {
+ checked: true,
+ id: '1',
+ name: 'test',
+ icon: 'test',
+ disabled: false,
+ editable: true,
+ };
+ const testForm: AbstractControl = new FormControl('test form');
+ testForm.setValidators(Validators.required);
+ testForm.setValue('');
+ let value: string | undefined;
+ pipe.transform(item, testForm, mappedObservables).subscribe((val) => {
+ value = val;
+ });
+ // needed to trigger first value of subscription
+ testForm.updateValueAndValidity();
+ const expectedValue = 'required';
+
+ await CoreUtils.waitForConditionAsync(
+ () => value === expectedValue,
+ () => {
+ throw Error(`Timeout: value was ${value}`);
+ }
+ );
+ expect(value).toEqual(expectedValue);
+ });
+
+ it('should return undefined if no localized string and no requiredError', async () => {
+ const item: ChecklistItem = {
+ checked: true,
+ id: '1',
+ name: 'test',
+ icon: 'test',
+ disabled: false,
+ editable: true,
+ };
+ const testForm: AbstractControl = new FormControl('test form');
+ testForm.setValidators(Validators.required);
+ testForm.setValue('');
+ let value: string | undefined;
+ pipe.transform(item, testForm, mappedObservablesNoRequired).subscribe((val) => {
+ value = val;
+ });
+ // needed to trigger first value of subscription
+ testForm.updateValueAndValidity();
+
+ await CoreUtils.waitForConditionAsync(
+ () => value === undefined,
+ () => {
+ throw Error(`Timeout: value was ${value}`);
+ }
+ );
+ expect(value).toBeUndefined;
+ });
+
+ it('should return no error if no validators on form', async () => {
+ const item: ChecklistItem = {
+ checked: true,
+ id: '1',
+ name: 'test',
+ icon: 'test',
+ disabled: false,
+ editable: true,
+ };
+ const testForm: AbstractControl = new FormControl('test form');
+ let value: string | undefined;
+ pipe.transform(item, testForm, mappedObservables).subscribe((val) => {
+ value = val;
+ });
+ // needed to trigger first value of subscription
+ testForm.updateValueAndValidity();
+
+ await CoreUtils.waitForConditionAsync(
+ () => value === undefined,
+ () => {
+ throw Error(`Timeout: value was ${value}`);
+ }
+ );
+ expect(value).toBeUndefined();
+ });
+
+ it('should return requiredError if required field is empty and requiredError exists', async () => {
+ const expected: string = 'item is required';
+ const item: ChecklistItem = {
+ checked: true,
+ id: '1',
+ name: 'test',
+ icon: 'test',
+ disabled: false,
+ editable: true,
+ requiredError: expected,
+ };
+ const testForm: AbstractControl = new FormControl('test form');
+ testForm.setValidators(Validators.required);
+ testForm.setValue('');
+ let value: string | undefined;
+ pipe.transform(item, testForm, mappedObservables).subscribe((val) => {
+ value = val;
+ });
+ // needed to trigger first value of subscription
+ testForm.updateValueAndValidity();
+
+ await CoreUtils.waitForConditionAsync(
+ () => value === expected,
+ () => {
+ throw Error(`Timeout: value was ${value}`);
+ }
+ );
+ expect(value).toEqual(expected);
+ });
+
+ it('should return constraintError if field does not follow constraint', async () => {
+ const expected: string = 'item is constrained';
+ const item: ChecklistItem = {
+ checked: true,
+ id: '1',
+ name: 'test',
+ icon: 'test',
+ disabled: false,
+ editable: true,
+ constraintError: expected,
+ };
+ const testForm: AbstractControl = new FormControl('test form');
+ testForm.setValidators(Validators.pattern('^\d$'));
+ testForm.setValue('aa');
+ let value: string | undefined;
+ pipe.transform(item, testForm, mappedObservables).subscribe((val) => {
+ value = val;
+ });
+ // needed to trigger first value of subscription
+ testForm.updateValueAndValidity();
+
+ await CoreUtils.waitForConditionAsync(
+ () => value === expected,
+ () => {
+ throw Error(`Timeout: value was ${value}`);
+ }
+ );
+ expect(value).toEqual(expected);
+ });
+
+ it('should return constraintError if field does not follow constraint and localizedString does not exist', async () => {
+ const expected: string = 'item is constrained';
+ const item: ChecklistItem = {
+ checked: true,
+ id: '1',
+ name: 'test',
+ icon: 'test',
+ disabled: false,
+ editable: true,
+ constraintError: expected,
+ };
+ const testForm: AbstractControl = new FormControl('test form');
+ testForm.setValidators(Validators.pattern('^\d$'));
+ testForm.setValue('aa');
+ let value: string | undefined;
+ pipe.transform(item, testForm, mappedObservablesNoRequired).subscribe((val) => {
+ value = val;
+ });
+ // needed to trigger first value of subscription
+ testForm.updateValueAndValidity();
+
+ await CoreUtils.waitForConditionAsync(
+ () => value === expected,
+ () => {
+ throw Error(`Timeout: value was ${value}`);
+ }
+ );
+ expect(value).toEqual(expected);
+ });
+});
diff --git a/projects/ui-components/lf-checklist/items/items-validation-text.pipe.ts b/projects/ui-components/lf-checklist/items/items-validation-text.pipe.ts
index ec85168f..951f205f 100644
--- a/projects/ui-components/lf-checklist/items/items-validation-text.pipe.ts
+++ b/projects/ui-components/lf-checklist/items/items-validation-text.pipe.ts
@@ -1,75 +1,77 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Pipe, PipeTransform } from '@angular/core';
-import { AbstractControl } from '@angular/forms';
-import { ValidationRule } from '@laserfiche/lf-ui-components/internal-shared';
-import { Observable, of } from 'rxjs';
-import { map, mergeMap } from 'rxjs/operators';
-import { ChecklistItem } from './checklist-item';
-
-/**
- * Pipe that gets the error message for a checklist item depending on the type of error
- */
-@Pipe({
- name: 'itemsValidationText'
-})
-export class ItemsValidationTextPipe implements PipeTransform {
-
- constructor() { }
-
- private localizedStrings?: Map>;
-
- /**
- * Gets the error message for the checklist item as an observable
- * @param currentChecklistItem The metadata for the current checklist item
- * @param currentFormControl The form control for the checklist item (i.e. value, validity)
- * @param localizedStrings Map of possible localized strings
- * @returns The error message for the checklist item
- */
- transform(currentChecklistItem: ChecklistItem, currentFormControl: AbstractControl, localizedStrings: Map>): Observable {
- this.localizedStrings = localizedStrings;
- const validationObservable = this.getValidationObservable(currentChecklistItem, currentFormControl);
- return validationObservable;
- }
-
- private getValidationObservable(item: ChecklistItem, formControl: AbstractControl): Observable {
- const validationObservable = formControl?.statusChanges.pipe(mergeMap((validity) => {
-
- const validationRuleName = this.getBrokenValidationRule(formControl);
- if (validationRuleName === ValidationRule.PATTERN) {
- return of(item?.constraintError);
- }
- if (validationRuleName === ValidationRule.REQUIRED && item.requiredError) {
- return of(item.requiredError);
- }
- const requiredString = this.localizedStrings?.get('REQUIRED');
- if (requiredString) {
- return requiredString?.pipe(map((stringVal) => {
- if (validationRuleName === ValidationRule.REQUIRED) {
- return item?.requiredError ? item.requiredError : stringVal;
- }
- else {
- return undefined;
- }
- }));
- }
- else {
- return of(undefined);
- }
-
- }));
- return validationObservable;
-
- }
-
- private getBrokenValidationRule(formControl: AbstractControl): string | undefined {
- if (formControl?.hasError(ValidationRule.PATTERN)) {
- return ValidationRule.PATTERN;
- }
- else if (formControl?.hasError(ValidationRule.REQUIRED)) {
- return ValidationRule.REQUIRED;
- }
- return undefined;
- }
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Pipe, PipeTransform } from '@angular/core';
+import { AbstractControl } from '@angular/forms';
+import { ValidationRule } from '@laserfiche/lf-ui-components/internal-shared';
+import { Observable, of } from 'rxjs';
+import { map, mergeMap } from 'rxjs/operators';
+import { ChecklistItem } from './checklist-item';
+
+/**
+ * Pipe that gets the error message for a checklist item depending on the type of error
+ */
+@Pipe({
+ name: 'itemsValidationText',
+ standalone: true,
+})
+export class ItemsValidationTextPipe implements PipeTransform {
+ constructor() {}
+
+ private localizedStrings?: Map>;
+
+ /**
+ * Gets the error message for the checklist item as an observable
+ * @param currentChecklistItem The metadata for the current checklist item
+ * @param currentFormControl The form control for the checklist item (i.e. value, validity)
+ * @param localizedStrings Map of possible localized strings
+ * @returns The error message for the checklist item
+ */
+ transform(
+ currentChecklistItem: ChecklistItem,
+ currentFormControl: AbstractControl,
+ localizedStrings: Map>
+ ): Observable {
+ this.localizedStrings = localizedStrings;
+ const validationObservable = this.getValidationObservable(currentChecklistItem, currentFormControl);
+ return validationObservable;
+ }
+
+ private getValidationObservable(item: ChecklistItem, formControl: AbstractControl): Observable {
+ const validationObservable = formControl?.statusChanges.pipe(
+ mergeMap((validity) => {
+ const validationRuleName = this.getBrokenValidationRule(formControl);
+ if (validationRuleName === ValidationRule.PATTERN) {
+ return of(item?.constraintError);
+ }
+ if (validationRuleName === ValidationRule.REQUIRED && item.requiredError) {
+ return of(item.requiredError);
+ }
+ const requiredString = this.localizedStrings?.get('REQUIRED');
+ if (requiredString) {
+ return requiredString?.pipe(
+ map((stringVal) => {
+ if (validationRuleName === ValidationRule.REQUIRED) {
+ return item?.requiredError ? item.requiredError : stringVal;
+ } else {
+ return undefined;
+ }
+ })
+ );
+ } else {
+ return of(undefined);
+ }
+ })
+ );
+ return validationObservable;
+ }
+
+ private getBrokenValidationRule(formControl: AbstractControl): string | undefined {
+ if (formControl?.hasError(ValidationRule.PATTERN)) {
+ return ValidationRule.PATTERN;
+ } else if (formControl?.hasError(ValidationRule.REQUIRED)) {
+ return ValidationRule.REQUIRED;
+ }
+ return undefined;
+ }
+}
diff --git a/projects/ui-components/lf-checklist/items/items.component.css b/projects/ui-components/lf-checklist/items/items.component.css
index 55ef79f2..9fd7ac11 100644
--- a/projects/ui-components/lf-checklist/items/items.component.css
+++ b/projects/ui-components/lf-checklist/items/items.component.css
@@ -1,6 +1,5 @@
.lf-checklist-item {
display: flex;
- align-items: center;
width: 100%;
}
@@ -13,7 +12,7 @@
display: flex;
min-width: 30px;
width: 30px;
- height: 30px;
+ height: 34px;
align-items: center;
margin-right: 5px;
position: relative;
@@ -29,7 +28,6 @@
.lf-checklist-field {
width: 100%;
- height: 34px;
}
.mat-mdc-input-element {
@@ -53,10 +51,11 @@
max-width: calc(100% - 35px);
}
-::ng-deep mat-form-field.lf-checklist-field >
-.mat-mdc-form-field-wrapper >
-.mat-form-field-flex >
-.mat-form-field-infix {
+::ng-deep
+ mat-form-field.lf-checklist-field
+ > .mat-mdc-form-field-wrapper
+ > .mat-form-field-flex
+ > .mat-form-field-infix {
border-top: 0px;
padding: 0px;
width: inherit;
@@ -66,25 +65,34 @@
display: none;
}
-
-::ng-deep mat-form-field.lf-checklist-field >
-.mat-mdc-text-field-wrapper >
-.mat-mdc-form-field-flex >
-.mat-mdc-form-field-infix input{
+::ng-deep
+ mat-form-field.lf-checklist-field
+ > .mat-mdc-text-field-wrapper
+ > .mat-mdc-form-field-flex
+ > .mat-mdc-form-field-infix
+ input {
font-size: 14px;
}
+::ng-deep
+ mat-form-field.lf-checklist-field
+ > .mat-mdc-text-field-wrapper
+ > .mat-mdc-form-field-flex
+ > .mat-mdc-form-field-infix {
+ min-height: 28px !important;
+ padding: 4px 0;
+}
+
::ng-deep .lf-checklist-item .mat-form-field-appearance-fill .mat-mdc-form-field-flex {
align-items: center;
border-radius: 2px;
- border-color: #6D6D6D;
+ border-color: #6d6d6d;
border-width: 1px;
border-style: solid;
box-sizing: border-box;
}
::ng-deep .lf-checklist-item .mat-mdc-form-field-subscript-wrapper {
- position: static;
margin-top: 0px;
}
@@ -99,9 +107,9 @@
}
::ng-deep .lf-checklist-item .mat-form-field-disabled .mat-mdc-form-field-flex {
- border-color: #F3F3F3;
- background-color: #F3F3F3;
- color: #8A8A8A;
+ border-color: #f3f3f3;
+ background-color: #f3f3f3;
+ color: #8a8a8a;
}
::ng-deep .lf-checklist-item .mat-focused .mat-mdc-form-field-flex {
@@ -115,4 +123,4 @@
::ng-deep .lf-checklist-item .mdc-text-field,
::ng-deep .lf-checklist-item .mdc-text-field--filled {
border-radius: 0px;
-}
\ No newline at end of file
+}
diff --git a/projects/ui-components/lf-checklist/items/items.component.html b/projects/ui-components/lf-checklist/items/items.component.html
index 7770da8a..ef9b4b8e 100644
--- a/projects/ui-components/lf-checklist/items/items.component.html
+++ b/projects/ui-components/lf-checklist/items/items.component.html
@@ -2,24 +2,46 @@
Licensed under the MIT License. See LICENSE in the project root for license information.-->
-
-
-
-
-
-
-
-
- {{item | itemsValidationText: getSingleField(currentIndex): LOCALIZED_STRINGS | async}}
-
-
-
+ @for (item of items; track item; let currentIndex = $index) {
+
+
+ @if (getIcons(item).length > 0) {
+
+ @for (icon of getIcons(item); track icon) {
+
+ }
+
+ }
+
+
+
+ {{ item | itemsValidationText: getSingleField(currentIndex) : LOCALIZED_STRINGS | async }}
+
+ }
+
-
-
+
+
+
+ }
diff --git a/projects/ui-components/lf-checklist/items/items.component.spec.ts b/projects/ui-components/lf-checklist/items/items.component.spec.ts
index cf270f4d..72844c0f 100644
--- a/projects/ui-components/lf-checklist/items/items.component.spec.ts
+++ b/projects/ui-components/lf-checklist/items/items.component.spec.ts
@@ -1,32 +1,30 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import { MatInputModule } from '@angular/material/input';
-
-import { ItemsComponent } from './items.component';
-
-describe('ItemsComponent', () => {
- let component: ItemsComponent;
- let fixture: ComponentFixture
;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [ItemsComponent],
- imports: [FormsModule, MatInputModule, MatFormFieldModule, ReactiveFormsModule]
- })
- .compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(ItemsComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+
+import { ItemsComponent } from './items.component';
+
+describe('ItemsComponent', () => {
+ let component: ItemsComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [ItemsComponent, FormsModule, MatInputModule, MatFormFieldModule, ReactiveFormsModule],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ItemsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/ui-components/lf-checklist/items/items.component.ts b/projects/ui-components/lf-checklist/items/items.component.ts
index d1015aad..5683e30a 100644
--- a/projects/ui-components/lf-checklist/items/items.component.ts
+++ b/projects/ui-components/lf-checklist/items/items.component.ts
@@ -1,138 +1,163 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Component, OnInit, Input, Output, EventEmitter, ChangeDetectorRef } from '@angular/core';
-import { FormArray, FormBuilder, FormControl, FormGroup, ValidatorFn } from '@angular/forms';
-import { AppLocalizationService, ValidationUtils } from '@laserfiche/lf-ui-components/internal-shared';
-import { Observable } from 'rxjs';
-import { ChecklistItem } from './checklist-item';
-
-/**
- * @internal
- */
-@Component({
- selector: 'lf-items-component',
- templateUrl: './items.component.html',
- styleUrls: ['./items.component.css', './../lf-checklist/lf-checklist.component.css']
-})
-export class ItemsComponent implements OnInit {
-
- @Input() items: ChecklistItem[] = [];
- @Output() itemsChanged: EventEmitter = new EventEmitter();
- labelPosition: string = 'before';
- checklistParentForm: FormGroup;
-
- /** @internal */
- readonly LOCALIZED_STRINGS: Map> = new Map>([
- ['REQUIRED', this.localizationService.getStringLaserficheObservable('REQUIRED')]
- ]);
-
- constructor(private fb: FormBuilder, private ref: ChangeDetectorRef, private localizationService: AppLocalizationService) {
- this.checklistParentForm = this.fb.group({
- fieldArray: new FormArray([])
- });
- }
-
- ngOnInit(): void {
- this.refreshChecklistItems();
- }
-
- @Input()
- refreshChecklistItems = () => {
- this.syncFormControlDataToFieldValues();
- this.ref.detectChanges();
- };
-
- forceValidation: () => boolean = () => {
- let isValid = true;
- this.items.forEach((val, index) => {
- if (val.editable && val.checked) {
- // don't return invalid if not editable, since user can't fix it
- const control = this.getSingleField(index);
- this.triggerValidation(control);
- const controlValid = control.valid;
- if (!controlValid) {
- isValid = false;
- }
- }
- });
- return isValid;
- };
-
- onItemCheckboxChanged(index: number) {
- const field = this.getSingleField(index);
- const item = this.items[index];
- item.name = field.value;
- if (!item.checked) {
- field.clearValidators();
- }
- else {
- this.addValidators(item, field);
- }
- this.triggerValidation(field);
- this.itemsChanged.emit();
- }
-
- private addValidators(item: ChecklistItem, field: FormControl) {
- const constraint = item.constraint;
- const required = item.isRequired;
- const validators: ValidatorFn[] = [];
- if (constraint) {
- validators.push(ValidationUtils.generalRegexValidator(new RegExp(constraint)));
- }
- if (required) {
- const requiredRegexValidator = ValidationUtils.requiredValidator();
- validators.push(requiredRegexValidator);
- }
- field.setValidators(validators);
- }
-
- private triggerValidation(field: FormControl) {
- field.markAsDirty();
- field.updateValueAndValidity();
- }
-
- onItemValueChanged(index: number) {
- const field = this.getSingleField(index);
- this.items[index].name = field.value;
- this.itemsChanged.emit();
- }
-
- getIcons(item: ChecklistItem): string[] {
- // TODO add error icon if there is an error on node
- if (typeof (item.icon) === 'string') {
- return [item.icon];
- }
- else {
- return item.icon;
- }
- }
-
- private getArray(): FormArray {
- return this.checklistParentForm.get('fieldArray') as FormArray;
- }
-
- getSingleField(index: number): FormControl {
- return this.getArray().controls[index] as FormControl;
- }
-
- syncFormControlDataToFieldValues() {
- this.getArray().clear();
- if (this.items) {
- this.items.forEach(item => {
- const formControl = new FormControl(item.name);
- if (item.editable && item.checked) {
- this.addValidators(item, formControl);
- }
- if (!item.editable || item.disabled) {
- formControl.disable();
- }
- this.getArray().push(formControl);
- });
- }
- }
-
- doNothing(event: KeyboardEvent) {
- event.preventDefault();
- }
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Component, OnInit, Input, Output, EventEmitter, ChangeDetectorRef, inject } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import {
+ FormArray,
+ FormBuilder,
+ FormControl,
+ FormGroup,
+ ValidatorFn,
+ FormsModule,
+ ReactiveFormsModule,
+} from '@angular/forms';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatInputModule } from '@angular/material/input';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { AppLocalizationService, ValidationUtils } from '@laserfiche/lf-ui-components/internal-shared';
+import { Observable } from 'rxjs';
+import { ChecklistItem } from './checklist-item';
+import { ItemsValidationTextPipe } from './items-validation-text.pipe';
+
+/**
+ * @internal
+ */
+@Component({
+ selector: 'lf-items-component',
+ templateUrl: './items.component.html',
+ styleUrls: ['./items.component.css', './../lf-checklist/lf-checklist.component.css'],
+ standalone: true,
+ imports: [
+ CommonModule,
+ FormsModule,
+ ReactiveFormsModule,
+ MatFormFieldModule,
+ MatInputModule,
+ MatCheckboxModule,
+ ItemsValidationTextPipe,
+ ],
+})
+export class ItemsComponent implements OnInit {
+ private fb = inject(FormBuilder);
+ private ref = inject(ChangeDetectorRef);
+ private localizationService = inject(AppLocalizationService);
+
+ @Input() items: ChecklistItem[] = [];
+ @Output() itemsChanged: EventEmitter = new EventEmitter();
+ labelPosition: string = 'before';
+ checklistParentForm: FormGroup;
+
+ /** @internal */
+ readonly LOCALIZED_STRINGS: Map> = new Map>([
+ ['REQUIRED', this.localizationService.getStringLaserficheObservable('REQUIRED')],
+ ]);
+
+ constructor() {
+ this.checklistParentForm = this.fb.group({
+ fieldArray: new FormArray([]),
+ });
+ }
+
+ ngOnInit(): void {
+ this.refreshChecklistItems();
+ }
+
+ @Input()
+ refreshChecklistItems = () => {
+ this.syncFormControlDataToFieldValues();
+ this.ref.detectChanges();
+ };
+
+ forceValidation: () => boolean = () => {
+ let isValid = true;
+ this.items.forEach((val, index) => {
+ if (val.editable && val.checked) {
+ // don't return invalid if not editable, since user can't fix it
+ const control = this.getSingleField(index);
+ this.triggerValidation(control);
+ const controlValid = control.valid;
+ if (!controlValid) {
+ isValid = false;
+ }
+ }
+ });
+ return isValid;
+ };
+
+ onItemCheckboxChanged(index: number) {
+ const field = this.getSingleField(index);
+ const item = this.items[index];
+ item.name = field.value;
+ if (!item.checked) {
+ field.clearValidators();
+ } else {
+ this.addValidators(item, field);
+ }
+ this.triggerValidation(field);
+ this.itemsChanged.emit();
+ }
+
+ private addValidators(item: ChecklistItem, field: FormControl) {
+ const constraint = item.constraint;
+ const required = item.isRequired;
+ const validators: ValidatorFn[] = [];
+ if (constraint) {
+ validators.push(ValidationUtils.generalRegexValidator(new RegExp(constraint)));
+ }
+ if (required) {
+ const requiredRegexValidator = ValidationUtils.requiredValidator();
+ validators.push(requiredRegexValidator);
+ }
+ field.setValidators(validators);
+ }
+
+ private triggerValidation(field: FormControl) {
+ field.markAsDirty();
+ field.markAllAsTouched();
+ field.updateValueAndValidity();
+ }
+
+ onItemValueChanged(index: number) {
+ const field = this.getSingleField(index);
+ this.items[index].name = field.value;
+ this.itemsChanged.emit();
+ }
+
+ getIcons(item: ChecklistItem): string[] {
+ // TODO add error icon if there is an error on node
+ if (typeof item.icon === 'string') {
+ return [item.icon];
+ } else {
+ return item.icon;
+ }
+ }
+
+ private getArray(): FormArray {
+ return this.checklistParentForm.get('fieldArray') as FormArray;
+ }
+
+ getSingleField(index: number): FormControl {
+ return this.getArray().controls[index] as FormControl;
+ }
+
+ syncFormControlDataToFieldValues() {
+ this.getArray().clear();
+ if (this.items) {
+ this.items.forEach((item) => {
+ const formControl = new FormControl(item.name);
+ if (item.editable && item.checked) {
+ this.addValidators(item, formControl);
+ }
+ if (!item.editable || item.disabled) {
+ formControl.disable();
+ }
+ this.getArray().push(formControl);
+ });
+ }
+ }
+
+ doNothing(event: KeyboardEvent) {
+ event.preventDefault();
+ }
+}
diff --git a/projects/ui-components/lf-checklist/lf-checklist-public-api.ts b/projects/ui-components/lf-checklist/lf-checklist-public-api.ts
index 01d85ecc..38c2e7f7 100644
--- a/projects/ui-components/lf-checklist/lf-checklist-public-api.ts
+++ b/projects/ui-components/lf-checklist/lf-checklist-public-api.ts
@@ -1,10 +1,8 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-export * from './lf-checklist.service';
-export * from './lf-checklist/lf-checklist.component';
-export * from './checklist';
-export * from './items/checklist-item';
-export * from './options/checklist-option';
-
-export * from './lf-checklist.module';
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+export { LfChecklistService } from './lf-checklist.service';
+export { LfChecklistProviders, LfChecklistComponent } from './lf-checklist/lf-checklist.component';
+export { Checklist } from './checklist';
+export { ChecklistItem } from './items/checklist-item';
+export { ChecklistOption } from './options/checklist-option';
diff --git a/projects/ui-components/lf-checklist/lf-checklist.module.ts b/projects/ui-components/lf-checklist/lf-checklist.module.ts
deleted file mode 100644
index 3c9d9578..00000000
--- a/projects/ui-components/lf-checklist/lf-checklist.module.ts
+++ /dev/null
@@ -1,55 +0,0 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { CUSTOM_ELEMENTS_SCHEMA, Injector, NgModule } from '@angular/core';
-import { LfChecklistComponent } from './lf-checklist/lf-checklist.component';
-import { ItemsComponent } from './items/items.component';
-import { OptionsComponent } from './options/options.component';
-import { CommonModule } from '@angular/common';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { MatButtonModule } from '@angular/material/button';
-import { MatCheckboxModule } from '@angular/material/checkbox';
-import { MatFormFieldModule } from '@angular/material/form-field';
-import { MatInputModule } from '@angular/material/input';
-import { BrowserModule } from '@angular/platform-browser';
-import { MatExpansionModule } from '@angular/material/expansion';
-import { createCustomElement } from '@angular/elements';
-import { ItemsValidationTextPipe } from './items/items-validation-text.pipe';
-
-@NgModule({
- declarations: [
- LfChecklistComponent,
- ItemsComponent,
- OptionsComponent,
- ItemsValidationTextPipe
- ],
- imports: [
- BrowserModule,
- CommonModule,
- MatButtonModule,
- MatCheckboxModule,
- FormsModule,
- MatFormFieldModule,
- MatInputModule,
- ReactiveFormsModule,
- MatExpansionModule
- ],
- exports: [
- LfChecklistComponent
- ],
- providers: [],
- bootstrap: [LfChecklistComponent],
- schemas: [CUSTOM_ELEMENTS_SCHEMA],
-})
-export class LfChecklistModule {
- /** @internal */
- constructor(
- /** @internal */ injector: Injector
- ) {
- const elementName: string = 'lf-checklist';
- if (window.customElements && !customElements.get(elementName)) {
- const newElement = createCustomElement(LfChecklistComponent, { injector });
- customElements.define(elementName, newElement);
- }
- }
-}
diff --git a/projects/ui-components/lf-checklist/lf-checklist.service.ts b/projects/ui-components/lf-checklist/lf-checklist.service.ts
index e998b381..9f7c8a9a 100644
--- a/projects/ui-components/lf-checklist/lf-checklist.service.ts
+++ b/projects/ui-components/lf-checklist/lf-checklist.service.ts
@@ -1,8 +1,8 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Checklist } from './checklist';
-
-export interface LfChecklistService {
- loadChecklistsAsync(): Promise;
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Checklist } from './checklist';
+
+export interface LfChecklistService {
+ loadChecklistsAsync(): Promise;
+}
diff --git a/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.css b/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.css
index e39fb321..d6729dc6 100644
--- a/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.css
+++ b/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.css
@@ -1,67 +1,67 @@
-.lf-checklist-name-container {
- padding: 15px 0 5px 0;
- white-space: nowrap;
- display: block;
- text-overflow: ellipsis;
- overflow: hidden;
-}
-
-.lf-checklist-button-container {
- padding-top: 10px;
- display: flex;
- justify-content: flex-end;
-}
-
-::ng-deep .checklist-expansion-panel .mat-expansion-panel-header.mat-expanded {
- height: 48px;
-}
-
-::ng-deep .checklist-expansion-panel.mat-expansion-panel {
- position: static;
- border-radius: 0;
- box-shadow: none;
- padding: 0;
-}
-
-::ng-deep .checklist-expansion-panel mat-expansion-panel-header {
- padding-left: 0;
- padding-right: 10px;
-}
-
-::ng-deep .checklist-expansion-panel div.mat-expansion-panel-body {
- padding: 0;
-}
-
-mat-checkbox.lf-checkbox.full-width-checkbox {
- width: 100%;
-}
-
-::ng-deep .lf-checklist-field > .mdc-text-field--filled:not(.mdc-text-field--disabled) {
- background-color: white;
-}
-
-::ng-deep .lf-checklist-field .mat-mdc-form-field-flex {
- height: inherit;
-}
-
-::ng-deep .lf-checklist-field .mat-mdc-form-field-infix {
- height: inherit;
- padding: 0;
-}
-
-::ng-deep .lf-checklist-option .mat-mdc-checkbox-touch-target {
- height: 20px;
- width: 20px;
-}
-
-::ng-deep .lf-checklist-option .mdc-checkbox__native-control {
- top: 10px;
- left: 10px;
- right: 10px;
- width: 20px;
- height: 20px;
-}
-
-.lf-checklist-option > .lf-checkbox {
- height: 25px;
-}
+.lf-checklist-name-container {
+ padding: 15px 0 5px 0;
+ white-space: nowrap;
+ display: block;
+ text-overflow: ellipsis;
+ overflow: hidden;
+}
+
+.lf-checklist-button-container {
+ padding-top: 10px;
+ display: flex;
+ justify-content: flex-end;
+}
+
+::ng-deep .checklist-expansion-panel .mat-expansion-panel-header.mat-expanded {
+ height: 48px;
+}
+
+::ng-deep .checklist-expansion-panel.mat-expansion-panel {
+ position: static;
+ border-radius: 0;
+ box-shadow: none;
+ padding: 0;
+}
+
+::ng-deep .checklist-expansion-panel mat-expansion-panel-header {
+ padding-left: 0;
+ padding-right: 10px;
+}
+
+::ng-deep .checklist-expansion-panel div.mat-expansion-panel-body {
+ padding: 0;
+}
+
+mat-checkbox.lf-checkbox.full-width-checkbox {
+ width: 100%;
+}
+
+::ng-deep .lf-checklist-field > .mdc-text-field--filled:not(.mdc-text-field--disabled) {
+ background-color: white;
+}
+
+::ng-deep .lf-checklist-field .mat-mdc-form-field-flex {
+ height: inherit;
+}
+
+::ng-deep .lf-checklist-field .mat-mdc-form-field-infix {
+ height: inherit;
+ padding: 0;
+}
+
+::ng-deep .lf-checklist-option .mat-mdc-checkbox-touch-target {
+ height: 20px;
+ width: 20px;
+}
+
+::ng-deep .lf-checklist-option .mdc-checkbox__native-control {
+ top: 10px;
+ left: 10px;
+ right: 10px;
+ width: 20px;
+ height: 20px;
+}
+
+.lf-checklist-option > .lf-checkbox {
+ height: 25px;
+}
diff --git a/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.html b/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.html
index d2404fd9..088420fc 100644
--- a/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.html
+++ b/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.html
@@ -1,41 +1,77 @@
-
-
-
-
-
-
-
- {{checklist.name}}
-
-
-
-
-
-
-
-
- {{checklist.name}}
-
-
-
-
-
-
-
- {{action_button_text}}
- {{cancel_button_text}}
-
-
+
+ @for (checklist of checklists; track checklist) {
+
+ @if (!checklist.collapsible) {
+
+
+ {{
+ checklist.name
+ }}
+
+ @if (checklist.checklistItems.length > 0) {
+
+ }
+ @if (checklist.checklistOptions.length > 0) {
+
+ }
+
+ }
+ @if (checklist.collapsible) {
+
+
+
+
+ {{
+ checklist.name
+ }}
+
+
+ @if (checklist.checklistItems.length > 0) {
+
+
+ }
+
+ }
+
+
+ @if (action_button_text) {
+
+ {{ action_button_text }}
+
+ }
+ @if (cancel_button_text) {
+
+ {{ cancel_button_text }}
+
+ }
+
+
;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [ LfChecklistComponent ]
- })
- .compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(LfChecklistComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { LfChecklistComponent } from './lf-checklist.component';
+
+describe('LfChecklistComponent', () => {
+ let component: LfChecklistComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [LfChecklistComponent],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(LfChecklistComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.ts b/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.ts
index f81d7e86..0a55dba7 100644
--- a/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.ts
+++ b/projects/ui-components/lf-checklist/lf-checklist/lf-checklist.component.ts
@@ -1,93 +1,88 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import {
- Component,
- Input,
- Output,
- EventEmitter,
- NgZone,
- ViewChildren,
- QueryList,
-} from '@angular/core';
-import { ItemsComponent } from '../items/items.component';
-import { Checklist } from '../checklist';
-import { LfChecklistService } from '../lf-checklist.service';
-
-export interface LfChecklistProviders {
- checklistService: LfChecklistService;
-}
-
-@Component({
- selector: 'lf-checklist-component',
- templateUrl: './lf-checklist.component.html',
- styleUrls: ['./lf-checklist.component.css'],
-})
-export class LfChecklistComponent {
-
- @Input() action_button_text: string | undefined;
-
- @Input() cancel_button_text: string | undefined;
-
- @Output() checklistChanged: EventEmitter = new EventEmitter();
-
- @Output() actionClick: EventEmitter = new EventEmitter();
-
- @Output() cancelClick: EventEmitter = new EventEmitter();
-
- /** @internal */
- @ViewChildren(ItemsComponent) private itemsComponents!: QueryList;
-
-
- /** @internal */
- checklists: Checklist[] = [];
-
- /** @internal */
- constructor(
- /** @internal */
- private zone: NgZone
- ) { }
-
- @Input() initAsync = async (
- providers: LfChecklistProviders
- ): Promise => {
- return new Promise((resolve) => {
- this.zone.run(() => {
- requestAnimationFrame(async () => {
- this.checklists =
- await providers.checklistService.loadChecklistsAsync();
- this.itemsComponents?.forEach((component) =>
- component.refreshChecklistItems()
- );
- this.checklistChanged.emit(this.checklists);
- resolve();
- });
- });
- });
- };
-
- @Input() forceValidation = (): boolean => {
- let isValid = true;
- this.itemsComponents.forEach((component) => {
- if (!component.forceValidation()) {
- isValid = false;
- }
- });
- return isValid;
- };
-
- /** @internal */
- onActionButtonClicked(): void {
- this.actionClick.emit(this.checklists);
- }
-
- /** @internal */
- onCancelButtonClicked(): void {
- this.cancelClick.emit(this.checklists);
- }
-
- /** @internal */
- emitChecklistChanges(): void {
- this.checklistChanged.emit(this.checklists);
- }
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import {
+ Component,
+ Input,
+ Output,
+ EventEmitter,
+ ChangeDetectorRef,
+ ViewChildren,
+ QueryList,
+ inject,
+} from '@angular/core';
+
+import { MatExpansionModule } from '@angular/material/expansion';
+import { ItemsComponent } from '../items/items.component';
+import { OptionsComponent } from '../options/options.component';
+import { Checklist } from '../checklist';
+import { LfChecklistService } from '../lf-checklist.service';
+
+export interface LfChecklistProviders {
+ checklistService: LfChecklistService;
+}
+
+@Component({
+ selector: 'lf-checklist-component',
+ templateUrl: './lf-checklist.component.html',
+ styleUrls: ['./lf-checklist.component.css'],
+ standalone: true,
+ imports: [MatExpansionModule, ItemsComponent, OptionsComponent],
+})
+export class LfChecklistComponent {
+ /**@internal */
+ private ref = inject(ChangeDetectorRef);
+
+ @Input() action_button_text: string | undefined;
+
+ @Input() cancel_button_text: string | undefined;
+
+ @Output() checklistChanged: EventEmitter = new EventEmitter();
+
+ @Output() actionClick: EventEmitter = new EventEmitter();
+
+ @Output() cancelClick: EventEmitter = new EventEmitter();
+
+ /** @internal */
+ @ViewChildren(ItemsComponent) private itemsComponents!: QueryList;
+
+ /** @internal */
+ checklists: Checklist[] = [];
+
+ @Input() initAsync = async (providers: LfChecklistProviders): Promise => {
+ return new Promise((resolve) => {
+ requestAnimationFrame(async () => {
+ this.checklists = await providers.checklistService.loadChecklistsAsync();
+ this.itemsComponents?.forEach((component) => component.refreshChecklistItems());
+ this.checklistChanged.emit(this.checklists);
+ this.ref.markForCheck();
+ resolve();
+ });
+ });
+ };
+
+ @Input() forceValidation = (): boolean => {
+ let isValid = true;
+ this.itemsComponents.forEach((component) => {
+ if (!component.forceValidation()) {
+ isValid = false;
+ }
+ });
+ return isValid;
+ };
+
+ /** @internal */
+ onActionButtonClicked(): void {
+ this.actionClick.emit(this.checklists);
+ }
+
+ /** @internal */
+ onCancelButtonClicked(): void {
+ this.cancelClick.emit(this.checklists);
+ }
+
+ /** @internal */
+ emitChecklistChanges(): void {
+ this.checklistChanged.emit(this.checklists);
+ }
+}
diff --git a/projects/ui-components/lf-checklist/ng-package.json b/projects/ui-components/lf-checklist/ng-package.json
index 809b5830..c453c0de 100644
--- a/projects/ui-components/lf-checklist/ng-package.json
+++ b/projects/ui-components/lf-checklist/ng-package.json
@@ -1,5 +1,5 @@
{
"lib": {
- "entryFile": "./lf-checklist-public-api.ts"
+ "entryFile": "./lf-checklist-public-api.ts"
}
}
diff --git a/projects/ui-components/lf-checklist/options/checklist-option.ts b/projects/ui-components/lf-checklist/options/checklist-option.ts
index d95aa36f..4eafb438 100644
--- a/projects/ui-components/lf-checklist/options/checklist-option.ts
+++ b/projects/ui-components/lf-checklist/options/checklist-option.ts
@@ -1,8 +1,8 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-export interface ChecklistOption {
- name: string;
- checked: boolean;
- disabled: boolean;
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+export interface ChecklistOption {
+ name: string;
+ checked: boolean;
+ disabled: boolean;
+}
diff --git a/projects/ui-components/lf-checklist/options/options.component.css b/projects/ui-components/lf-checklist/options/options.component.css
index b73dc732..a429f033 100644
--- a/projects/ui-components/lf-checklist/options/options.component.css
+++ b/projects/ui-components/lf-checklist/options/options.component.css
@@ -1,12 +1,12 @@
-.lf-checklist-option-container {
- padding: 5px 0 5px 45px;
-}
-
-::ng-deep .lf-checklist-option-container .lf-checkbox.mat-mdc-checkbox .mdc-label {
- text-overflow: ellipsis;
- overflow: hidden;
-}
-
-.lf-checklist-option {
- margin-bottom: 5px;
-}
+.lf-checklist-option-container {
+ padding: 5px 0 5px 45px;
+}
+
+::ng-deep .lf-checklist-option-container .lf-checkbox.mat-mdc-checkbox .mdc-label {
+ text-overflow: ellipsis;
+ overflow: hidden;
+}
+
+.lf-checklist-option {
+ margin-bottom: 5px;
+}
diff --git a/projects/ui-components/lf-checklist/options/options.component.html b/projects/ui-components/lf-checklist/options/options.component.html
index abb7c72d..888d22bb 100644
--- a/projects/ui-components/lf-checklist/options/options.component.html
+++ b/projects/ui-components/lf-checklist/options/options.component.html
@@ -1,9 +1,19 @@
-
-
-
+
+
+
+ @for (option of options; track option) {
+
+ {{ option.name }}
+
+ }
+
;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [ OptionsComponent ]
- })
- .compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(OptionsComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { OptionsComponent } from './options.component';
+
+describe('OptionsComponent', () => {
+ let component: OptionsComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [OptionsComponent],
+ }).compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(OptionsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/projects/ui-components/lf-checklist/options/options.component.ts b/projects/ui-components/lf-checklist/options/options.component.ts
index f09b0bc0..9b5c25a4 100644
--- a/projects/ui-components/lf-checklist/options/options.component.ts
+++ b/projects/ui-components/lf-checklist/options/options.component.ts
@@ -1,22 +1,26 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Component, Input, EventEmitter, Output } from '@angular/core';
-import { ChecklistOption } from './checklist-option';
-
-@Component({
- selector: 'lf-options-component',
- templateUrl: './options.component.html',
- styleUrls: ['./options.component.css', './../lf-checklist/lf-checklist.component.css'],
-})
-export class OptionsComponent {
-
- @Input() options: ChecklistOption[] = [];
- @Output() optionsChanged: EventEmitter = new EventEmitter();
-
- constructor() { }
-
- onOptionCheckboxChanged() {
- this.optionsChanged.emit();
- }
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { Component, Input, EventEmitter, Output } from '@angular/core';
+
+import { FormsModule } from '@angular/forms';
+import { MatCheckboxModule } from '@angular/material/checkbox';
+import { ChecklistOption } from './checklist-option';
+
+@Component({
+ selector: 'lf-options-component',
+ templateUrl: './options.component.html',
+ styleUrls: ['./options.component.css', './../lf-checklist/lf-checklist.component.css'],
+ standalone: true,
+ imports: [FormsModule, MatCheckboxModule],
+})
+export class OptionsComponent {
+ @Input() options: ChecklistOption[] = [];
+ @Output() optionsChanged: EventEmitter = new EventEmitter();
+
+ constructor() {}
+
+ onOptionCheckboxChanged() {
+ this.optionsChanged.emit();
+ }
+}
diff --git a/projects/ui-components/lf-login/lf-login-public-api.ts b/projects/ui-components/lf-login/lf-login-public-api.ts
index 51fee5ef..cc9d4e2d 100644
--- a/projects/ui-components/lf-login/lf-login-public-api.ts
+++ b/projects/ui-components/lf-login/lf-login-public-api.ts
@@ -1,7 +1,11 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-export * from './lf-login.component';
-export * from './login-utils/lf-login-types';
-
-export * from './lf-login.module';
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+export { LfLoginComponent } from './lf-login.component';
+export {
+ AuthorizationCredentials,
+ AccountEndpoints,
+ AbortedLoginError,
+ LfBeforeFetchResult,
+ LfHttpRequestHandler,
+} from './login-utils/lf-login-types';
diff --git a/projects/ui-components/lf-login/lf-login.component.css b/projects/ui-components/lf-login/lf-login.component.css
index fcfe20ad..88b4f76d 100644
--- a/projects/ui-components/lf-login/lf-login.component.css
+++ b/projects/ui-components/lf-login/lf-login.component.css
@@ -1,58 +1,58 @@
-::ng-deep .login-menu-item button.lf-button.login-button {
- background: transparent;
- border: none;
-}
-
-::ng-deep .lf-login-mat-menu .mat-mdc-menu-item {
- min-height: unset;
- line-height: 34px;
- height: 34px;
-}
-
-::ng-deep .lf-login-mat-menu.mat-mdc-menu-panel {
- min-height: 0;
- width: 200px;
-}
-
-.lf-login-menu-trigger {
- display: flex;
- align-items: center;
- justify-content: center;
- border-radius: 50%;
- border-style: solid;
- border-width: 1px;
- border-color: #333333;
- height: 30px;
- width: 30px;
- padding: 0px;
- cursor: pointer;
-}
-
-.lf-login-trigger-button {
- display: flex;
- align-items: center;
- justify-content: center;
-}
-
-.lf-login-initials {
- line-height: 1;
-}
-
-.lf-login-menu-button {
- color: #333333;
-}
-
-.lf-login-menu-internal-button {
- background: none;
- border: none;
-}
-
-.lf-login-wrapper-button {
- background: transparent;
- border: none;
- text-align: center;
-}
-
-::ng-deep .lf-button.login-button {
- width: 200px;
-}
+::ng-deep .login-menu-item button.lf-button.login-button {
+ background: transparent;
+ border: none;
+}
+
+::ng-deep .lf-login-mat-menu .mat-mdc-menu-item {
+ min-height: unset;
+ line-height: 34px;
+ height: 34px;
+}
+
+::ng-deep .lf-login-mat-menu.mat-mdc-menu-panel {
+ min-height: 0;
+ width: 200px;
+}
+
+.lf-login-menu-trigger {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ border-radius: 50%;
+ border-style: solid;
+ border-width: 1px;
+ border-color: #333333;
+ height: 30px;
+ width: 30px;
+ padding: 0px;
+ cursor: pointer;
+}
+
+.lf-login-trigger-button {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.lf-login-initials {
+ line-height: 1;
+}
+
+.lf-login-menu-button {
+ color: #333333;
+}
+
+.lf-login-menu-internal-button {
+ background: none;
+ border: none;
+}
+
+.lf-login-wrapper-button {
+ background: transparent;
+ border: none;
+ text-align: center;
+}
+
+::ng-deep .lf-button.login-button {
+ width: 200px;
+}
diff --git a/projects/ui-components/lf-login/lf-login.component.html b/projects/ui-components/lf-login/lf-login.component.html
index e52fed79..ca4c9c64 100644
--- a/projects/ui-components/lf-login/lf-login.component.html
+++ b/projects/ui-components/lf-login/lf-login.component.html
@@ -1,30 +1,38 @@
-
-
-
-
- {{buttonText | async}}
-
-
-
-
+
+
+@if (!isMenuMode) {
+
+
+ {{ buttonText | async }}
+
+
+}
+
+@if (isMenuMode) {
+
+}
diff --git a/projects/ui-components/lf-login/lf-login.component.spec.ts b/projects/ui-components/lf-login/lf-login.component.spec.ts
index 055ac66c..71b1405c 100644
--- a/projects/ui-components/lf-login/lf-login.component.spec.ts
+++ b/projects/ui-components/lf-login/lf-login.component.spec.ts
@@ -1,174 +1,116 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { MatMenuModule } from '@angular/material/menu';
-import { LfLoginComponent } from './lf-login.component';
-import { LoginState } from '@laserfiche/lf-ui-components/shared';
-
-describe('LfLoginComponent', () => {
- let component: LfLoginComponent;
- let fixture: ComponentFixture;
-
- beforeEach(async () => {
- await TestBed.configureTestingModule({
- declarations: [ LfLoginComponent ],
- imports: [
- MatMenuModule
- ]
- })
- .compileComponents();
- });
-
- beforeEach(() => {
- fixture = TestBed.createComponent(LfLoginComponent);
- component = fixture.componentInstance;
- fixture.detectChanges();
- // @ts-ignore
- component.loginService.removeFromLocalStorage();
- // @ts-ignore
- component.loginService._state = LoginState.LoggedOut;
- // @ts-ignore
- component.loginService.authorize_url_host_name = 'laserfiche.com';
- });
-
- it('should create', () => {
- expect(component).toBeTruthy();
- });
- it('parseCallbackURI with no state', () => {
- const uriParams = component.parseCallbackURI('https://testurl.com');
- expect(uriParams).toBeUndefined();
- });
-
- it('parseCallbackURI with code, domain, and customerId', () => {
- const uriParams = component.parseCallbackURI('https://testurl.com/hi?code=auth-code&state=lf-login-redirect&domain=laserfiche.com&customerId=123456789');
- expect(uriParams).toEqual(
- {
- authorizationCode: 'auth-code',
- cloudSubDomain: 'laserfiche.com',
- customerId: '123456789'
- });
- });
-
- it('parseCallbackURI with error', () => {
- const uriParams = component.parseCallbackURI('https://testurl.com/hi?state=lf-login-redirect&error=test-name&description=test-description');
- expect(uriParams).toEqual({ error: { name: 'test-name', description: 'test-description' } });
- });
-
- it('parseCallbackURI with state but no code or error', () => {
- expect(() => component.parseCallbackURI('https://testurl.com/hi?state=lf-login-redirect')).toThrow();
- });
-
- it('extractErrorFromUrl with error', () => {
- const testUrl = new URL('https://test-url.com?error=test-name&description=test-description');
- const error = component.extractErrorFromUrl(testUrl);
- expect(error).toEqual({ name: 'test-name', description: 'test-description' });
- });
-
- it('extractErrorFromUrl with error, no description', () => {
- const testUrl = new URL('https://test-url.com?error=test-name');
- const error = component.extractErrorFromUrl(testUrl);
- expect(error).toEqual({ name: 'test-name', description: 'unknown' });
- });
-
- it('extractErrorFromUrl no error, no description', () => {
- const testUrl = new URL('https://test-url.com');
- const error = component.extractErrorFromUrl(testUrl);
- expect(error).toBeUndefined();
- });
-
- it('determineCurrentState as LoggedIn', () => {
- const testHeader = btoa('{"test": "test"}');
- const encodedJWT = btoa('{"csid": "123456789", "trid": "1"}');
- // @ts-ignore
- component.loginService.storeInLocalStorage(
- {
- accessToken: `${testHeader}.${encodedJWT}.test`,
- refreshToken: 'test-refresh',
- expiresIn: '100',
- tokenType: 'bearer'
- },
- '123456789',
- 'laserfiche.com'
- );
-
- const currentState = component.determineCurrentState(undefined);
- expect(currentState).toEqual(LoginState.LoggedIn);
- });
-
- it('determineCurrentState as LoggedOut', () => {
- const currentState = component.determineCurrentState(undefined);
- expect(currentState).toEqual(LoginState.LoggedOut);
- });
-
- it('determineCurrentState as LoggingIn', () => {
- const currentCodeState = component.determineCurrentState({ authorizationCode: 'test-code' });
- expect(currentCodeState).toEqual(LoginState.LoggingIn);
- const currentErrorState = component.determineCurrentState({ error: { name: 'test-name', description: 'test-description' } });
- expect(currentErrorState).toEqual(LoginState.LoggingIn);
- });
-
- it('createRefreshTokenRequest creates request', () => {
- // @ts-ignore
- component.loginService._accessToken = { accessToken: 'test-access', refreshToken: 'test-refresh', expiresIn: '100', tokenType: 'bearer' };
- const refreshTokenRequest = component.createRefreshTokenRequest();
- expect(refreshTokenRequest.body).toEqual('grant_type=refresh_token&refresh_token=test-refresh&client_id=undefined');
- expect(refreshTokenRequest.method).toEqual('POST');
- expect(refreshTokenRequest.headers).toEqual({ 'Content-Type': 'application/x-www-form-urlencoded' });
- });
-
- it('createRefreshTokenRequest throws when no refresh token', () => {
- expect(() => component.createRefreshTokenRequest()).toThrow();
- });
-
- it('extractCodeFromUrl gets code from url', () => {
- const testUrl = new URL('https://test-url.com?code=test-code');
- const codeFromUrl = component.extractCodeFromUrl(testUrl);
- expect(codeFromUrl).toEqual('test-code');
-
- const testUrlNoCode = new URL('https://test-url.com');
- const noCodeFromUrl = component.extractCodeFromUrl(testUrlNoCode);
- expect(noCodeFromUrl).toBeUndefined();
- });
-
- it('getAuthorizeUrl returns full OAuth url', () => {
- const authUrl = component.getAuthorizeUrl();
- expect(authUrl).toEqual('https://signin.laserfiche.com/oauth/Authorize?client_id=undefined&redirect_uri=undefined&scope=undefined&response_type=code&response_mode=query&state=lf-login-redirect&code_challenge=undefined&code_challenge_method=S256');
- });
-
- it('getFullLogoutUrl returns logout url', () => {
- const testHeader = btoa('{"test": "test"}');
- const encodedJWT = btoa('{"csid": "123456789", "trid": "1"}');
- // @ts-ignore
- component.loginService.storeInLocalStorage(
- {
- accessToken: `${testHeader}.${encodedJWT}.test`,
- refreshToken: 'test-refresh',
- expiresIn: '100',
- tokenType: 'bearer'
- },
- '123456789',
- 'laserfiche.com');
- component.redirect_uri = 'test-url';
- const logoutUrl = component.getFullLogoutUrl();
-
- expect(logoutUrl).toEqual('https://accounts.laserfiche.com/WebSTS/?wa=wsignout1.0&wreply=test-url');
- });
-
- it('getFullLogoutUrl when no signout url available', () => {
- // @ts-ignore
- component.loginService._accountEndpoints = undefined;
- expect(component.getFullLogoutUrl()).toBeUndefined();
- });
-
- it('concatStrings should return second string when no first string', () => {
- expect(component.concatStrings(undefined, 'test')).toEqual('test');
- });
-
- it('concatStrings should return concatenated strings when there is first string', () => {
- expect(component.concatStrings('hi', 'test')).toEqual('hi test');
- expect(component.concatStrings('hi ', 'test')).toEqual('hi test');
- expect(component.concatStrings('hi ', ' test')).toEqual('hi test');
- expect(component.concatStrings('hi', ' test')).toEqual('hi test');
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { MatMenuModule } from '@angular/material/menu';
+import { LfLoginComponent } from './lf-login.component';
+import { LoginState } from '@laserfiche/lf-ui-components/shared';
+import { LfLoginService } from './login-utils/lf-login.service';
+import { AccountEndpoints } from './lf-login-public-api';
+
+describe('LfLoginComponent', () => {
+ let loginService: LfLoginService;
+ let component: LfLoginComponent;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [LfLoginComponent, MatMenuModule],
+ providers: [LfLoginService],
+ }).compileComponents();
+ loginService = TestBed.inject(LfLoginService);
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(LfLoginComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ loginService.removeFromLocalStorage();
+ loginService._state = LoginState.LoggedOut;
+ loginService.authorize_url_host_name = 'laserfiche.com';
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+
+ it('parseCallbackURI with no state', () => {
+ const uriParams = component.parseCallbackURI('https://testurl.com');
+ expect(uriParams).toBeUndefined();
+ });
+
+ it('parseCallbackURI should call exchangeRedirectUriQueryParams from login provider', () => {
+ const mockExchangeRedirectUriQueryParams = vi.fn();
+ loginService.loginProvider = {
+ exchangeRedirectUriQueryParams: mockExchangeRedirectUriQueryParams,
+ } as any;
+
+ component.parseCallbackURI(
+ 'https://testurl.com/hi?code=auth-code&state=lf-login-redirect&domain=laserfiche.com&customerId=123456789'
+ );
+ expect(mockExchangeRedirectUriQueryParams).toHaveBeenCalled();
+ });
+
+ it('createRefreshTokenRequest creates request', () => {
+ loginService._accessToken = {
+ accessToken: 'test-access',
+ refreshToken: 'test-refresh',
+ expiresIn: '100',
+ tokenType: 'bearer',
+ };
+ const refreshTokenRequest = component.createRefreshTokenRequest();
+ expect(refreshTokenRequest.body).toEqual('grant_type=refresh_token&refresh_token=test-refresh&client_id=undefined');
+ expect(refreshTokenRequest.method).toEqual('POST');
+ expect(refreshTokenRequest.headers).toEqual({ 'Content-Type': 'application/x-www-form-urlencoded' });
+ });
+
+ it('createRefreshTokenRequest throws when no refresh token', () => {
+ expect(() => component.createRefreshTokenRequest()).toThrow();
+ });
+
+ it('getAuthorizeUrl returns full OAuth url', () => {
+ const testLoginProvider = { getBaseAuthorizeUrl: () => 'https://signin.laserfiche.com/oauth/Authorize' } as any;
+ loginService.loginProvider = testLoginProvider;
+
+ const authUrl = component.getAuthorizeUrl();
+ expect(authUrl).toEqual(
+ 'https://signin.laserfiche.com/oauth/Authorize?redirect_uri=undefined&response_type=code&response_mode=query&state=lf-login-redirect&code_challenge=undefined&code_challenge_method=S256'
+ );
+ });
+
+ describe('getFullLogoutUrl', () => {
+ it('should return a logout URL when wsignoutUrl is available', () => {
+ const accountEndpoints: AccountEndpoints | undefined = {
+ wsignoutUrl: 'https://accounts.laserfiche.com/WebSTS/?wa=wsignout1.0',
+ webClientUrl: '',
+ regionalDomain: '',
+ oauthAuthorizeUrl: '',
+ };
+ const originalGetAccountEndpointsSpy = vi.spyOn(loginService, 'getAccountEndpoints');
+ originalGetAccountEndpointsSpy.mockReturnValue(accountEndpoints);
+
+ component.redirect_uri = 'test-url';
+ const logoutUrl = component.getFullLogoutUrl();
+
+ expect(logoutUrl).toEqual('https://accounts.laserfiche.com/WebSTS/?wa=wsignout1.0&wreply=test-url');
+ });
+
+ it('should return undefined when wsignoutUrl is unavailable', () => {
+ const originalGetAccountEndpointsSpy = vi.spyOn(loginService, 'getAccountEndpoints');
+ originalGetAccountEndpointsSpy.mockReturnValue(undefined);
+
+ expect(component.getFullLogoutUrl()).toBeUndefined();
+ });
+ });
+
+ it('concatStrings should return second string when no first string', () => {
+ expect(component.concatStrings(undefined, 'test')).toEqual('test');
+ });
+
+ it('concatStrings should return concatenated strings when there is first string', () => {
+ expect(component.concatStrings('hi', 'test')).toEqual('hi test');
+ expect(component.concatStrings('hi ', 'test')).toEqual('hi test');
+ expect(component.concatStrings('hi ', ' test')).toEqual('hi test');
+ expect(component.concatStrings('hi', ' test')).toEqual('hi test');
+ });
+});
diff --git a/projects/ui-components/lf-login/lf-login.component.ts b/projects/ui-components/lf-login/lf-login.component.ts
index 2cd78114..e511b9a1 100644
--- a/projects/ui-components/lf-login/lf-login.component.ts
+++ b/projects/ui-components/lf-login/lf-login.component.ts
@@ -1,758 +1,738 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import {
- ChangeDetectorRef,
- Component,
- EventEmitter,
- Input,
- OnChanges,
- OnDestroy,
- Output,
- SimpleChanges,
- AfterViewInit,
-} from '@angular/core';
-import { Observable, of, Subscription } from 'rxjs';
-import { AccountInfo, RedirectUriQueryParams } from './login-utils/lf-login-internal-types';
-import {
- AbortedLoginError,
- AccountEndpoints,
- AuthorizationCredentials,
- LfBeforeFetchResult,
- LfHttpRequestHandler,
-} from './login-utils/lf-login-types';
-import { LoginMode, LoginState, RedirectBehavior } from '@laserfiche/lf-ui-components/shared';
-import { AppLocalizationService } from '@laserfiche/lf-ui-components/internal-shared';
-import { LfLoginService } from './login-utils/lf-login.service';
-import { ApiException, PKCEUtils, TokenClient } from '@laserfiche/lf-api-client-core';
-
-const LOGIN_REDIRECT_STATE = 'lf-login-redirect';
-const CODE_CHALLENGE_METHOD = 'S256';
-@Component({
- selector: 'lf-login-component',
- templateUrl: './lf-login.component.html',
- styleUrls: ['./lf-login.component.css'],
-})
-export class LfLoginComponent implements OnChanges, OnDestroy, AfterViewInit {
- /** @internal */
- private readonly CLOUDDEV = 'clouddev';
- /** @internal */
- private readonly CLOUDTEST = 'cloudtest';
-
- @Input() mode: LoginMode = LoginMode.Button;
-
- /**
- * @return {LfHttpRequestHandler}
- * Returns the LfHttpRequestHandler that can be used
- * to instantiate a repository API client.
- */
- @Input()
- get authorizationRequestHandler(): LfHttpRequestHandler {
- return {
- beforeFetchRequestAsync: this.beforeFetchRequestAsync.bind(this),
- afterFetchResponseAsync: this.afterFetchResponseAsync.bind(this),
- };
- }
-
- /** @internal */
- get isMenuMode(): boolean {
- return this.mode === LoginMode.Menu;
- }
-
- /** @internal */
- _sign_in_text: Observable = this.localizationService.getStringLaserficheObservable('SIGN_IN');
- /** @internal */
- _sign_out_text: Observable = this.localizationService.getStringLaserficheObservable('SIGN_OUT');
- /** @internal */
- _signing_in_text: Observable = this.localizationService.getStringLaserficheObservable('SIGNING_IN');
- /** @internal */
- _signing_out_text: Observable = this.localizationService.getStringLaserficheObservable('SIGNING_OUT');
-
- @Input() set sign_in_text(text: string) {
- this._sign_in_text = of(text);
- }
- @Input() set sign_out_text(text: string) {
- this._sign_out_text = of(text);
- }
- @Input() set signing_in_text(text: string) {
- this._signing_in_text = of(text);
- }
- @Input() set signing_out_text(text: string) {
- this._signing_out_text = of(text);
- }
-
- /** @internal */
- buttonText: Observable = this._sign_in_text;
-
- @Input() set client_id(val: string) {
- this.loginService.client_id = val;
- }
- get client_id(): string {
- return this.loginService.client_id;
- }
-
- @Input() set redirect_uri(val: string) {
- this.loginService.redirect_uri = val;
- }
- get redirect_uri(): string {
- return this.loginService.redirect_uri;
- }
-
- @Input() set scope(val: string) {
- this.loginService.scope = val;
- }
- get scope(): string {
- return this.loginService.scope;
- }
-
- @Input() set redirect_behavior(val: RedirectBehavior) {
- this.loginService.redirect_behavior = val;
- }
- get redirect_behavior(): RedirectBehavior {
- return this.loginService.redirect_behavior;
- }
-
- @Input() set authorize_url_host_name(val: string) {
- this.loginService.authorize_url_host_name = val;
- }
-
- get authorize_url_host_name(): string {
- return this.loginService.authorize_url_host_name;
- }
-
- @Input()
- get authorization_credentials(): AuthorizationCredentials | undefined {
- try {
- if (this.loginService._accessToken) {
- return this.loginService._accessToken;
- } else {
- const accessTokenFromStorage = localStorage.getItem(this.loginService.accessTokenStorageKey);
- if (accessTokenFromStorage) {
- const accessTokenCredentials: AuthorizationCredentials = JSON.parse(accessTokenFromStorage);
- return accessTokenCredentials;
- } else {
- return undefined;
- }
- }
- } catch (err: any) {
- console.warn('Unable to retrieve accessToken: ' + err.message);
- return undefined;
- }
- }
-
- @Input()
- get account_endpoints(): AccountEndpoints | undefined {
- try {
- if (this.loginService._accountEndpoints) {
- return this.loginService._accountEndpoints;
- } else {
- const accountEndpointsFromStorage = localStorage.getItem(this.loginService.accountEndpointsStorageKey);
- if (accountEndpointsFromStorage) {
- const accountEndpoints: AccountEndpoints = JSON.parse(accountEndpointsFromStorage);
- return accountEndpoints;
- } else {
- return undefined;
- }
- }
- } catch (err: any) {
- console.warn('Unable to retrieve accountEndpoints: ' + err.message);
- return undefined;
- }
- }
-
- @Input()
- get account_id(): string | undefined {
- try {
- if (this.loginService._accountInfo) {
- return this.loginService._accountInfo.accountId;
- } else {
- const accountInfoFromStorage = localStorage.getItem(this.loginService.accountIdStorageKey);
- if (accountInfoFromStorage) {
- const accountInfo: AccountInfo = JSON.parse(accountInfoFromStorage);
- return accountInfo.accountId;
- } else {
- return undefined;
- }
- }
- } catch (err: any) {
- console.warn('Unable to retrieve accountId: ' + err.message);
- return undefined;
- }
- }
-
- @Input()
- get trustee_id(): string | undefined {
- try {
- if (this.loginService._accountInfo) {
- return this.loginService._accountInfo.trusteeId;
- } else {
- const accountInfoFromStorage = localStorage.getItem(this.loginService.accountIdStorageKey);
- if (accountInfoFromStorage) {
- const accountInfo: AccountInfo = JSON.parse(accountInfoFromStorage);
- return accountInfo.trusteeId;
- } else {
- return undefined;
- }
- }
- } catch (err: any) {
- console.warn('Unable to retrieve trusteeId: ' + err.message);
- return undefined;
- }
- }
-
- @Input()
- get state(): LoginState {
- return this.loginService._state ?? LoginState.LoggedOut;
- }
-
- private set _state(state: LoginState) {
- this.loginService._state = state;
- this.setButtonText();
- }
-
- @Output() loginInitiated = new EventEmitter();
- @Output() logoutInitiated = new EventEmitter();
-
- @Output() loginCompleted = new EventEmitter();
- @Output() logoutCompleted = new EventEmitter();
-
- /**
- * Refreshes and returns the access token
- * @param initiateLoginFlowOnRefreshFailure
- * Indicates whether an attempt should be made to login using OAuth flow upon encountering an inability to refresh the access token.
- * @returns {Promise}
- */
- @Input()
- refreshTokenAsync: (initiateLoginFlowOnRefreshFailure: boolean) => Promise = async (
- initiateLoginFlowOnRefreshFailure: boolean = true
- ) => {
- try {
- const refreshToken: string | undefined = this.authorization_credentials?.refreshToken;
- if (!refreshToken) {
- if (initiateLoginFlowOnRefreshFailure && !this.hasLoginError && this.state === LoginState.LoggedOut) {
- console.warn('Unable to refresh, refreshToken is not defined. Will attempt to start the OAuth login flow');
- await this.startOAuthLoginFlowAsync();
- } else if (this.state === LoginState.LoggingIn) {
- console.log('Logging in. Will not attempt to refresh');
- } else {
- console.warn(
- 'Unable to refresh, refreshToken is not defined, initiateLoginFlowOnRefreshFailure set to false'
- );
- this._state = LoginState.LoggedOut;
- this.logoutCompleted.emit({
- ErrorType: 'Refresh Token Error',
- ErrorMessage: 'refreshToken is not defined',
- });
- this.ref.detectChanges();
- this.loginService.removeFromLocalStorage();
- }
- return undefined;
- } else {
- try {
- const oauthRegion = this.account_endpoints?.regionalDomain;
- if (!oauthRegion) {
- throw new Error('Unable to refresh. Cannot construct tokenClient.');
- }
- const tokenClient = new TokenClient(oauthRegion);
- const response = await tokenClient.refreshAccessToken(refreshToken, this.client_id);
- const newAccessToken = await this.loginService.parseTokenResponseAsync(response);
- this.loginService.storeAccessToken(newAccessToken!);
- this._state = LoginState.LoggedIn;
- console.info('state changed to LoggedIn');
- this.loginCompleted.emit();
- return newAccessToken?.accessToken;
- } catch (e) {
- const status = (e).status ?? 0;
- if (status === 401 || status === 403) {
- if (initiateLoginFlowOnRefreshFailure && !this.hasLoginError && this.state === LoginState.LoggedOut) {
- console.warn('Unable to refresh. Will attempt to start the OAuth login flow');
- await this.startOAuthLoginFlowAsync();
- } else {
- console.warn(
- `Unable to refresh, initiateLoginFlowOnRefreshFailure set to ${initiateLoginFlowOnRefreshFailure}, state is ${this.state}`
- );
- this._state = LoginState.LoggedOut;
- this.ref.detectChanges();
- this.loginService.removeFromLocalStorage();
- }
- }
- throw e;
- }
- }
- } catch (err: any) {
- this._state = LoginState.LoggedOut;
- this.ref.detectChanges();
- this.loginService.removeFromLocalStorage();
- this.logoutCompleted.emit({
- ErrorType: 'Refresh Token Error',
- ErrorMessage: err.message,
- });
- console.error('Unable to refresh, logged out: ' + err.message);
- return undefined;
- }
- };
-
- @Input()
- initLoginFlowAsync: () => Promise = async () => {
- try {
- const accessToken: string | undefined = this.authorization_credentials?.accessToken;
- if (this.state === LoginState.LoggedOut && !this.hasLoginError) {
- await this.startOAuthLoginFlowAsync();
- return undefined;
- } else {
- return accessToken;
- }
- } catch (err: any) {
- this._state = LoginState.LoggedOut;
- this.ref.detectChanges();
- this.loginService.removeFromLocalStorage();
- this.logoutCompleted.emit({
- ErrorType: 'Login Error',
- ErrorMessage: err.message,
- });
- console.error('Unable to login, logged out: ' + err.message);
- return undefined;
- }
- };
-
- @Input() handleRedirectURICallbackAsync = async (url: string) => {
- try {
- const callbackURIParams = this.parseCallbackURI(url);
- if (callbackURIParams) {
- await this.loginService.exchangeCodeForTokenAsync(callbackURIParams);
- }
- } catch (err: any) {
- console.error('handleRedirectURICallbackAsync error, unable to exchange token: ', err.message);
- throw err;
- }
- };
-
- /** @internal */
- private logoutCompleteSub?: Subscription;
- /** @internal */
- private loginCompleteSub?: Subscription;
- /** @internal */
- private code_challenge?: string;
- /** @internal */
- private hasLoginError: boolean = false;
- /** @internal */
- private initialized: boolean = false;
-
- /** @internal */
- constructor(
- /** @internal */
- private ref: ChangeDetectorRef,
- /** @internal */
- private loginService: LfLoginService,
- /** @internal */
- private localizationService: AppLocalizationService
- ) {
- window.addEventListener('storage', (ev) => {
- this.onStorageChanged(ev);
- });
- }
-
- private setButtonText() {
- if (this.state === LoginState.LoggedIn) {
- this.buttonText = this._sign_out_text;
- } else if (this.state === LoginState.LoggingIn) {
- this.buttonText = this._signing_in_text;
- } else if (this.state === LoginState.LoggingOut) {
- this.buttonText = this._signing_out_text;
- } else {
- this.buttonText = this._sign_in_text;
- }
- }
-
- private onStorageChanged(ev: StorageEvent) {
- const keyName = ev.key;
- const oldValue = ev.oldValue;
- const newValue = ev.newValue;
- if (keyName === this.loginService.accessTokenStorageKey) {
- this.onAccessTokenLocalStorageChange(oldValue, newValue);
- }
- }
-
- private onAccessTokenLocalStorageChange(oldValue: string | null, newValue: string | null) {
- if (oldValue && !newValue) {
- // newly logged out
- this.loginService.removeFromCache();
- this._state = LoginState.LoggedOut;
- this.ref.detectChanges();
- this.logoutCompleted.emit();
- } else if (!oldValue && newValue) {
- // newly logged in
- this._state = LoginState.LoggingIn;
- this.ref.detectChanges();
-
- this.loginService.storeAccessToken(JSON.parse(newValue));
- this.loginService.refreshServiceAccountProperties();
- this._state = LoginState.LoggedIn;
- this.ref.detectChanges();
- this.loginCompleted.emit();
- } else if (newValue && oldValue && oldValue !== newValue) {
- // refreshed
- const newAccessToken: AuthorizationCredentials = JSON.parse(newValue);
- this.loginService.storeAccessToken(newAccessToken);
- this.loginService.refreshServiceAccountProperties();
- this._state = LoginState.LoggedIn;
- this.ref.detectChanges();
- this.loginCompleted.emit();
- } else {
- // accessToken didn't change
- // do nothing
- }
- }
-
- /** @internal */
- get isLoggedIn() {
- return this.loginService._state === LoginState.LoggedIn;
- }
-
- /** @internal */
- get isIntermediateState() {
- const loggingIn = this.loginService._state === LoginState.LoggingIn;
- const loggingOut = this.loginService._state === LoginState.LoggingOut;
- return loggingIn || loggingOut;
- }
-
- /** @internal */
- async ngAfterViewInit() {
- // duplicate of ngOnChanges code to support angular elements and components
- await this.initializeLoginAsync();
- }
-
- /** @internal */
- async ngOnChanges(changes: SimpleChanges) {
- const currentClientId = changes['client_id'];
- if (
- (currentClientId?.currentValue && currentClientId?.isFirstChange()) ||
- currentClientId?.previousValue !== currentClientId?.currentValue
- ) {
- await this.initializeLoginAsync();
- }
- }
-
- /** @internal */
- ngOnDestroy() {
- this.loginCompleteSub?.unsubscribe();
- this.logoutCompleteSub?.unsubscribe();
- }
-
- /** @internal */
- private async initializeLoginAsync() {
- try {
- if (!this.initialized && this.client_id) {
- this.logoutCompleteSub = this.loginService.logoutCompletedInService.subscribe((error) => {
- this.hasLoginError = true;
- this.setButtonText();
- this.logoutCompleted.emit(error);
- });
- this.loginCompleteSub = this.loginService.loginCompletedInService.subscribe(() => {
- this.setButtonText();
- this.loginCompleted.emit();
- });
- const callBackURIParams = this.parseCallbackURI(window.location.href);
- this._state = this.determineCurrentState(callBackURIParams);
- this.ref.detectChanges();
- if (this.loginService._state === LoginState.LoggingIn) {
- await this.loginService.exchangeCodeForTokenAsync(callBackURIParams!);
- }
- this.initialized = true;
- }
- } catch (err: any) {
- this.logoutCompleted.emit({
- ErrorType: 'Login Error',
- ErrorMessage: err.message,
- });
- this.loginService.removeFromLocalStorage();
- this._state = LoginState.LoggedOut;
- console.warn('Login Error: ' + err.message);
- this.ref.detectChanges();
- }
- }
-
- /** @internal */
- parseCallbackURI(urlString: string): RedirectUriQueryParams | undefined {
- const url = new URL(urlString);
-
- const state = url.searchParams.get('state');
- if (state === LOGIN_REDIRECT_STATE) {
- const authorizationCode = this.extractCodeFromUrl(url);
- const domain = this.extractDomainFromUrl(url);
- const customerId = this.extractCustomerIdFromUrl(url);
- const error = this.extractErrorFromUrl(url);
- if (authorizationCode && domain && customerId) {
- return {
- authorizationCode,
- cloudSubDomain: domain,
- customerId,
- };
- } else if (error) {
- return { error };
- } else {
- throw new Error('Unable to parse callback');
- }
- } else {
- return undefined;
- }
- }
-
- /** @internal */
- extractErrorFromUrl(url: URL): { name: string; description: string } | undefined {
- const error = url.searchParams.get('error');
- if (error) {
- const description = url.searchParams.get('description') ?? 'unknown';
- return { name: error, description };
- } else {
- return undefined;
- }
- }
-
- /** @internal */
- extractCodeFromUrl(url: URL): string | undefined {
- return url.searchParams.get('code') ?? undefined;
- }
-
- /** @internal */
- extractDomainFromUrl(url: URL): string | undefined {
- return url.searchParams.get('domain') ?? undefined;
- }
-
- /** @internal */
- extractCustomerIdFromUrl(url: URL): string | undefined {
- return url.searchParams.get('customerId') ?? undefined;
- }
-
- /** @internal */
- determineCurrentState(callBackURIParams: RedirectUriQueryParams | undefined): LoginState {
- const storedAccessToken = localStorage.getItem(this.loginService.accessTokenStorageKey!);
- const storedAccountEndpoints = localStorage.getItem(this.loginService.accountEndpointsStorageKey);
- const storedAccountId = localStorage.getItem(this.loginService.accountIdStorageKey);
- if (storedAccessToken && storedAccountEndpoints && storedAccountId) {
- this.loginService._accessToken = JSON.parse(storedAccessToken);
- this.loginService._accountEndpoints = JSON.parse(storedAccountEndpoints);
- const accountInfo = JSON.parse(storedAccountId);
- this.loginService._accountInfo = accountInfo;
- this.loginCompleted.emit();
- return LoginState.LoggedIn;
- } else if (callBackURIParams?.authorizationCode || callBackURIParams?.error) {
- return LoginState.LoggingIn;
- } else {
- this.logoutCompleted.emit();
- return LoginState.LoggedOut;
- }
- }
-
- /** @internal */
- createRefreshTokenRequest(): RequestInit {
- const refreshToken: string | undefined = this.loginService._accessToken?.refreshToken;
- if (refreshToken) {
- const request: RequestInit = { method: 'POST' };
- const headers = this.loginService.getPostRequestHeaders();
- const body = {
- grant_type: 'refresh_token',
- refresh_token: refreshToken,
- client_id: this.client_id,
- };
- const requestBody = this.loginService.objToWWWFormUrlEncodedBody(body);
- request.headers = headers;
- request.body = requestBody;
- return request;
- } else {
- throw new Error('RefreshToken is not defined');
- }
- }
-
- /** @internal */
- async onLoginButtonClickAsync() {
- if (this.state === LoginState.LoggedIn) {
- this.startLogout();
- } else if (this.state === LoginState.LoggedOut) {
- await this.startLoginAsync();
- } else {
- // Do not expect to get here as the button should be disabled.
- console.warn('Intermediate state. Should not attempt to login.');
- }
- }
-
- /** @internal */
- async startLoginAsync() {
- try {
- await this.startOAuthLoginFlowAsync();
- } catch (err: any) {
- if (this.loginService._state !== LoginState.LoggedOut) {
- this._state = LoginState.LoggedOut;
- this.ref.detectChanges();
- this.loginService.removeFromLocalStorage();
- this.logoutCompleted.emit({
- ErrorType: 'Login Error',
- ErrorMessage: err.message,
- });
- console.error('Login Error: ' + err.message);
- }
- }
- }
-
- /** @internal */
- private async startOAuthLoginFlowAsync() {
- const code_verifier = PKCEUtils.generateCodeVerifier();
- this.loginService.storeCodeVerifier(code_verifier);
-
- this.code_challenge = await PKCEUtils.generateCodeChallengeAsync(code_verifier);
-
- const fullAuthorizeUrl = this.getAuthorizeUrl();
- this.loginInitiated.emit(fullAuthorizeUrl);
- this._state = LoginState.LoggingIn;
- this.ref.detectChanges();
- console.info('state changed to LoggingIn');
- this.handleRedirectBehavior(fullAuthorizeUrl, 'Log in button clicked.');
- }
-
- /** @internal */
- getAuthorizeUrl(): string {
- const lastOAuthAuthorizeUrl = this.account_endpoints?.oauthAuthorizeUrl;
- const configuredHostName = this.loginService.authorize_url_host_name;
-
- const bothClouddev = configuredHostName.includes(this.CLOUDDEV) && lastOAuthAuthorizeUrl?.includes(this.CLOUDDEV);
- const bothCloudtest =
- configuredHostName.includes(this.CLOUDTEST) && lastOAuthAuthorizeUrl?.includes(this.CLOUDTEST);
- const bothCloudprod =
- lastOAuthAuthorizeUrl &&
- !configuredHostName.includes(this.CLOUDDEV) &&
- !configuredHostName.includes(this.CLOUDTEST) &&
- !lastOAuthAuthorizeUrl?.includes(this.CLOUDDEV) &&
- !lastOAuthAuthorizeUrl?.includes(this.CLOUDTEST);
-
- const sameEnvironment = bothClouddev || bothCloudtest || bothCloudprod;
-
- let currentAuthorizeUrl: string;
- if (sameEnvironment && lastOAuthAuthorizeUrl) {
- currentAuthorizeUrl = lastOAuthAuthorizeUrl;
- } else {
- currentAuthorizeUrl = this.getAuthorizeUrlWithConfiguredHostName();
- }
-
- const baseUrl: URL = new URL(currentAuthorizeUrl);
- baseUrl.searchParams.set('client_id', this.client_id);
- baseUrl.searchParams.set('redirect_uri', this.redirect_uri);
- baseUrl.searchParams.set('scope', this.scope);
- baseUrl.searchParams.set('response_type', 'code');
- baseUrl.searchParams.set('response_mode', 'query');
- baseUrl.searchParams.set('state', LOGIN_REDIRECT_STATE);
- baseUrl.searchParams.set('code_challenge', this.code_challenge!);
- baseUrl.searchParams.set('code_challenge_method', CODE_CHALLENGE_METHOD);
- return baseUrl.toString();
- }
-
- /** @internal */
- private getAuthorizeUrlWithConfiguredHostName(): string {
- return `https://signin.${this.loginService.authorize_url_host_name}/oauth/Authorize`;
- }
-
- /** @internal */
- startLogout() {
- try {
- this._state = LoginState.LoggingOut;
- this.ref.detectChanges();
- console.info('state changed to LoggingOut');
-
- const logoutUrl = this.getFullLogoutUrl();
- this.logoutInitiated.emit(logoutUrl);
-
- this.loginService.removeFromLocalStorage();
- this._state = LoginState.LoggedOut;
- this.ref.detectChanges();
- console.info('state changed to LoggedOut');
-
- this.logoutCompleted.emit();
- if (logoutUrl) {
- this.handleRedirectBehavior(logoutUrl, 'Logout button clicked.');
- }
- } catch (err: any) {
- if (this.loginService._state !== LoginState.LoggedOut) {
- this.loginService.removeFromLocalStorage();
- this._state = LoginState.LoggedOut;
- this.ref.detectChanges();
-
- console.error('Logout error (state changed to LoggedOut): ' + err.message);
- this.logoutCompleted.emit({
- ErrorType: 'Logout Error',
- ErrorMessage: err.message,
- });
- }
- }
- }
-
- /** @internal */
- getFullLogoutUrl(): string | undefined {
- if (this.loginService._accountEndpoints?.wsignoutUrl) {
- const acsToLfLogout = new URL(this.loginService._accountEndpoints?.wsignoutUrl);
- // Warning: if we are already logged out this will behave strangely
- // won't redirect back to redirect Url
- acsToLfLogout.searchParams.set('wreply', this.redirect_uri);
- const stringUrl = acsToLfLogout.toString();
- return stringUrl;
- } else {
- console.warn('No account endpoint available. Did not redirect');
- return undefined;
- }
- }
-
- /** @internal */
- private handleRedirectBehavior(stringUrl: string, additionalContext?: string) {
- if (this.redirect_behavior === RedirectBehavior.Replace) {
- window.location.replace(stringUrl);
- } else if (this.redirect_behavior === RedirectBehavior.Popup) {
- throw new Error('Not implemented');
- } else {
- const concatStrings = this.concatStrings(
- additionalContext,
- 'Redirect behavior none. Redirect must be implemented by container in event initiated handler'
- );
- console.log(concatStrings);
- }
- }
-
- /** @internal */
- concatStrings(firstString: string | undefined, secondString: string) {
- const firstStringExists = firstString && firstString.length > 0;
- if (firstStringExists) {
- const lastCharOfFirstString = firstString?.charAt(firstString.length - 1);
- const firstCharOfSecondString = secondString.charAt(0);
- if (lastCharOfFirstString !== ' ' && firstCharOfSecondString !== ' ') {
- return firstString + ' ' + secondString;
- } else if (lastCharOfFirstString === ' ' && firstCharOfSecondString === ' ') {
- return firstString + secondString.substring(1);
- }
- return firstString + secondString;
- } else {
- return secondString;
- }
- }
-
- /** @internal */
- private async beforeFetchRequestAsync(url: string, request: RequestInit): Promise {
- // must get accessToken each time
- const accessToken = this.authorization_credentials?.accessToken;
- if (accessToken) {
- const headers = request.headers as Record;
- headers['Authorization'] = 'Bearer ' + accessToken;
- const regionalDomain: string = this.account_endpoints?.regionalDomain ?? '';
- return { regionalDomain };
- } else {
- throw new Error('Access Token undefined.');
- }
- }
-
- /** @internal */
- private async afterFetchResponseAsync(url: string, response: Response, request: RequestInit): Promise {
- if (response.status === 401) {
- // this will initialize the login flow if refresh is unsuccessful
- const accessToken = await this.refreshTokenAsync(true);
- const retry = accessToken !== undefined;
- return retry;
- }
- return false;
- }
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import {
+ ChangeDetectorRef,
+ Component,
+ EventEmitter,
+ Input,
+ OnChanges,
+ OnDestroy,
+ OnInit,
+ Output,
+ SimpleChanges,
+ AfterViewInit,
+ inject,
+} from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { MatMenuModule } from '@angular/material/menu';
+import { Observable, of, Subscription } from 'rxjs';
+import { AccountInfo, RedirectUriQueryParams } from './login-utils/lf-login-internal-types';
+import {
+ AbortedLoginError,
+ AccountEndpoints,
+ AuthorizationCredentials,
+ LfBeforeFetchResult,
+ LfHttpRequestHandler,
+} from './login-utils/lf-login-types';
+import { LoginMode, LoginState, LoginType, RedirectBehavior } from '@laserfiche/lf-ui-components/shared';
+import { AppLocalizationService } from '@laserfiche/lf-ui-components/internal-shared';
+import { LfLoginService } from './login-utils/lf-login.service';
+import { ApiException, PKCEUtils } from '@laserfiche/lf-api-client-core';
+import { CloudLoginProvider } from './login-utils/cloud-login-provider';
+import { SelfHostedLoginProvider } from './login-utils/self-hosted-login-provider';
+
+const LOGIN_REDIRECT_STATE = 'lf-login-redirect';
+const CODE_CHALLENGE_METHOD = 'S256';
+@Component({
+ selector: 'lf-login-component',
+ templateUrl: './lf-login.component.html',
+ styleUrls: ['./lf-login.component.css'],
+ standalone: true,
+ imports: [CommonModule, MatMenuModule],
+})
+export class LfLoginComponent implements OnChanges, OnInit, OnDestroy, AfterViewInit {
+ /**@internal */
+ private ref = inject(ChangeDetectorRef);
+ /**@internal */
+ private loginService = inject(LfLoginService);
+ /**@internal */
+ private localizationService = inject(AppLocalizationService);
+
+ @Input() mode: LoginMode = LoginMode.Button;
+
+ /**
+ * @return {LfHttpRequestHandler}
+ * Returns the LfHttpRequestHandler that can be used
+ * to instantiate a repository API client.
+ */
+ @Input()
+ get authorizationRequestHandler(): LfHttpRequestHandler {
+ return {
+ beforeFetchRequestAsync: this.beforeFetchRequestAsync.bind(this),
+ afterFetchResponseAsync: this.afterFetchResponseAsync.bind(this),
+ };
+ }
+
+ /** @internal */
+ get isMenuMode(): boolean {
+ return this.mode === LoginMode.Menu;
+ }
+
+ /** @internal */
+ _sign_in_text: Observable = this.localizationService.getStringLaserficheObservable('SIGN_IN');
+ /** @internal */
+ _sign_out_text: Observable = this.localizationService.getStringLaserficheObservable('SIGN_OUT');
+ /** @internal */
+ _signing_in_text: Observable = this.localizationService.getStringLaserficheObservable('SIGNING_IN');
+ /** @internal */
+ _signing_out_text: Observable = this.localizationService.getStringLaserficheObservable('SIGNING_OUT');
+
+ @Input() set sign_in_text(text: string) {
+ this._sign_in_text = of(text);
+ }
+ @Input() set sign_out_text(text: string) {
+ this._sign_out_text = of(text);
+ }
+ @Input() set signing_in_text(text: string) {
+ this._signing_in_text = of(text);
+ }
+ @Input() set signing_out_text(text: string) {
+ this._signing_out_text = of(text);
+ }
+
+ /** @internal */
+ buttonText: Observable = this._sign_in_text;
+
+ @Input() set client_id(val: string) {
+ this.loginService.client_id = val;
+ }
+ get client_id(): string | undefined {
+ return this.loginService.client_id;
+ }
+
+ @Input() set redirect_uri(val: string) {
+ this.loginService.redirect_uri = val;
+ }
+ get redirect_uri(): string {
+ return this.loginService.redirect_uri;
+ }
+
+ @Input() set scope(val: string) {
+ this.loginService.scope = val;
+ }
+ get scope(): string | undefined {
+ return this.loginService.scope;
+ }
+
+ @Input() set redirect_behavior(val: RedirectBehavior) {
+ this.loginService.redirect_behavior = val;
+ }
+ get redirect_behavior(): RedirectBehavior {
+ return this.loginService.redirect_behavior;
+ }
+
+ @Input() set authorize_url_host_name(val: string) {
+ this.loginService.authorize_url_host_name = val;
+ }
+
+ get authorize_url_host_name(): string {
+ return this.loginService.authorize_url_host_name;
+ }
+
+ @Input() set login_type(val: LoginType) {
+ this.loginService.login_type = val;
+ }
+
+ get login_type(): LoginType {
+ return this.loginService.login_type;
+ }
+
+ @Input() set login_identifier(val: string) {
+ this.loginService.login_identifier = val;
+ }
+
+ get login_identifier(): string {
+ return this.loginService.login_identifier;
+ }
+
+ @Input()
+ get authorization_credentials(): AuthorizationCredentials | undefined {
+ try {
+ if (this.loginService._accessToken) {
+ return this.loginService._accessToken;
+ } else {
+ const accessTokenFromStorage = localStorage.getItem(this.loginService.accessTokenStorageKey);
+ if (accessTokenFromStorage) {
+ const accessTokenCredentials: AuthorizationCredentials = JSON.parse(accessTokenFromStorage);
+ return accessTokenCredentials;
+ } else {
+ return undefined;
+ }
+ }
+ } catch (err: any) {
+ console.warn('Unable to retrieve accessToken: ' + err.message);
+ return undefined;
+ }
+ }
+
+ @Input()
+ get account_endpoints(): AccountEndpoints | undefined {
+ return this.loginService.getAccountEndpoints();
+ }
+
+ @Input()
+ get account_id(): string | undefined {
+ try {
+ if (this.loginService._accountInfo) {
+ return this.loginService._accountInfo.accountId;
+ } else {
+ const accountInfoFromStorage = localStorage.getItem(this.loginService.accountIdStorageKey);
+ if (accountInfoFromStorage) {
+ const accountInfo: AccountInfo = JSON.parse(accountInfoFromStorage);
+ return accountInfo.accountId;
+ } else {
+ return undefined;
+ }
+ }
+ } catch (err: any) {
+ console.warn('Unable to retrieve accountId: ' + err.message);
+ return undefined;
+ }
+ }
+
+ @Input()
+ get trustee_id(): string | undefined {
+ try {
+ if (this.loginService._accountInfo) {
+ return this.loginService._accountInfo.trusteeId;
+ } else {
+ const accountInfoFromStorage = localStorage.getItem(this.loginService.accountIdStorageKey);
+ if (accountInfoFromStorage) {
+ const accountInfo: AccountInfo = JSON.parse(accountInfoFromStorage);
+ return accountInfo.trusteeId;
+ } else {
+ return undefined;
+ }
+ }
+ } catch (err: any) {
+ console.warn('Unable to retrieve trusteeId: ' + err.message);
+ return undefined;
+ }
+ }
+
+ @Input()
+ get state(): LoginState {
+ return this.loginService._state ?? LoginState.LoggedOut;
+ }
+
+ private set _state(state: LoginState) {
+ this.loginService._state = state;
+ this.setButtonText();
+ }
+
+ @Output() loginInitiated = new EventEmitter();
+ @Output() logoutInitiated = new EventEmitter();
+
+ @Output() loginCompleted = new EventEmitter();
+ @Output() logoutCompleted = new EventEmitter();
+
+ /**
+ * Refreshes and returns the access token
+ * @param initiateLoginFlowOnRefreshFailure
+ * Indicates whether an attempt should be made to login using OAuth flow upon encountering an inability to refresh the access token.
+ * @returns {Promise}
+ */
+ @Input()
+ refreshTokenAsync: (initiateLoginFlowOnRefreshFailure: boolean) => Promise = async (
+ initiateLoginFlowOnRefreshFailure: boolean = true
+ ) => {
+ try {
+ const refreshToken: string | undefined = this.authorization_credentials?.refreshToken;
+ if (!refreshToken) {
+ if (initiateLoginFlowOnRefreshFailure && !this.hasLoginError && this.state === LoginState.LoggedOut) {
+ console.warn('Unable to refresh, refreshToken is not defined. Will attempt to start the OAuth login flow');
+ await this.startOAuthLoginFlowAsync();
+ } else if (this.state === LoginState.LoggingIn) {
+ console.log('Logging in. Will not attempt to refresh');
+ } else {
+ console.warn(
+ 'Unable to refresh, refreshToken is not defined, initiateLoginFlowOnRefreshFailure set to false'
+ );
+ this._state = LoginState.LoggedOut;
+ this.logoutCompleted.emit({
+ ErrorType: 'Refresh Token Error',
+ ErrorMessage: 'refreshToken is not defined',
+ });
+ this.ref.detectChanges();
+ this.loginService.removeFromLocalStorage();
+ }
+ return undefined;
+ } else {
+ try {
+ const oauthRegion = this.account_endpoints?.regionalDomain;
+ if (!oauthRegion) {
+ throw new Error('Unable to refresh. Cannot construct tokenClient.');
+ }
+
+ const tokenClient = this.loginService.loginProvider?.getTokenClient(oauthRegion);
+ const response = await tokenClient!.refreshAccessToken(refreshToken, this.client_id);
+ const newAccessToken = await this.loginService.parseTokenResponseAsync(response);
+ this.loginService.storeAccessToken(newAccessToken!);
+ this._state = LoginState.LoggedIn;
+ console.info('state changed to LoggedIn');
+ this.loginCompleted.emit();
+ return newAccessToken?.accessToken;
+ } catch (e) {
+ const status = (e).status ?? 0;
+ if (status === 401 || status === 403) {
+ if (initiateLoginFlowOnRefreshFailure && !this.hasLoginError && this.state === LoginState.LoggedOut) {
+ console.warn('Unable to refresh. Will attempt to start the OAuth login flow');
+ await this.startOAuthLoginFlowAsync();
+ } else {
+ console.warn(
+ `Unable to refresh, initiateLoginFlowOnRefreshFailure set to ${initiateLoginFlowOnRefreshFailure}, state is ${this.state}`
+ );
+ this._state = LoginState.LoggedOut;
+ this.ref.detectChanges();
+ this.loginService.removeFromLocalStorage();
+ }
+ }
+ throw e;
+ }
+ }
+ } catch (err: any) {
+ this._state = LoginState.LoggedOut;
+ this.ref.detectChanges();
+ this.loginService.removeFromLocalStorage();
+ this.logoutCompleted.emit({
+ ErrorType: 'Refresh Token Error',
+ ErrorMessage: err.message,
+ });
+ console.error('Unable to refresh, logged out: ' + err.message);
+ return undefined;
+ }
+ };
+
+ private async loginFlowHandler(startLoginMethodAsync: () => Promise): Promise {
+ try {
+ const accessToken: string | undefined = this.authorization_credentials?.accessToken;
+ if (this.state === LoginState.LoggedOut && !this.hasLoginError) {
+ await startLoginMethodAsync();
+ return undefined;
+ } else {
+ await this.initializeLoginAsync();
+ return accessToken;
+ }
+ } catch (err: any) {
+ this._state = LoginState.LoggedOut;
+ this.ref.detectChanges();
+ this.loginService.removeFromLocalStorage();
+ this.logoutCompleted.emit({
+ ErrorType: 'Login Error',
+ ErrorMessage: err.message,
+ });
+ console.error('Unable to login, logged out: ' + err.message);
+ return undefined;
+ }
+ }
+
+ private async startCloudLoginFlowAsync() {
+ this.loginService.loginProvider = new CloudLoginProvider(this.loginService);
+ await this.startOAuthLoginFlowAsync();
+ }
+
+ @Input()
+ initLoginFlowAsync: () => Promise = async () => {
+ return await this.loginFlowHandler(() => this.startCloudLoginFlowAsync());
+ };
+
+ private async startSelfHostedLoginFlow(accountEndpoints: AccountEndpoints, repositoryId: string) {
+ this.loginService.loginProvider = new SelfHostedLoginProvider(this.loginService, repositoryId);
+ await this.startSelfHostedLoginFlowAsync(accountEndpoints);
+ }
+
+ @Input()
+ initSelfHostedLoginFlowAsync: (
+ accountEndpoints: AccountEndpoints,
+ repositoryId: string
+ ) => Promise = async (accountEndpoints: AccountEndpoints, repositoryId: string) => {
+ return await this.loginFlowHandler(() => this.startSelfHostedLoginFlow(accountEndpoints, repositoryId));
+ };
+
+ @Input() handleRedirectURICallbackAsync = async (url: string) => {
+ try {
+ const callbackURIParams = this.parseCallbackURI(url);
+ if (callbackURIParams) {
+ await this.loginService.exchangeCodeForTokenAsync(callbackURIParams);
+ }
+ } catch (err: any) {
+ console.error('handleRedirectURICallbackAsync error, unable to exchange token: ', err.message);
+ throw err;
+ }
+ };
+
+ /** @internal */
+ private logoutCompleteSub?: Subscription;
+ /** @internal */
+ private loginCompleteSub?: Subscription;
+ /** @internal */
+ private code_challenge?: string;
+ /** @internal */
+ private hasLoginError: boolean = false;
+ /** @internal */
+ private initialized: boolean = false;
+
+ /** @internal */
+ constructor() {
+ window.addEventListener('storage', (ev) => {
+ this.onStorageChanged(ev);
+ });
+ }
+
+ async ngAfterViewInit() {
+ const accessToken = this.authorization_credentials?.accessToken;
+ if (accessToken) {
+ this._state = LoginState.LoggedIn;
+ } else {
+ await this.initializeLoginAsync();
+ }
+ }
+
+ /** @internal */
+ async ngOnChanges(changes: SimpleChanges) {
+ // initialize the login state according to the access token
+ const currentLoginIdentifier = changes['login_identifier'];
+ if (
+ (currentLoginIdentifier?.currentValue && currentLoginIdentifier?.isFirstChange()) ||
+ currentLoginIdentifier?.previousValue !== currentLoginIdentifier?.currentValue
+ ) {
+ const accessToken = this.authorization_credentials?.accessToken;
+ if (accessToken) {
+ this._state = LoginState.LoggedIn;
+ } else {
+ await this.initializeLoginAsync();
+ }
+ }
+
+ const currentLoginType = changes['login_type'];
+ if (
+ !this.loginService.loginProvider &&
+ ((currentLoginType?.currentValue && currentLoginType?.isFirstChange()) ||
+ currentLoginType?.previousValue !== currentLoginType?.currentValue)
+ ) {
+ this.loginService.loginProvider =
+ currentLoginType.currentValue === LoginType.SelfHosted
+ ? new SelfHostedLoginProvider(this.loginService, currentLoginIdentifier.currentValue)
+ : new CloudLoginProvider(this.loginService);
+ }
+ }
+
+ private setButtonText() {
+ if (this.state === LoginState.LoggedIn) {
+ this.buttonText = this._sign_out_text;
+ } else if (this.state === LoginState.LoggingIn) {
+ this.buttonText = this._signing_in_text;
+ } else if (this.state === LoginState.LoggingOut) {
+ this.buttonText = this._signing_out_text;
+ } else {
+ this.buttonText = this._sign_in_text;
+ }
+ }
+
+ private onStorageChanged(ev: StorageEvent) {
+ const keyName = ev.key;
+ const oldValue = ev.oldValue;
+ const newValue = ev.newValue;
+ if (keyName === this.loginService.accessTokenStorageKey) {
+ this.onAccessTokenLocalStorageChange(oldValue, newValue);
+ }
+ }
+
+ private onAccessTokenLocalStorageChange(oldValue: string | null, newValue: string | null) {
+ if (oldValue && !newValue) {
+ // newly logged out
+ this.loginService.removeFromCache();
+ this._state = LoginState.LoggedOut;
+ this.ref.detectChanges();
+ this.logoutCompleted.emit();
+ } else if (!oldValue && newValue) {
+ // newly logged in
+ this._state = LoginState.LoggingIn;
+ this.ref.detectChanges();
+
+ this.loginService.storeAccessToken(JSON.parse(newValue));
+ this.loginService.refreshServiceAccountProperties();
+ this._state = LoginState.LoggedIn;
+ this.ref.detectChanges();
+ this.loginCompleted.emit();
+ } else if (newValue && oldValue && oldValue !== newValue) {
+ // refreshed
+ const newAccessToken: AuthorizationCredentials = JSON.parse(newValue);
+ this.loginService.storeAccessToken(newAccessToken);
+ this.loginService.refreshServiceAccountProperties();
+ this._state = LoginState.LoggedIn;
+ this.ref.detectChanges();
+ this.loginCompleted.emit();
+ } else {
+ // accessToken didn't change
+ // do nothing
+ }
+ }
+
+ /** @internal */
+ get isLoggedIn() {
+ return this.loginService._state === LoginState.LoggedIn;
+ }
+
+ /** @internal */
+ get isIntermediateState() {
+ const loggingIn = this.loginService._state === LoginState.LoggingIn;
+ const loggingOut = this.loginService._state === LoginState.LoggingOut;
+ return loggingIn || loggingOut;
+ }
+
+ /** @internal */
+ async ngOnInit() {
+ this.logoutCompleteSub = this.loginService.logoutCompletedInService.subscribe((error) => {
+ this.hasLoginError = true;
+ this.setButtonText();
+ this.logoutCompleted.emit(error);
+ });
+ this.loginCompleteSub = this.loginService.loginCompletedInService.subscribe(() => {
+ this.setButtonText();
+ this.loginCompleted.emit();
+ });
+ }
+
+ /** @internal */
+ ngOnDestroy() {
+ this.loginCompleteSub?.unsubscribe();
+ this.logoutCompleteSub?.unsubscribe();
+ }
+
+ /** @internal */
+ private async initializeLoginAsync() {
+ try {
+ const callBackURIParams = this.parseCallbackURI(window.location.href);
+ this._state =
+ this.loginService.loginProvider?.determineCurrentState(
+ callBackURIParams,
+ this.loginCompleted,
+ this.logoutCompleted
+ ) ?? LoginState.LoggedOut;
+ this.ref.detectChanges();
+ if (this.loginService._state === LoginState.LoggingIn) {
+ await this.loginService.exchangeCodeForTokenAsync(callBackURIParams!);
+ }
+ } catch (err: any) {
+ this.logoutCompleted.emit({
+ ErrorType: 'Login Error',
+ ErrorMessage: err.message,
+ });
+ this.loginService.removeFromLocalStorage();
+ this._state = LoginState.LoggedOut;
+ console.warn('Login Error: ' + err.message);
+ this.ref.detectChanges();
+ }
+ }
+
+ /** @internal */
+ parseCallbackURI(urlString: string): RedirectUriQueryParams | undefined {
+ const url = new URL(urlString);
+ const state = url.searchParams.get('state');
+ if (state !== LOGIN_REDIRECT_STATE) {
+ return undefined;
+ }
+
+ return this.loginService.loginProvider?.exchangeRedirectUriQueryParams(url);
+ }
+
+ /** @internal */
+ createRefreshTokenRequest(): RequestInit {
+ const refreshToken: string | undefined = this.loginService._accessToken?.refreshToken;
+ if (refreshToken) {
+ const request: RequestInit = { method: 'POST' };
+ const headers = this.loginService.getPostRequestHeaders();
+ const body = {
+ grant_type: 'refresh_token',
+ refresh_token: refreshToken,
+ client_id: this.client_id,
+ };
+ const requestBody = this.loginService.objToWWWFormUrlEncodedBody(body);
+ request.headers = headers;
+ request.body = requestBody;
+ return request;
+ } else {
+ throw new Error('RefreshToken is not defined');
+ }
+ }
+
+ /** @internal */
+ async onLoginButtonClickAsync() {
+ if (this.state === LoginState.LoggedIn) {
+ this.startLogout();
+ } else if (this.state === LoginState.LoggedOut) {
+ await this.startLoginAsync();
+ } else {
+ // Do not expect to get here as the button should be disabled.
+ console.warn('Intermediate state. Should not attempt to login.');
+ }
+ }
+
+ /** @internal */
+ async startLoginAsync() {
+ try {
+ await this.startCloudLoginFlowAsync();
+ } catch (err: any) {
+ if (this.loginService._state !== LoginState.LoggedOut) {
+ this._state = LoginState.LoggedOut;
+ this.ref.detectChanges();
+ this.loginService.removeFromLocalStorage();
+ this.logoutCompleted.emit({
+ ErrorType: 'Login Error',
+ ErrorMessage: err.message,
+ });
+ console.error('Login Error: ' + err.message);
+ }
+ }
+ }
+
+ /** @internal */
+ private async startOAuthLoginFlowAsync() {
+ const code_verifier = PKCEUtils.generateCodeVerifier();
+ this.loginService.storeCodeVerifier(code_verifier);
+
+ this.code_challenge = await PKCEUtils.generateCodeChallengeAsync(code_verifier);
+
+ const fullAuthorizeUrl = this.getAuthorizeUrl();
+ this.loginInitiated.emit(fullAuthorizeUrl);
+ this._state = LoginState.LoggingIn;
+ this.ref.detectChanges();
+ console.info('state changed to LoggingIn');
+ this.handleRedirectBehavior(fullAuthorizeUrl, 'Log in button clicked.');
+ }
+
+ private async startSelfHostedLoginFlowAsync(accountEndpoints: AccountEndpoints) {
+ this.loginService.self_hosted_account_endpoints = accountEndpoints;
+ this.loginService.self_hosted_base_url = accountEndpoints.regionalDomain;
+ await this.startOAuthLoginFlowAsync();
+ }
+
+ /** @internal */
+ getAuthorizeUrl(): string {
+ const baseAuthorizeUrl = this.loginService.loginProvider?.getBaseAuthorizeUrl();
+
+ const baseUrl: URL = new URL(baseAuthorizeUrl ?? '');
+ if (this.client_id) {
+ baseUrl.searchParams.set('client_id', this.client_id);
+ }
+ if (this.scope) {
+ baseUrl.searchParams.set('scope', this.scope);
+ }
+ baseUrl.searchParams.set('redirect_uri', this.redirect_uri);
+ baseUrl.searchParams.set('response_type', 'code');
+ baseUrl.searchParams.set('response_mode', 'query');
+ baseUrl.searchParams.set('state', LOGIN_REDIRECT_STATE);
+ baseUrl.searchParams.set('code_challenge', this.code_challenge!);
+ baseUrl.searchParams.set('code_challenge_method', CODE_CHALLENGE_METHOD);
+
+ return baseUrl.toString();
+ }
+
+ /** @internal */
+ startLogout() {
+ try {
+ this._state = LoginState.LoggingOut;
+ this.ref.detectChanges();
+ console.info('state changed to LoggingOut');
+
+ const logoutUrl = this.getFullLogoutUrl();
+ this.loginService.loginProvider?.logoutInitiatedViaUrl(logoutUrl, this.logoutInitiated);
+
+ this.loginService.removeFromLocalStorage();
+ this._state = LoginState.LoggedOut;
+ this.ref.detectChanges();
+ console.info('state changed to LoggedOut');
+
+ this.logoutCompleted.emit();
+ if (logoutUrl) {
+ this.handleRedirectBehavior(logoutUrl, 'Logout button clicked.');
+ }
+ } catch (err: any) {
+ if (this.loginService._state !== LoginState.LoggedOut) {
+ this.loginService.removeFromLocalStorage();
+ this._state = LoginState.LoggedOut;
+ this.ref.detectChanges();
+
+ console.error('Logout error (state changed to LoggedOut): ' + err.message);
+ this.logoutCompleted.emit({
+ ErrorType: 'Logout Error',
+ ErrorMessage: err.message,
+ });
+ }
+ }
+ }
+
+ /** @internal */
+ getFullLogoutUrl(): string | undefined {
+ if (this.account_endpoints?.wsignoutUrl) {
+ const acsToLfLogout = new URL(this.account_endpoints?.wsignoutUrl);
+ // Warning: if we are already logged out this will behave strangely
+ // won't redirect back to redirect Url
+ acsToLfLogout.searchParams.set('wreply', this.redirect_uri);
+ const stringUrl = acsToLfLogout.toString();
+ return stringUrl;
+ } else {
+ console.warn('No account endpoint available. Did not redirect');
+ return undefined;
+ }
+ }
+
+ /** @internal */
+ private handleRedirectBehavior(stringUrl: string, additionalContext?: string) {
+ if (this.redirect_behavior === RedirectBehavior.Replace) {
+ window.location.replace(stringUrl);
+ } else if (this.redirect_behavior === RedirectBehavior.Popup) {
+ throw new Error('Not implemented');
+ } else {
+ const concatStrings = this.concatStrings(
+ additionalContext,
+ 'Redirect behavior none. Redirect must be implemented by container in event initiated handler'
+ );
+ console.log(concatStrings);
+ }
+ }
+
+ /** @internal */
+ concatStrings(firstString: string | undefined, secondString: string) {
+ const firstStringExists = firstString && firstString.length > 0;
+ if (firstStringExists) {
+ const lastCharOfFirstString = firstString?.charAt(firstString.length - 1);
+ const firstCharOfSecondString = secondString.charAt(0);
+ if (lastCharOfFirstString !== ' ' && firstCharOfSecondString !== ' ') {
+ return firstString + ' ' + secondString;
+ } else if (lastCharOfFirstString === ' ' && firstCharOfSecondString === ' ') {
+ return firstString + secondString.substring(1);
+ }
+ return firstString + secondString;
+ } else {
+ return secondString;
+ }
+ }
+
+ /** @internal */
+ private async beforeFetchRequestAsync(url: string, request: RequestInit): Promise {
+ // must get accessToken each time
+ const accessToken = this.authorization_credentials?.accessToken;
+ if (accessToken) {
+ const headers = request.headers as Record;
+ headers['Authorization'] = 'Bearer ' + accessToken;
+ const regionalDomain: string = this.account_endpoints?.regionalDomain ?? '';
+ return { regionalDomain };
+ } else {
+ throw new Error('Access Token undefined.');
+ }
+ }
+
+ /** @internal */
+ private async afterFetchResponseAsync(url: string, response: Response, request: RequestInit): Promise {
+ if (response.status === 401) {
+ // this will initialize the login flow if refresh is unsuccessful
+ const accessToken = await this.refreshTokenAsync(true);
+ const retry = accessToken !== undefined;
+ return retry;
+ }
+ return false;
+ }
+}
diff --git a/projects/ui-components/lf-login/lf-login.module.ts b/projects/ui-components/lf-login/lf-login.module.ts
deleted file mode 100644
index b4f1d3a5..00000000
--- a/projects/ui-components/lf-login/lf-login.module.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { Injector, NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { LfLoginComponent } from './lf-login.component';
-import { MatMenuModule } from '@angular/material/menu';
-import { createCustomElement } from '@angular/elements';
-
-
-@NgModule({
- declarations: [
- LfLoginComponent
- ],
- imports: [
- CommonModule,
- MatMenuModule
- ],
- bootstrap: [
- LfLoginComponent
- ],
- exports: [
- LfLoginComponent
- ]
-})
-export class LfLoginModule {
- /** @internal */
- constructor(
- /** @internal */ injector: Injector
- ) {
- const elementName: string = 'lf-login';
- if (window.customElements && !customElements.get(elementName)) {
- const newElement = createCustomElement(LfLoginComponent, { injector });
- customElements.define(elementName, newElement);
- }
- }
-}
diff --git a/projects/ui-components/lf-login/login-utils/cloud-login-provider.spec.ts b/projects/ui-components/lf-login/login-utils/cloud-login-provider.spec.ts
new file mode 100644
index 00000000..21a85ded
--- /dev/null
+++ b/projects/ui-components/lf-login/login-utils/cloud-login-provider.spec.ts
@@ -0,0 +1,195 @@
+import { CloudLoginProvider } from './cloud-login-provider';
+import { TokenClient } from '@laserfiche/lf-api-client-core';
+import { LfLoginService } from './lf-login.service';
+import { AccountEndpoints, AuthorizationCredentials } from './lf-login-types';
+import { EventEmitter } from '@angular/core';
+import { LoginState } from '@laserfiche/lf-ui-components/shared';
+import { AccountInfo } from './lf-login-internal-types';
+
+describe('CloudLoginProvider', () => {
+ let provider: CloudLoginProvider;
+ let lfLoginServiceMock: Partial;
+
+ beforeEach(() => {
+ lfLoginServiceMock = {
+ storeAccessToken: vi.fn(),
+ parseAccessToken: vi.fn(),
+ storeAccountInfo: vi.fn(),
+ storeAccountEndpoints: vi.fn(),
+ getAccountEndpoints: vi.fn(),
+ extractCodeFromUrl: vi.fn(),
+ extractDomainFromUrl: vi.fn(),
+ extractCustomerIdFromUrl: vi.fn(),
+ extractErrorFromUrl: vi.fn(),
+ accessTokenStorageKey: 'mock-storage-key',
+ };
+
+ provider = new CloudLoginProvider(lfLoginServiceMock as LfLoginService);
+ });
+
+ describe('getTokenClient', () => {
+ it('should return a TokenClient instance', () => {
+ const tokenClientUrl = 'https://example.com/token';
+ const tokenClient = provider.getTokenClient(tokenClientUrl);
+ expect(tokenClient).toBeInstanceOf(TokenClient);
+ });
+ });
+
+ describe('getBaseAuthorizeUrl', () => {
+ it('should return the base authorize URL when last OAuth authorize URL exist and host name does not include dev and test environments', () => {
+ lfLoginServiceMock.authorize_url_host_name = 'example.com';
+ lfLoginServiceMock.getAccountEndpoints = vi.fn().mockReturnValue({
+ oauthAuthorizeUrl: 'https://example.com/oauth/authorize',
+ } as AccountEndpoints);
+
+ const baseAuthorizeUrl = provider.getBaseAuthorizeUrl();
+ expect(baseAuthorizeUrl).toBe('https://example.com/oauth/authorize');
+ });
+
+ it('should return the base authorize URL when last OAuth authorize URL does not exist', () => {
+ lfLoginServiceMock.getAccountEndpoints = vi.fn().mockReturnValue(undefined);
+ lfLoginServiceMock.authorize_url_host_name = 'example.net';
+
+ const baseAuthorizeUrl = provider.getBaseAuthorizeUrl();
+ expect(baseAuthorizeUrl).toBe('https://signin.example.net/oauth/Authorize');
+ });
+ });
+
+ describe('storeInLocalStorage', () => {
+ it('should store access token credentials in local storage', () => {
+ const accessTokenCredentials = {
+ accessToken: 'test-access',
+ expiresIn: '3600',
+ tokenType: 'bearer',
+ refreshToken: 'refresh-token',
+ };
+
+ provider.storeInLocalStorage(accessTokenCredentials, 'account-id', 'regional-domain');
+
+ expect(lfLoginServiceMock.storeAccessToken).toHaveBeenCalledWith(accessTokenCredentials);
+ expect(lfLoginServiceMock.storeAccountInfo).toHaveBeenCalled();
+ expect(lfLoginServiceMock.storeAccountEndpoints).toHaveBeenCalled();
+ });
+ });
+
+ describe('exchangeRedirectUriQueryParams', () => {
+ it('should return RedirectUriQueryParams with authorization code and domain when available', () => {
+ lfLoginServiceMock.extractCodeFromUrl = vi.fn().mockReturnValue('abc');
+ lfLoginServiceMock.extractDomainFromUrl = vi.fn().mockReturnValue('example.com');
+ lfLoginServiceMock.extractCustomerIdFromUrl = vi.fn().mockReturnValue('customer-123');
+ const url = new URL('https://example.com/callback?code=abc&domain=example.com');
+
+ const redirectUriQueryParams = provider.exchangeRedirectUriQueryParams(url);
+
+ expect(redirectUriQueryParams).toEqual({
+ authorizationCode: 'abc',
+ cloudSubDomain: 'example.com',
+ customerId: 'customer-123',
+ });
+ });
+
+ it('should return RedirectUriQueryParams with error when available', () => {
+ lfLoginServiceMock.extractCodeFromUrl = vi.fn().mockReturnValue('abc');
+ lfLoginServiceMock.extractDomainFromUrl = vi.fn().mockReturnValue('example.com');
+ lfLoginServiceMock.extractCustomerIdFromUrl = vi.fn().mockReturnValue(undefined);
+ lfLoginServiceMock.extractErrorFromUrl = vi.fn().mockReturnValue({ name: 'xyz', description: 'unknown' });
+ const url = new URL('https://example.com/callback?error=xyz');
+
+ const redirectUriQueryParams = provider.exchangeRedirectUriQueryParams(url);
+
+ expect(redirectUriQueryParams).toEqual({
+ error: { name: 'xyz', description: 'unknown' },
+ });
+ });
+
+ it('should return undefined when particular query parameters are missing', () => {
+ lfLoginServiceMock.extractCodeFromUrl = vi.fn().mockReturnValue(undefined);
+ lfLoginServiceMock.extractDomainFromUrl = vi.fn().mockReturnValue(undefined);
+ lfLoginServiceMock.extractCustomerIdFromUrl = vi.fn().mockReturnValue(undefined);
+ lfLoginServiceMock.extractErrorFromUrl = vi.fn().mockReturnValue(undefined);
+ const url = new URL('https://example.com/callback?somthing=else');
+
+ const redirectUriQueryParams = provider.exchangeRedirectUriQueryParams(url);
+
+ expect(redirectUriQueryParams).toBeUndefined();
+ });
+ });
+
+ describe('determineCurrentState', () => {
+ const authorizationCredentialsMock: AuthorizationCredentials = {
+ accessToken: 'test-access',
+ refreshToken: 'test-refresh',
+ expiresIn: '3600',
+ tokenType: 'bearer',
+ };
+
+ const accountEndpointsMock: AccountEndpoints = {
+ webClientUrl: 'https://api.example.com',
+ wsignoutUrl: 'https://api.example.com/signout',
+ regionalDomain: 'example.com',
+ oauthAuthorizeUrl: 'https://example.com/oauth/authorize',
+ };
+
+ const accountInfoMock: AccountInfo = {
+ accountId: 'account-id',
+ trusteeId: 'trustee-id',
+ };
+
+ it('should return LoginState.LoggedIn when access token and account information are stored in local storage', () => {
+ // Reset mocks
+ lfLoginServiceMock.storeAccessToken = vi.fn().mockClear();
+
+ const loginCompleteEmitMock = { emit: vi.fn() } as unknown as EventEmitter;
+ const logoutCompleted = {} as unknown as EventEmitter;
+
+ localStorage.getItem = vi
+ .fn()
+ .mockReturnValueOnce('access-token-value')
+ .mockReturnValueOnce('account-endpoints-value')
+ .mockReturnValueOnce('account-id-value');
+
+ JSON.parse = vi
+ .fn()
+ .mockReturnValueOnce(authorizationCredentialsMock)
+ .mockReturnValueOnce(accountEndpointsMock)
+ .mockReturnValueOnce(accountInfoMock);
+
+ const currentState = provider.determineCurrentState(undefined, loginCompleteEmitMock, logoutCompleted);
+
+ expect(currentState).toBe(LoginState.LoggedIn);
+ expect(loginCompleteEmitMock.emit).toHaveBeenCalled();
+ });
+
+ it('should return LoginState.LoggingIn when authorization code is available in callback URI params', () => {
+ const callBackURIParams = { authorizationCode: 'abc' };
+ const loginCompleted = new EventEmitter();
+ const logoutCompleted = new EventEmitter();
+
+ const currentState = provider.determineCurrentState(callBackURIParams, loginCompleted, logoutCompleted);
+
+ expect(currentState).toBe(LoginState.LoggingIn);
+ });
+
+ it('should return LoginState.LoggedOut when no access token or account endpoints are stored in local storage', () => {
+ const loginCompleted = { emit: vi.fn() } as unknown as EventEmitter;
+ const logoutCompletedEmitMock = { emit: vi.fn() } as unknown as EventEmitter;
+
+ const currentState = provider.determineCurrentState(undefined, loginCompleted, logoutCompletedEmitMock);
+
+ expect(currentState).toBe(LoginState.LoggedOut);
+ expect(logoutCompletedEmitMock.emit).toHaveBeenCalled();
+ });
+ });
+
+ describe('logoutInitiatedViaUrl', () => {
+ it('should emit the provided URL when logout initiated via URL', () => {
+ const emitSpy = vi.fn();
+ const url = 'https://example.com/logout';
+
+ provider.logoutInitiatedViaUrl(url, { emit: emitSpy });
+
+ expect(emitSpy).toHaveBeenCalledTimes(1);
+ expect(emitSpy).toHaveBeenCalledWith(url);
+ });
+ });
+});
diff --git a/projects/ui-components/lf-login/login-utils/cloud-login-provider.ts b/projects/ui-components/lf-login/login-utils/cloud-login-provider.ts
new file mode 100644
index 00000000..46a9d0b5
--- /dev/null
+++ b/projects/ui-components/lf-login/login-utils/cloud-login-provider.ts
@@ -0,0 +1,101 @@
+// Copyright Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { EventEmitter } from '@angular/core';
+import { LoginProvider } from './login-provider';
+import { DomainUtils, TokenClient } from '@laserfiche/lf-api-client-core';
+import { LfLoginService } from './lf-login.service';
+import { AuthorizationCredentials } from './lf-login-types';
+import { RedirectUriQueryParams } from './lf-login-internal-types';
+import { LoginState } from '@laserfiche/lf-ui-components/shared';
+
+/** @internal */
+export class CloudLoginProvider implements LoginProvider {
+ readonly CLOUDDEV = 'clouddev';
+ readonly CLOUDTEST = 'cloudtest';
+
+ constructor(private lfLoginService: LfLoginService) {}
+
+ getTokenClient(tokenClientUrl: string) {
+ return new TokenClient(tokenClientUrl);
+ }
+
+ getBaseAuthorizeUrl(): string {
+ let baseAuthorizeUrl: string;
+ const lastOAuthAuthorizeUrl = this.lfLoginService.getAccountEndpoints()?.oauthAuthorizeUrl;
+ const configuredHostName = this.lfLoginService.authorize_url_host_name;
+
+ const bothClouddev = configuredHostName.includes(this.CLOUDDEV) && lastOAuthAuthorizeUrl?.includes(this.CLOUDDEV);
+ const bothCloudtest =
+ configuredHostName.includes(this.CLOUDTEST) && lastOAuthAuthorizeUrl?.includes(this.CLOUDTEST);
+ const bothCloudprod =
+ lastOAuthAuthorizeUrl &&
+ !configuredHostName.includes(this.CLOUDDEV) &&
+ !configuredHostName.includes(this.CLOUDTEST) &&
+ !lastOAuthAuthorizeUrl?.includes(this.CLOUDDEV) &&
+ !lastOAuthAuthorizeUrl?.includes(this.CLOUDTEST);
+
+ const sameEnvironment = bothClouddev || bothCloudtest || bothCloudprod;
+
+ if (sameEnvironment && lastOAuthAuthorizeUrl) {
+ baseAuthorizeUrl = lastOAuthAuthorizeUrl;
+ } else {
+ baseAuthorizeUrl = `https://signin.${this.lfLoginService.authorize_url_host_name}/oauth/Authorize`;
+ }
+
+ return baseAuthorizeUrl;
+ }
+
+ storeInLocalStorage(accessTokenCredentials: AuthorizationCredentials, accountId: string, regionalDomain: string) {
+ this.lfLoginService.storeAccessToken(accessTokenCredentials);
+ const trusteeId: string = this.lfLoginService.parseAccessToken(accessTokenCredentials.accessToken);
+ const endpoints = DomainUtils.getLfEndpoints(regionalDomain);
+ this.lfLoginService.storeAccountInfo(accountId, trusteeId);
+ this.lfLoginService.storeAccountEndpoints(endpoints);
+ }
+
+ exchangeRedirectUriQueryParams(url: URL): RedirectUriQueryParams | undefined {
+ const authorizationCode = this.lfLoginService.extractCodeFromUrl(url);
+ const domain = this.lfLoginService.extractDomainFromUrl(url);
+ const customerId = this.lfLoginService.extractCustomerIdFromUrl(url);
+ const error = this.lfLoginService.extractErrorFromUrl(url);
+ if (authorizationCode && domain && customerId) {
+ return {
+ authorizationCode,
+ cloudSubDomain: domain,
+ customerId,
+ };
+ } else if (error) {
+ return { error };
+ }
+ return undefined;
+ }
+
+ determineCurrentState(
+ callBackURIParams: RedirectUriQueryParams | undefined,
+ loginCompleted: EventEmitter,
+ logoutCompleted: EventEmitter
+ ): LoginState {
+ const storedAccessToken = localStorage.getItem(this.lfLoginService.accessTokenStorageKey!);
+ const storedAccountEndpoints = localStorage.getItem(this.lfLoginService.accountEndpointsStorageKey);
+ const storedAccountId = localStorage.getItem(this.lfLoginService.accountIdStorageKey);
+
+ if (storedAccessToken && storedAccountEndpoints && storedAccountId) {
+ this.lfLoginService._accessToken = JSON.parse(storedAccessToken);
+ this.lfLoginService._accountEndpoints = JSON.parse(storedAccountEndpoints);
+ const accountInfo = JSON.parse(storedAccountId);
+ this.lfLoginService._accountInfo = accountInfo;
+ loginCompleted.emit();
+ return LoginState.LoggedIn;
+ } else if (callBackURIParams?.authorizationCode || callBackURIParams?.error) {
+ return LoginState.LoggingIn;
+ } else {
+ logoutCompleted.emit();
+ return LoginState.LoggedOut;
+ }
+ }
+
+ logoutInitiatedViaUrl(url: string | undefined, logoutInitiated: { emit: (url?: string) => void }): void {
+ logoutInitiated.emit(url);
+ }
+}
diff --git a/projects/ui-components/lf-login/login-utils/lf-login-internal-types.ts b/projects/ui-components/lf-login/login-utils/lf-login-internal-types.ts
index 49931bed..ec11799f 100644
--- a/projects/ui-components/lf-login/login-utils/lf-login-internal-types.ts
+++ b/projects/ui-components/lf-login/login-utils/lf-login-internal-types.ts
@@ -1,26 +1,26 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-/** @internal */
-export interface AccessTokenError {
- type?: string;
- title: string;
- status: number;
- instance?: string;
- operationId?: string;
- traceId?: string;
-}
-
-/** @internal */
-export interface AccountInfo {
- accountId: string;
- trusteeId: string;
-}
-
-/** @internal */
-export interface RedirectUriQueryParams {
- error?: { name: string; description: string };
- authorizationCode?: string;
- cloudSubDomain?: string;
- customerId?: string;
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+/** @internal */
+export interface AccessTokenError {
+ type?: string;
+ title: string;
+ status: number;
+ instance?: string;
+ operationId?: string;
+ traceId?: string;
+}
+
+/** @internal */
+export interface AccountInfo {
+ accountId: string;
+ trusteeId: string;
+}
+
+/** @internal */
+export interface RedirectUriQueryParams {
+ error?: { name: string; description: string };
+ authorizationCode?: string;
+ cloudSubDomain?: string;
+ customerId?: string;
+}
diff --git a/projects/ui-components/lf-login/login-utils/lf-login-types.ts b/projects/ui-components/lf-login/login-utils/lf-login-types.ts
index 3e16aeac..0d18bff7 100644
--- a/projects/ui-components/lf-login/login-utils/lf-login-types.ts
+++ b/projects/ui-components/lf-login/login-utils/lf-login-types.ts
@@ -1,50 +1,50 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-export interface AuthorizationCredentials {
- accessToken: string;
- refreshToken: string;
- expiresIn: string;
- tokenType: string;
-}
-
-export interface AccountEndpoints {
- webClientUrl: string;
- wsignoutUrl: string;
- regionalDomain: string;
- oauthAuthorizeUrl: string;
-}
-
-export interface AbortedLoginError {
- ErrorType: string;
- ErrorMessage: string;
-}
-
-/**
- * Interface defined by Laserfiche API providing
- * return type of beforeFetchRequestAsync
- */
-export interface LfBeforeFetchResult {
- regionalDomain: string;
-}
-
-/**
- * This object handles obtaining the accessToken and
- * setting the authorization header
- */
-export interface LfHttpRequestHandler {
- /**
- * Called to prepare the request to the API service.
- * @param url The HTTP url
- * @param request The HTTP request
- */
- beforeFetchRequestAsync: (url: string, request: RequestInit) => Promise;
- /**
- * Called to handle the response from the API service.
- * @param url The HTTP url
- * @param response The HTTP response
- * @param request The HTTP request
- * @returns true if the request should be retried.
- */
- afterFetchResponseAsync: (url: string, response: Response, request: RequestInit) => Promise;
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+export interface AuthorizationCredentials {
+ accessToken: string;
+ refreshToken: string;
+ expiresIn: string;
+ tokenType: string;
+}
+
+export interface AccountEndpoints {
+ webClientUrl: string;
+ wsignoutUrl: string;
+ regionalDomain: string;
+ oauthAuthorizeUrl: string;
+}
+
+export interface AbortedLoginError {
+ ErrorType: string;
+ ErrorMessage: string;
+}
+
+/**
+ * Interface defined by Laserfiche API providing
+ * return type of beforeFetchRequestAsync
+ */
+export interface LfBeforeFetchResult {
+ regionalDomain: string;
+}
+
+/**
+ * This object handles obtaining the accessToken and
+ * setting the authorization header
+ */
+export interface LfHttpRequestHandler {
+ /**
+ * Called to prepare the request to the API service.
+ * @param url The HTTP url
+ * @param request The HTTP request
+ */
+ beforeFetchRequestAsync: (url: string, request: RequestInit) => Promise;
+ /**
+ * Called to handle the response from the API service.
+ * @param url The HTTP url
+ * @param response The HTTP response
+ * @param request The HTTP request
+ * @returns true if the request should be retried.
+ */
+ afterFetchResponseAsync: (url: string, response: Response, request: RequestInit) => Promise;
+}
diff --git a/projects/ui-components/lf-login/login-utils/lf-login.service.spec.ts b/projects/ui-components/lf-login/login-utils/lf-login.service.spec.ts
index 9def84c1..5b7fcd8d 100644
--- a/projects/ui-components/lf-login/login-utils/lf-login.service.spec.ts
+++ b/projects/ui-components/lf-login/login-utils/lf-login.service.spec.ts
@@ -1,129 +1,179 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { TestBed } from '@angular/core/testing';
-import { LoginState } from '@laserfiche/lf-ui-components/shared';
-import { LfLoginService } from './lf-login.service';
-
-describe('LfLoginService', () => {
- let service: LfLoginService;
-
- beforeEach(() => {
- TestBed.configureTestingModule({});
- service = TestBed.inject(LfLoginService);
- });
-
- it('should be created', () => {
- expect(service).toBeTruthy();
- });
-
- it('exchangeCodeForTokenAsync should logout if error', () => {
- service.exchangeCodeForTokenAsync({ error: { description: 'Test error description', name: 'Test error name' } });
- expect(service._state).toEqual(LoginState.LoggedOut);
- expect(localStorage.getItem(service.accessTokenStorageKey)).toBeFalsy();
- });
-
- it('exchangeCodeForTokenAsync should throw error if empty params', async () => {
- await expectAsync(service.exchangeCodeForTokenAsync({})).toBeRejectedWithError();
- });
-
- it('exchangeCodeForTokenAsync should emit logoutCompletedInService if empty code verifier in local storage', async () => {
- localStorage.removeItem(service.codeVerifierStorageKey);
- spyOn(service.logoutCompletedInService, 'emit');
- await service.exchangeCodeForTokenAsync({authorizationCode: 'test authorization code' });
- expect(service.logoutCompletedInService.emit).toHaveBeenCalledWith({
- ErrorType: 'no code verifier',
- ErrorMessage: 'code verifier not found'
- });
- });
-
- it('removeFromLocalStorage should have empty local storage after being called', () => {
- localStorage.setItem(service.accessTokenStorageKey, 'test token');
- service.removeFromLocalStorage();
- expect(localStorage.getItem(service.accessTokenStorageKey)).toBeFalsy();
- });
-
- it('removeFromLocalStorage should not throw error if local storage is already empty', () => {
- expect(() => service.removeFromLocalStorage()).not.toThrow();
- expect(localStorage.getItem(service.accessTokenStorageKey)).toBeFalsy();
- });
-
- it('createPostTokenRequest should encode body in wwwUrlFormEncoded format', () => {
- service.redirect_uri = 'test-url';
- service.client_id = 'test-id';
- service.code_verifier = 'test-code-verifier';
- const request = service.createPostTokenRequest('testcode-string-hi');
- const bodyEncoded = service.objToWWWFormUrlEncodedBody({
- grant_type: 'authorization_code',
- code: 'testcode-string-hi',
- redirect_uri: service.redirect_uri,
- client_id: service.client_id,
- code_verifier: 'test-code-verifier'
- });
-
- expect(request.headers).toEqual({
- 'Content-Type': 'application/x-www-form-urlencoded',
- });
- expect(request.method).toEqual('POST');
- expect(request.body).toEqual(bodyEncoded);
- });
-
- it('getExchangeCodeSuccessResponse should get access token response', () => {
- const accessTokenCredentials = service.getExchangeCodeSuccessResponse({
- "access_token": "test-access",
- "expires_in": '3600',
- "token_type": "bearer",
- "refresh_token": "test-refresh"
- });
- expect(accessTokenCredentials).toEqual({ accessToken: 'test-access', refreshToken: 'test-refresh', expiresIn: '3600', tokenType: 'bearer' });
- });
-
- it('getExchangeCodeSuccessResponse should throw when not all properties exist', () => {
- expect(() => service.getExchangeCodeSuccessResponse({
- "token_type": "bearer",
- "refresh_token": "test-refresh"
- })).toThrow();
- });
-
- it('getPostRequestHeaders should get headers', () => {
- const requestHeaders = service.getPostRequestHeaders();
- expect(requestHeaders).toEqual({ 'Content-Type': 'application/x-www-form-urlencoded' });
- });
-
- it('storeInLocalStorage should have correct data in local storage', () => {
- const testHeader = btoa('{"test": "test"}');
- const encodedJWT = btoa('{"csid": "123456789", "trid": "1"}');
- const credentials = {
- accessToken: `${testHeader}.${encodedJWT}.hello`,
- refreshToken: 'test-refresh',
- expiresIn: '100',
- tokenType: 'bearer'
- };
- service.storeInLocalStorage(credentials, '123456789', 'laserfiche.com');
- expect(localStorage.getItem(service.accessTokenStorageKey)).toEqual(JSON.stringify(credentials));
- expect(localStorage.getItem(service.accountEndpointsStorageKey)).toEqual('{"webClientUrl":"https://app.laserfiche.com/laserfiche","wsignoutUrl":"https://accounts.laserfiche.com/WebSTS/?wa=wsignout1.0","regionalDomain":"laserfiche.com","oauthAuthorizeUrl":"https://signin.laserfiche.com/oauth/Authorize"}');
- expect(localStorage.getItem(service.accountIdStorageKey)).toEqual('{"accountId":"123456789","trusteeId":"1"}');
- });
-
- it('objToWWWFormUrlEncodedBody should format correctly', () => {
- const urlEncoded = service.objToWWWFormUrlEncodedBody({ test: 'hi', hello: 'bye', free: 't3st!ng&fun here' });
- expect(urlEncoded).toEqual('test=hi&hello=bye&free=t3st%21ng%26fun+here');
- });
-
- it('parseAccessToken should parse data from jwt', () => {
- const testHeader = btoa('{"test": "test"}');
- const JWT = {csid: '123456789', trid: '1'};
- const encodedJWT = btoa(JSON.stringify(JWT));
- const parsedToken = service.parseAccessToken(`${testHeader}.${encodedJWT}.hello`);
- expect(parsedToken).toEqual('1');
- });
-
- it('parseAccessToken should parse data from jwt with different environment/region', () => {
- service.authorize_url_host_name = 'a.clouddev.laserfiche.com';
- const testHeader = btoa('{"test": "test"}');
- const JWT = {csid: '1123456789', trid: '1'};
- const encodedJWT = btoa(JSON.stringify(JWT));
- const parsedToken = service.parseAccessToken(`${testHeader}.${encodedJWT}.hello`);
- expect(parsedToken).toEqual('1');
- });
-});
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { TestBed } from '@angular/core/testing';
+import { LoginState } from '@laserfiche/lf-ui-components/shared';
+import { LfLoginService } from './lf-login.service';
+import { CloudLoginProvider } from './cloud-login-provider';
+
+function createJwt(payload: Record): string {
+ const header = { alg: 'HS256', typ: 'JWT' };
+ const encode = (obj: Record) => btoa(JSON.stringify(obj));
+ return `${encode(header)}.${encode(payload)}.signature`;
+}
+
+describe('LfLoginService', () => {
+ let service: LfLoginService;
+
+ beforeEach(async () => {
+ // Clear local storage before each test to avoid test interference
+ localStorage.clear();
+
+ await TestBed.configureTestingModule({
+ providers: [LfLoginService],
+ }).compileComponents();
+
+ service = TestBed.inject(LfLoginService);
+ });
+
+ afterEach(() => {
+ // Cleanup local storage and test doubles after each test
+ localStorage.clear();
+ vi.restoreAllMocks();
+ });
+
+ it('should be created', () => {
+ expect(service).toBeTruthy();
+ });
+
+ it('exchangeCodeForTokenAsync should throw error if empty params', async () => {
+ service.loginProvider = new CloudLoginProvider(service);
+ await expect(service.exchangeCodeForTokenAsync({})).rejects.toThrow();
+ });
+
+ it('exchangeCodeForTokenAsync should logout if error', async () => {
+ const mockEmit = vi.spyOn(service.logoutCompletedInService, 'emit');
+
+ await service.exchangeCodeForTokenAsync({
+ error: {
+ description: 'Test error description',
+ name: 'Test error name',
+ },
+ });
+
+ expect(mockEmit).toHaveBeenCalled();
+ expect(service._state).toEqual(LoginState.LoggedOut);
+ expect(localStorage.getItem(service.accessTokenStorageKey)).toBeFalsy();
+ });
+
+ it('exchangeCodeForTokenAsync should emit logoutCompletedInService if empty code verifier in local storage', async () => {
+ localStorage.removeItem(service.codeVerifierStorageKey);
+ const mockEmit = vi.spyOn(service.logoutCompletedInService, 'emit');
+
+ await service.exchangeCodeForTokenAsync({ authorizationCode: 'test authorization code' });
+
+ expect(mockEmit).toHaveBeenCalledWith({
+ ErrorType: 'no code verifier',
+ ErrorMessage: 'code verifier not found',
+ });
+ });
+
+ it('removeFromLocalStorage should have empty local storage after being called', () => {
+ localStorage.setItem(service.accessTokenStorageKey, 'test token');
+ service.removeFromLocalStorage();
+ expect(localStorage.getItem(service.accessTokenStorageKey)).toBeFalsy();
+ });
+
+ it('removeFromLocalStorage should not throw error if local storage is already empty', () => {
+ expect(() => service.removeFromLocalStorage()).not.toThrow();
+ expect(localStorage.getItem(service.accessTokenStorageKey)).toBeFalsy();
+ });
+
+ it('createPostTokenRequest should encode body in wwwUrlFormEncoded format', () => {
+ service.redirect_uri = 'test-url';
+ service.client_id = 'test-id';
+ service.code_verifier = 'test-code-verifier';
+
+ const request = service.createPostTokenRequest('testcode-string-hi');
+ const bodyEncoded = service.objToWWWFormUrlEncodedBody({
+ grant_type: 'authorization_code',
+ code: 'testcode-string-hi',
+ redirect_uri: service.redirect_uri,
+ client_id: service.client_id,
+ code_verifier: 'test-code-verifier',
+ });
+
+ expect(request.headers).toEqual({
+ 'Content-Type': 'application/x-www-form-urlencoded',
+ });
+ expect(request.method).toEqual('POST');
+ expect(request.body).toEqual(bodyEncoded);
+ });
+
+ it('getExchangeCodeSuccessResponse should get access token response', () => {
+ const accessTokenCredentials = service.getExchangeCodeSuccessResponse({
+ access_token: 'test-access',
+ expires_in: '3600',
+ token_type: 'bearer',
+ refresh_token: 'test-refresh',
+ });
+ expect(accessTokenCredentials).toEqual({
+ accessToken: 'test-access',
+ refreshToken: 'test-refresh',
+ expiresIn: '3600',
+ tokenType: 'bearer',
+ });
+ });
+
+ it('getExchangeCodeSuccessResponse should throw when not all properties exist', () => {
+ expect(() =>
+ service.getExchangeCodeSuccessResponse({
+ token_type: 'bearer',
+ refresh_token: 'test-refresh',
+ })
+ ).toThrow();
+ });
+
+ it('getPostRequestHeaders should get headers', () => {
+ const requestHeaders = service.getPostRequestHeaders();
+ expect(requestHeaders).toEqual({ 'Content-Type': 'application/x-www-form-urlencoded' });
+ });
+
+ it('objToWWWFormUrlEncodedBody should format correctly', () => {
+ const urlEncoded = service.objToWWWFormUrlEncodedBody({ test: 'hi', hello: 'bye', free: 't3st!ng&fun here' });
+ expect(urlEncoded).toEqual('test=hi&hello=bye&free=t3st%21ng%26fun+here');
+ });
+
+ it('parseAccessToken should parse data from jwt', () => {
+ const accessToken = createJwt({ csid: '123456789', trid: '1' });
+ const parsedToken = service.parseAccessToken(accessToken);
+
+ expect(parsedToken).toEqual('1');
+ });
+
+ it('parseAccessToken should parse data from jwt with different environment/region', () => {
+ service.authorize_url_host_name = 'a.clouddev.laserfiche.com';
+ const accessToken = createJwt({ csid: '1123456789', trid: '1' });
+ const parsedToken = service.parseAccessToken(accessToken);
+
+ expect(parsedToken).toEqual('1');
+ });
+
+ it('extractErrorFromUrl with error', () => {
+ const testUrl = new URL('https://test-url.com?error=test-name&description=test-description');
+ const error = service.extractErrorFromUrl(testUrl);
+ expect(error).toEqual({ name: 'test-name', description: 'test-description' });
+ });
+
+ it('extractErrorFromUrl with error, no description', () => {
+ const testUrl = new URL('https://test-url.com?error=test-name');
+ const error = service.extractErrorFromUrl(testUrl);
+ expect(error).toEqual({ name: 'test-name', description: 'unknown' });
+ });
+
+ it('extractErrorFromUrl no error, no description', () => {
+ const testUrl = new URL('https://test-url.com');
+ const error = service.extractErrorFromUrl(testUrl);
+ expect(error).toBeUndefined();
+ });
+
+ it('extractCodeFromUrl gets code from url', () => {
+ const testUrl = new URL('https://test-url.com?code=test-code');
+ const codeFromUrl = service.extractCodeFromUrl(testUrl);
+ expect(codeFromUrl).toEqual('test-code');
+
+ const testUrlNoCode = new URL('https://test-url.com');
+ const noCodeFromUrl = service.extractCodeFromUrl(testUrlNoCode);
+ expect(noCodeFromUrl).toBeUndefined();
+ });
+});
diff --git a/projects/ui-components/lf-login/login-utils/lf-login.service.ts b/projects/ui-components/lf-login/login-utils/lf-login.service.ts
index 48cb0e9d..212463e2 100644
--- a/projects/ui-components/lf-login/login-utils/lf-login.service.ts
+++ b/projects/ui-components/lf-login/login-utils/lf-login.service.ts
@@ -1,267 +1,330 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-import { EventEmitter, Injectable, Output } from '@angular/core';
-import { AccountInfo, RedirectUriQueryParams } from './lf-login-internal-types';
-import { AbortedLoginError, AuthorizationCredentials, AccountEndpoints } from './lf-login-types';
-import { LoginState, RedirectBehavior } from '@laserfiche/lf-ui-components/shared';
-import { DomainUtils, GetAccessTokenResponse, ApiException, JwtUtils, TokenClient } from '@laserfiche/lf-api-client-core';
-const CONTENT_TYPE_WWW_FORM_URLENCODED = 'application/x-www-form-urlencoded';
-
-@Injectable({
- providedIn: 'root'
-})
-export class LfLoginService {
- /** @internal */
- _accessToken?: AuthorizationCredentials;
- /** @internal */
- _accountInfo?: AccountInfo;
- /** @internal */
- _accountEndpoints?: AccountEndpoints;
- /** @internal */
- _state?: LoginState;
-
- /** @internal */
- client_id!: string;
- /** @internal */
- redirect_uri!: string;
- /** @internal */
- scope!: string;
- /** @internal */
- redirect_behavior: RedirectBehavior = RedirectBehavior.Replace;
- /** @internal */
- authorize_url_host_name: string = 'laserfiche.com';
- /** @internal */
- code_verifier?: string;
-
- /** @internal */
- @Output() logoutCompletedInService: EventEmitter = new EventEmitter();
- /** @internal */
- @Output() loginCompletedInService: EventEmitter = new EventEmitter();
-
- /** @internal */
- private get base64EncodedClientId(): string {
- return btoa(this.client_id);
- }
-
- /** @internal */
- get accountIdStorageKey() {
- return `lf-login.${this.base64EncodedClientId}.account-id`;
- }
-
- /** @internal */
- get accountEndpointsStorageKey() {
- return `lf-login.${this.base64EncodedClientId}.account-endpoints`;
- }
-
- /** @internal */
- get accessTokenStorageKey() {
- return `lf-login.${this.base64EncodedClientId}.access-token`;
- }
-
- /** @internal */
- get codeVerifierStorageKey() {
- return `lf-login.${this.base64EncodedClientId}.code-verifier`;
- }
-
- /** @internal */
- private exchangeCodeForToken_lock: boolean = false;
-
- /** @internal */
- async exchangeCodeForTokenAsync(callBackURIParams: RedirectUriQueryParams) {
- let concurrentCallsDetected: boolean = false;
- try {
- if (this.exchangeCodeForToken_lock) {
- concurrentCallsDetected = true;
- console.warn('exchangeCodeForTokenAsync is already running. Will not try again.');
- return;
- }
- this.exchangeCodeForToken_lock = true;
- this.code_verifier = localStorage.getItem(this.codeVerifierStorageKey)!;
- if (callBackURIParams.authorizationCode && this.code_verifier) {
- try {
- const tokenClient = new TokenClient(callBackURIParams.cloudSubDomain!);
- const response = await tokenClient.getAccessTokenFromCode(callBackURIParams.authorizationCode, this.redirect_uri, this.client_id, undefined, this.code_verifier);
- const accessToken = await this.parseTokenResponseAsync(response);
- this.storeInLocalStorage(accessToken!, callBackURIParams.customerId!, callBackURIParams.cloudSubDomain!);
- this._state = LoginState.LoggedIn;
- console.info('state changed to LoggedIn');
- this.loginCompletedInService.emit();
- }
- catch (e) {
- const status = (e).status ?? 0;
- const message = (e).message;
- this.removeFromLocalStorage();
- this._state = LoginState.LoggedOut;
- console.error('Login Error (state changed to LoggedOut): ' + message);
- this.logoutCompletedInService.emit(
- {
- ErrorType: status.toString(),
- ErrorMessage: message
- });
- }
- }
- else if (callBackURIParams.error) {
- this._state = LoginState.LoggedOut;
- this.removeFromLocalStorage();
- this.logoutCompletedInService.emit({
- ErrorType: callBackURIParams.error.name,
- ErrorMessage: callBackURIParams.error.description!
- });
- console.error('Login Error (state changed to Logged Out): ' + callBackURIParams.error.name + ', ' + callBackURIParams.error.description);
- }
- else if (callBackURIParams.authorizationCode && !this.code_verifier) {
- this._state = LoginState.LoggedOut;
- this.removeFromLocalStorage();
- this.logoutCompletedInService.emit({
- ErrorType: 'no code verifier',
- ErrorMessage: 'code verifier not found'
- });
- console.error('Login Error (state changed to Logged Out): unable to find code verifier');
- }
- else {
- throw new Error('Unexpected callBackURIParams');
- }
- }
- finally {
- if (!concurrentCallsDetected) {
- this.exchangeCodeForToken_lock = false;
- }
- }
- }
-
- /** @internal */
- async parseTokenResponseAsync(response: GetAccessTokenResponse): Promise {
- try {
- const authorizationCredentials: AuthorizationCredentials = this.getExchangeCodeSuccessResponse(response);
- return authorizationCredentials;
- }
- catch {
- throw Error('Parse token response error.');
- }
- }
-
- /** @internal */
- removeFromLocalStorage() {
- this.removeCodeVerifierFromLocalStorage();
- localStorage.removeItem(this.accessTokenStorageKey!);
- localStorage.removeItem(this.accountIdStorageKey!);
- this.removeFromCache();
- }
-
- removeFromCache() {
- this._accessToken = undefined;
- this._accountInfo = undefined;
- }
-
- /** @internal */
- removeCodeVerifierFromLocalStorage() {
- localStorage.removeItem(this.codeVerifierStorageKey!);
- this.code_verifier = undefined;
- }
-
- /** @internal */
- createPostTokenRequest(code: string): RequestInit {
- const request: RequestInit = { method: 'POST' };
- const headers = this.getPostRequestHeaders();
- const body = {
- grant_type: 'authorization_code',
- code: code,
- redirect_uri: this.redirect_uri,
- client_id: this.client_id,
- code_verifier: this.code_verifier
- };
- const requestBody = this.objToWWWFormUrlEncodedBody(body);
- request.headers = headers;
- request.body = requestBody;
- return request;
- }
-
- /** @internal */
- getExchangeCodeSuccessResponse(jsonResponse: any) {
- const accessToken = jsonResponse['access_token'];
- const refreshToken = jsonResponse['refresh_token'];
- const expiresIn = jsonResponse['expires_in'];
- const tokenType = jsonResponse['token_type'];
- if (!accessToken) throw new Error('access_token undefined');
- if (!refreshToken) throw new Error('refresh_token undefined');
- if (!expiresIn) throw new Error('expires_in undefined');
- if (!tokenType) throw new Error('token_type undefined');
-
- const accessTokenResponse: AuthorizationCredentials = {
- accessToken,
- refreshToken,
- expiresIn,
- tokenType
- };
- return accessTokenResponse;
- }
-
- /** @internal */
- storeAccessToken(responseBody: AuthorizationCredentials) {
- localStorage.setItem(this.accessTokenStorageKey!, JSON.stringify(responseBody));
- this._accessToken = responseBody;
- }
-
- /** @internal */
- storeCodeVerifier(code_verifier: string) {
- localStorage.setItem(this.codeVerifierStorageKey!, code_verifier);
- }
-
- /** @internal */
- storeInLocalStorage(accessTokenCredentials: AuthorizationCredentials, accountId: string, regionalDomain: string) {
- const trusteeId: string = this.parseAccessToken(accessTokenCredentials.accessToken);
- const endpoints = DomainUtils.getLfEndpoints(regionalDomain);
- this.storeAccountInfo(accountId, trusteeId);
- this.storeAccountEndpoints(endpoints);
- this.storeAccessToken(accessTokenCredentials);
- }
-
- /** @internal */
- getPostRequestHeaders() {
- const headers: Record = {
- 'Content-Type': CONTENT_TYPE_WWW_FORM_URLENCODED
- };
-
- return headers;
- }
-
- /** @internal */
- objToWWWFormUrlEncodedBody(obj: any): string {
- const urlSearchParams = new URLSearchParams();
- for (const i in obj) {
- urlSearchParams.set(i, obj[i]);
- }
- return urlSearchParams.toString();
- }
-
- /** @internal */
- parseAccessToken(accessToken: string): string {
- const decodedAccessToken = JwtUtils.parseAccessToken(accessToken);
- const trusteeId = JwtUtils.getTrusteeIdFromLfJWT(decodedAccessToken);
- return trusteeId;
- }
-
- /** @internal */
- private storeAccountEndpoints(accountEndpoints: AccountEndpoints) {
- localStorage.setItem(this.accountEndpointsStorageKey!, JSON.stringify(accountEndpoints));
- this._accountEndpoints = accountEndpoints;
- }
-
- /** @internal */
- private storeAccountInfo(accountId: string, trusteeId: string) {
- const accountInfo: AccountInfo = {
- accountId,
- trusteeId
- };
- localStorage.setItem(this.accountIdStorageKey!, JSON.stringify(accountInfo));
- this._accountInfo = accountInfo;
- }
-
- refreshServiceAccountProperties() {
- const accountInfo = localStorage.getItem(this.accountIdStorageKey);
- const accountEndpoints = localStorage.getItem(this.accountEndpointsStorageKey);
- this._accountInfo = JSON.parse(accountInfo!);
- this._accountEndpoints = JSON.parse(accountEndpoints!);
- }
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { EventEmitter, Injectable, Output } from '@angular/core';
+import { AccountInfo, RedirectUriQueryParams } from './lf-login-internal-types';
+import { AbortedLoginError, AuthorizationCredentials, AccountEndpoints } from './lf-login-types';
+import { LoginState, RedirectBehavior, LoginType } from '@laserfiche/lf-ui-components/shared';
+import { GetAccessTokenResponse, ApiException, JwtUtils } from '@laserfiche/lf-api-client-core';
+import { LoginProvider } from './login-provider';
+const CONTENT_TYPE_WWW_FORM_URLENCODED = 'application/x-www-form-urlencoded';
+
+@Injectable({
+ providedIn: 'root',
+})
+export class LfLoginService {
+ /** @internal */
+ _accessToken?: AuthorizationCredentials;
+ /** @internal */
+ _accountInfo?: AccountInfo;
+ /** @internal */
+ _accountEndpoints?: AccountEndpoints;
+ /** @internal */
+ _state?: LoginState;
+
+ /** @internal */
+ client_id?: string;
+ /** @internal */
+ redirect_uri!: string;
+ /** @internal */
+ scope?: string;
+ /** @internal */
+ redirect_behavior: RedirectBehavior = RedirectBehavior.Replace;
+ /** @internal */
+ authorize_url_host_name: string = 'laserfiche.com';
+ /** @internal */
+ self_hosted_base_url?: string;
+ /** @internal */
+ self_hosted_account_endpoints?: AccountEndpoints;
+
+ /** @internal */
+ code_verifier?: string;
+ /** @internal */
+ login_type: LoginType = LoginType.Cloud;
+ /** @internal */
+ loginProvider?: LoginProvider;
+ /** @internal */
+ login_identifier: string = this.client_id ?? '';
+
+ /** @internal */
+ @Output() logoutCompletedInService: EventEmitter = new EventEmitter<
+ AbortedLoginError | undefined
+ >();
+ /** @internal */
+ @Output() loginCompletedInService: EventEmitter = new EventEmitter();
+
+ /** @internal */
+ private get base64EncodedLoginIdentifier(): string {
+ return btoa(this.login_identifier);
+ }
+
+ /** @internal */
+ get accountIdStorageKey() {
+ return `lf-login.${this.base64EncodedLoginIdentifier}.account-id`;
+ }
+
+ /** @internal */
+ get accountEndpointsStorageKey() {
+ return `lf-login.${this.base64EncodedLoginIdentifier}.account-endpoints`;
+ }
+
+ /** @internal */
+ get accessTokenStorageKey() {
+ return `lf-login.${this.base64EncodedLoginIdentifier}.access-token`;
+ }
+
+ /** @internal */
+ get codeVerifierStorageKey() {
+ return `lf-login.${this.base64EncodedLoginIdentifier}.code-verifier`;
+ }
+
+ /** @internal */
+ private exchangeCodeForToken_lock: boolean = false;
+
+ /** @internal */
+ getAccountEndpoints(): AccountEndpoints | undefined {
+ try {
+ const accountEndpointsFromStorage = localStorage.getItem(this.accountEndpointsStorageKey);
+ if (accountEndpointsFromStorage) {
+ const accountEndpoints: AccountEndpoints = JSON.parse(accountEndpointsFromStorage);
+ return accountEndpoints;
+ } else {
+ return undefined;
+ }
+ // }
+ } catch (err: any) {
+ console.warn('Unable to retrieve accountEndpoints: ' + err.message);
+ return undefined;
+ }
+ }
+
+ /** @internal */
+ async exchangeCodeForTokenAsync(callBackURIParams: RedirectUriQueryParams) {
+ let concurrentCallsDetected: boolean = false;
+ try {
+ if (this.exchangeCodeForToken_lock) {
+ concurrentCallsDetected = true;
+ console.warn('exchangeCodeForTokenAsync is already running. Will not try again.');
+ return;
+ }
+ this.exchangeCodeForToken_lock = true;
+ this.code_verifier = localStorage.getItem(this.codeVerifierStorageKey)!;
+ const tokenClient = this.loginProvider?.getTokenClient(callBackURIParams.cloudSubDomain!);
+ if (callBackURIParams.authorizationCode && this.code_verifier && tokenClient) {
+ try {
+ const response = await tokenClient.getAccessTokenFromCode(
+ callBackURIParams.authorizationCode,
+ this.redirect_uri,
+ this.client_id,
+ undefined,
+ this.code_verifier
+ );
+ const accessToken = await this.parseTokenResponseAsync(response);
+ this.loginProvider?.storeInLocalStorage(
+ accessToken!,
+ callBackURIParams.customerId!,
+ callBackURIParams.cloudSubDomain!
+ );
+ this._state = LoginState.LoggedIn;
+ console.info('state changed to LoggedIn');
+ this.loginCompletedInService.emit();
+ } catch (e) {
+ const status = (e).status ?? 0;
+ const message = (e).message;
+ this.removeFromLocalStorage();
+ this._state = LoginState.LoggedOut;
+ console.error('Login Error (state changed to LoggedOut): ' + message);
+ this.logoutCompletedInService.emit({
+ ErrorType: status.toString(),
+ ErrorMessage: message,
+ });
+ }
+ } else if (callBackURIParams.error) {
+ this._state = LoginState.LoggedOut;
+ this.removeFromLocalStorage();
+ this.logoutCompletedInService.emit({
+ ErrorType: callBackURIParams.error.name,
+ ErrorMessage: callBackURIParams.error.description!,
+ });
+ console.error(
+ 'Login Error (state changed to Logged Out): ' +
+ callBackURIParams.error.name +
+ ', ' +
+ callBackURIParams.error.description
+ );
+ } else if (callBackURIParams.authorizationCode && !this.code_verifier) {
+ this._state = LoginState.LoggedOut;
+ this.removeFromLocalStorage();
+ this.logoutCompletedInService.emit({
+ ErrorType: 'no code verifier',
+ ErrorMessage: 'code verifier not found',
+ });
+ console.error('Login Error (state changed to Logged Out): unable to find code verifier');
+ } else if (!tokenClient) {
+ this._state = LoginState.LoggedOut;
+ this.removeFromLocalStorage();
+ this.logoutCompletedInService.emit({
+ ErrorType: 'TokenClient is undefined',
+ ErrorMessage: 'TokenClient is undefined',
+ });
+ console.error('Login Error (state changed to Logged Out): unable to use an undefined TokenClient', tokenClient);
+ } else {
+ throw new Error('Unexpected callBackURIParams');
+ }
+ } finally {
+ if (!concurrentCallsDetected) {
+ this.exchangeCodeForToken_lock = false;
+ }
+ }
+ }
+
+ /** @internal */
+ async parseTokenResponseAsync(response: GetAccessTokenResponse): Promise {
+ try {
+ const authorizationCredentials: AuthorizationCredentials = this.getExchangeCodeSuccessResponse(response);
+ return authorizationCredentials;
+ } catch {
+ throw Error('Parse token response error.');
+ }
+ }
+
+ /** @internal */
+ getExchangeCodeSuccessResponse(jsonResponse: any) {
+ const accessToken = jsonResponse['access_token'];
+ const refreshToken = jsonResponse['refresh_token'] ?? jsonResponse['refreshToken'];
+ const expiresIn = jsonResponse['expires_in'];
+ const tokenType = jsonResponse['token_type'];
+ if (!accessToken) throw new Error('access_token undefined');
+ if (!expiresIn) throw new Error('expires_in undefined');
+ if (!tokenType) throw new Error('token_type undefined');
+ if (!refreshToken) throw new Error('refresh_token undefined');
+
+ return {
+ accessToken,
+ refreshToken,
+ expiresIn,
+ tokenType,
+ };
+ }
+
+ /** @internal */
+ removeFromLocalStorage() {
+ this.removeCodeVerifierFromLocalStorage();
+ localStorage.removeItem(this.accessTokenStorageKey!);
+ localStorage.removeItem(this.accountIdStorageKey!);
+ this.removeFromCache();
+ }
+
+ removeFromCache() {
+ this._accessToken = undefined;
+ this._accountInfo = undefined;
+ }
+
+ /** @internal */
+ removeCodeVerifierFromLocalStorage() {
+ localStorage.removeItem(this.codeVerifierStorageKey!);
+ this.code_verifier = undefined;
+ }
+
+ /** @internal */
+ createPostTokenRequest(code: string): RequestInit {
+ const request: RequestInit = { method: 'POST' };
+ const headers = this.getPostRequestHeaders();
+ const body = {
+ grant_type: 'authorization_code',
+ code: code,
+ redirect_uri: this.redirect_uri,
+ client_id: this.client_id,
+ code_verifier: this.code_verifier,
+ };
+ const requestBody = this.objToWWWFormUrlEncodedBody(body);
+ request.headers = headers;
+ request.body = requestBody;
+ return request;
+ }
+
+ /** @internal */
+ storeAccessToken(responseBody: AuthorizationCredentials) {
+ localStorage.setItem(this.accessTokenStorageKey!, JSON.stringify(responseBody));
+ this._accessToken = responseBody;
+ }
+
+ /** @internal */
+ storeCodeVerifier(code_verifier: string) {
+ localStorage.setItem(this.codeVerifierStorageKey!, code_verifier);
+ }
+
+ /** @internal */
+ getPostRequestHeaders() {
+ const headers: Record = {
+ 'Content-Type': CONTENT_TYPE_WWW_FORM_URLENCODED,
+ };
+
+ return headers;
+ }
+
+ /** @internal */
+ objToWWWFormUrlEncodedBody(obj: any): string {
+ const urlSearchParams = new URLSearchParams();
+ for (const i in obj) {
+ urlSearchParams.set(i, obj[i]);
+ }
+ return urlSearchParams.toString();
+ }
+
+ /** @internal */
+ parseAccessToken(accessToken: string): string {
+ const decodedAccessToken = JwtUtils.parseAccessToken(accessToken);
+ const trusteeId = JwtUtils.getTrusteeIdFromLfJWT(decodedAccessToken);
+ return trusteeId;
+ }
+
+ /** @internal */
+ storeAccountEndpoints(accountEndpoints: AccountEndpoints) {
+ localStorage.setItem(this.accountEndpointsStorageKey!, JSON.stringify(accountEndpoints));
+ this._accountEndpoints = accountEndpoints;
+ }
+
+ /** @internal */
+ storeAccountInfo(accountId: string, trusteeId: string) {
+ const accountInfo: AccountInfo = {
+ accountId,
+ trusteeId,
+ };
+ localStorage.setItem(this.accountIdStorageKey!, JSON.stringify(accountInfo));
+ this._accountInfo = accountInfo;
+ }
+
+ refreshServiceAccountProperties() {
+ const accountInfo = localStorage.getItem(this.accountIdStorageKey);
+ const accountEndpoints = localStorage.getItem(this.accountEndpointsStorageKey);
+ this._accountInfo = JSON.parse(accountInfo!);
+ this._accountEndpoints = JSON.parse(accountEndpoints!);
+ }
+
+ /** @internal */
+ extractErrorFromUrl(url: URL): { name: string; description: string } | undefined {
+ const error = url.searchParams.get('error');
+ if (error) {
+ const description = url.searchParams.get('description') ?? 'unknown';
+ return { name: error, description };
+ } else {
+ return undefined;
+ }
+ }
+
+ /** @internal */
+ extractCodeFromUrl(url: URL): string | undefined {
+ return url.searchParams.get('code') ?? undefined;
+ }
+
+ /** @internal */
+ extractDomainFromUrl(url: URL): string | undefined {
+ return url.searchParams.get('domain') ?? undefined;
+ }
+
+ /** @internal */
+ extractCustomerIdFromUrl(url: URL): string | undefined {
+ return url.searchParams.get('customerId') ?? undefined;
+ }
+}
diff --git a/projects/ui-components/lf-login/login-utils/login-provider.ts b/projects/ui-components/lf-login/login-utils/login-provider.ts
new file mode 100644
index 00000000..d8354e4f
--- /dev/null
+++ b/projects/ui-components/lf-login/login-utils/login-provider.ts
@@ -0,0 +1,69 @@
+// Copyright Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { BaseTokenClient } from '@laserfiche/lf-api-client-core';
+import { AuthorizationCredentials } from './lf-login-types';
+import { RedirectUriQueryParams } from './lf-login-internal-types';
+import { LoginState } from '@laserfiche/lf-ui-components/shared';
+
+/** @internal */
+export interface LoginProvider {
+ /**
+ * Returns a {@link BaseTokenClient} instance with the provided token client URL.
+ *
+ * @param tokenClientUrl - The URL of the token client (optional).
+ * @returns A new instance of {@link BaseTokenClient}.
+ */
+ getTokenClient(tokenClientUrl?: string): BaseTokenClient;
+
+ /**
+ * Returns the base authorize URL for the login process.
+ *
+ * @return The base authorize URL as a string.
+ */
+ getBaseAuthorizeUrl(): string;
+
+ /**
+ * Stores access token credentials and account information in local storage.
+ *
+ * @param accessTokenCredentials - The access token credentials to store.
+ * @param accountId - The account ID associated with the access token.
+ * @param regionalDomain - The regional domain associated with the access token.
+ */
+ storeInLocalStorage(
+ accessTokenCredentials: AuthorizationCredentials,
+ accountId: string,
+ regionalDomain: string
+ ): void;
+
+ /**
+ * Exchanges redirect URI query parameters from a URL into a {@link RedirectUriQueryParams} object.
+ *
+ * @param url - The URL containing the query parameters to exchange.
+ * @return A new instance of {@link RedirectUriQueryParams} or undefined if no valid query parameters are found.
+ */
+ exchangeRedirectUriQueryParams(url: URL): RedirectUriQueryParams | undefined;
+
+ /**
+ * Determines the current state of the login process based on callback URI parameters and emits events to notify
+ * other components of the login state change.
+ *
+ * @param callBackURIParams - The callback URI parameters received from the login provider.
+ * @param loginCompleted - An event emitter that will be notified when the login is completed successfully.
+ * @param logoutCompleted - An event emitter that will be notified when the logout is completed successfully.
+ * @return The current state of the login process as a {@link LoginState} enum value.
+ */
+ determineCurrentState(
+ callBackURIParams: RedirectUriQueryParams | undefined,
+ loginCompleted: { emit: () => void },
+ logoutCompleted: { emit: () => void }
+ ): LoginState;
+
+ /**
+ * Initiates the logout process by emitting a URL to the provided event emitter.
+ *
+ * @param url - The URL that will be emitted to initiate the logout process (optional).
+ * @param logoutInitiated - An event emitter that will receive the URL to initiate the logout process.
+ */
+ logoutInitiatedViaUrl(url: string | undefined, logoutInitiated: { emit: (url: string) => void }): void;
+}
diff --git a/projects/ui-components/lf-login/login-utils/pkce-utils.ts b/projects/ui-components/lf-login/login-utils/pkce-utils.ts
index ce53a0ad..119888d4 100644
--- a/projects/ui-components/lf-login/login-utils/pkce-utils.ts
+++ b/projects/ui-components/lf-login/login-utils/pkce-utils.ts
@@ -1,27 +1,27 @@
-// Copyright (c) Laserfiche.
-// Licensed under the MIT License. See LICENSE in the project root for license information.
-
-export function arrayBufferToBase64(buffer: ArrayBuffer) {
- var binary = '';
- var bytes = new Uint8Array(buffer);
- var len = bytes.byteLength;
- for (var i = 0; i < len; i++) {
- binary += String.fromCharCode(bytes[i]);
- }
- return window.btoa(binary);
-}
-
-export function convertNumber(n: string, fromBase: number, toBase: number) {
- if (fromBase === void 0) {
- fromBase = 10;
- }
- if (toBase === void 0) {
- toBase = 10;
- }
- return parseInt(n.toString(), fromBase).toString(toBase);
-}
-
-/** @internal */
-export function dec2base64(dec: number) {
- return dec.toString(16).padStart(2, "0");
-}
+// Copyright (c) Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+export function arrayBufferToBase64(buffer: ArrayBuffer) {
+ var binary = '';
+ var bytes = new Uint8Array(buffer);
+ var len = bytes.byteLength;
+ for (var i = 0; i < len; i++) {
+ binary += String.fromCharCode(bytes[i]);
+ }
+ return window.btoa(binary);
+}
+
+export function convertNumber(n: string, fromBase: number, toBase: number) {
+ if (fromBase === void 0) {
+ fromBase = 10;
+ }
+ if (toBase === void 0) {
+ toBase = 10;
+ }
+ return parseInt(n.toString(), fromBase).toString(toBase);
+}
+
+/** @internal */
+export function dec2base64(dec: number) {
+ return dec.toString(16).padStart(2, '0');
+}
diff --git a/projects/ui-components/lf-login/login-utils/self-hosted-login-provider.spec.ts b/projects/ui-components/lf-login/login-utils/self-hosted-login-provider.spec.ts
new file mode 100644
index 00000000..3b362333
--- /dev/null
+++ b/projects/ui-components/lf-login/login-utils/self-hosted-login-provider.spec.ts
@@ -0,0 +1,168 @@
+// Copyright Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { SelfHostedTokenClient } from '@laserfiche/lf-api-client-core';
+import { LfLoginService } from './lf-login.service';
+import { AccountEndpoints, AuthorizationCredentials } from './lf-login-types';
+import { EventEmitter } from '@angular/core';
+import { LoginState } from '@laserfiche/lf-ui-components/shared';
+import { SelfHostedLoginProvider } from './self-hosted-login-provider';
+
+const authorizationCredentialsMock: AuthorizationCredentials = {
+ accessToken: 'test-access',
+ refreshToken: 'test-refresh',
+ expiresIn: '3600',
+ tokenType: 'bearer',
+};
+
+const accountEndpointsMock: AccountEndpoints = {
+ webClientUrl: 'https://api.example.com',
+ wsignoutUrl: 'https://api.example.com/signout',
+ regionalDomain: 'example.com',
+ oauthAuthorizeUrl: 'https://example.com/oauth/authorize',
+};
+
+describe('SelfHostedLoginProvider', () => {
+ let provider: SelfHostedLoginProvider;
+ let lfLoginServiceMock: Partial;
+
+ beforeEach(() => {
+ lfLoginServiceMock = {
+ storeAccessToken: vi.fn(),
+ storeAccountInfo: vi.fn(),
+ storeAccountEndpoints: vi.fn(),
+ extractCodeFromUrl: vi.fn(),
+ extractErrorFromUrl: vi.fn(),
+ accessTokenStorageKey: 'mock-storage-key',
+ };
+
+ provider = new SelfHostedLoginProvider(lfLoginServiceMock as LfLoginService, 'mock-repository-id');
+ });
+
+ describe('getTokenClient', () => {
+ it('should return a TokenClient instance', () => {
+ const tokenClient = provider.getTokenClient();
+ expect(tokenClient).toBeInstanceOf(SelfHostedTokenClient);
+ });
+ });
+
+ describe('getBaseAuthorizeUrl', () => {
+ it('should return the base authorize URL when last OAuth authorize URL exist and host name does not include dev and test environments', () => {
+ lfLoginServiceMock.self_hosted_account_endpoints = accountEndpointsMock;
+ const baseAuthorizeUrl = provider.getBaseAuthorizeUrl();
+ expect(baseAuthorizeUrl).toBe(accountEndpointsMock.oauthAuthorizeUrl);
+ });
+ });
+
+ describe('storeInLocalStorage', () => {
+ it('should store access token credentials and account endpoints in local storage', () => {
+ const accessTokenCredentials = {
+ accessToken: 'test-access',
+ expiresIn: '3600',
+ tokenType: 'bearer',
+ refreshToken: 'refresh-token',
+ };
+
+ provider.storeInLocalStorage(accessTokenCredentials, '', '');
+
+ expect(lfLoginServiceMock.storeAccessToken).toHaveBeenCalledWith(accessTokenCredentials);
+ expect(lfLoginServiceMock.storeAccountInfo).not.toHaveBeenCalled();
+ });
+ });
+
+ describe('exchangeRedirectUriQueryParams', () => {
+ it('should return RedirectUriQueryParams with authorization code', () => {
+ lfLoginServiceMock.extractCodeFromUrl = vi.fn().mockReturnValue('abc');
+ const url = new URL('https://example.com/callback?code=abc&domain=example.com');
+
+ const redirectUriQueryParams = provider.exchangeRedirectUriQueryParams(url);
+
+ expect(redirectUriQueryParams).toEqual({
+ authorizationCode: 'abc',
+ });
+ });
+
+ it('should return RedirectUriQueryParams with error when available', () => {
+ lfLoginServiceMock.extractCodeFromUrl = vi.fn().mockReturnValue(undefined);
+ lfLoginServiceMock.extractErrorFromUrl = vi.fn().mockReturnValue({ name: 'xyz', description: 'unknown' });
+ const url = new URL('https://example.com/callback?error=xyz');
+
+ const redirectUriQueryParams = provider.exchangeRedirectUriQueryParams(url);
+
+ expect(redirectUriQueryParams).toEqual({
+ error: { name: 'xyz', description: 'unknown' },
+ });
+ });
+
+ it('should return undefined when particular query parameters are missing', () => {
+ lfLoginServiceMock.extractCodeFromUrl = vi.fn().mockReturnValue(undefined);
+ lfLoginServiceMock.extractErrorFromUrl = vi.fn().mockReturnValue(undefined);
+ const url = new URL('https://example.com/callback?somthing=else');
+
+ const redirectUriQueryParams = provider.exchangeRedirectUriQueryParams(url);
+
+ expect(redirectUriQueryParams).toBeUndefined();
+ });
+ });
+
+ describe('determineCurrentState', () => {
+ it('should return LoginState.LoggedIn when access token and account information are stored in local storage', () => {
+ // Reset mocks
+ lfLoginServiceMock.storeAccessToken = vi.fn().mockClear();
+
+ const loginCompleteEmitMock = { emit: vi.fn() } as unknown as EventEmitter;
+ const logoutCompleted = {} as unknown as EventEmitter;
+
+ localStorage.getItem = vi
+ .fn()
+ .mockReturnValueOnce('access-token-value')
+ .mockReturnValueOnce('account-endpoints-value');
+
+ JSON.parse = vi.fn().mockReturnValueOnce(authorizationCredentialsMock).mockReturnValueOnce(accountEndpointsMock);
+
+ const currentState = provider.determineCurrentState(undefined, loginCompleteEmitMock, logoutCompleted);
+
+ expect(currentState).toBe(LoginState.LoggedIn);
+ expect(loginCompleteEmitMock.emit).toHaveBeenCalled();
+ });
+
+ it('should return LoginState.LoggingIn when authorization code is available in callback URI params', () => {
+ const callBackURIParams = { authorizationCode: 'abc' };
+ const loginCompleted = new EventEmitter();
+ const logoutCompleted = new EventEmitter();
+
+ const currentState = provider.determineCurrentState(callBackURIParams, loginCompleted, logoutCompleted);
+
+ expect(currentState).toBe(LoginState.LoggingIn);
+ });
+
+ it('should return LoginState.LoggedOut when no access token or account endpoints are stored in local storage', () => {
+ const loginCompleted = { emit: vi.fn() } as unknown as EventEmitter;
+ const logoutCompletedEmitMock = { emit: vi.fn() } as unknown as EventEmitter;
+
+ const currentState = provider.determineCurrentState(undefined, loginCompleted, logoutCompletedEmitMock);
+
+ expect(currentState).toBe(LoginState.LoggedOut);
+ expect(logoutCompletedEmitMock.emit).toHaveBeenCalled();
+ });
+ });
+
+ describe('logoutInitiatedViaUrl', () => {
+ it('should emit the provided URL when logout initiated via URL', () => {
+ const emitSpy = vi.fn();
+ const url = 'https://example.com/logout';
+
+ provider.logoutInitiatedViaUrl(url, { emit: emitSpy });
+
+ expect(emitSpy).toHaveBeenCalledTimes(1);
+ expect(emitSpy).toHaveBeenCalledWith(url);
+ });
+
+ it('should not emit when URL is undefined', () => {
+ const emitSpy = vi.fn();
+ provider.logoutInitiatedViaUrl(undefined, { emit: emitSpy });
+
+ expect(emitSpy).not.toHaveBeenCalled();
+ });
+ });
+});
diff --git a/projects/ui-components/lf-login/login-utils/self-hosted-login-provider.ts b/projects/ui-components/lf-login/login-utils/self-hosted-login-provider.ts
new file mode 100644
index 00000000..f0d22536
--- /dev/null
+++ b/projects/ui-components/lf-login/login-utils/self-hosted-login-provider.ts
@@ -0,0 +1,74 @@
+// Copyright Laserfiche.
+// Licensed under the MIT License. See LICENSE in the project root for license information.
+
+import { EventEmitter } from '@angular/core';
+import { LoginProvider } from './login-provider';
+import { LfLoginService } from './lf-login.service';
+import { SelfHostedTokenClient } from '@laserfiche/lf-api-client-core';
+import { AuthorizationCredentials } from './lf-login-types';
+import { RedirectUriQueryParams } from './lf-login-internal-types';
+import { LoginState } from '@laserfiche/lf-ui-components/shared';
+
+/** @internal */
+export class SelfHostedLoginProvider implements LoginProvider {
+ constructor(
+ private lfLoginService: LfLoginService,
+ private readonly repositoryId: string
+ ) {}
+
+ getTokenClient() {
+ return new SelfHostedTokenClient(
+ `${this.lfLoginService.self_hosted_base_url}/v2/Repositories/${this.repositoryId}/Token`
+ );
+ }
+
+ getBaseAuthorizeUrl(): string {
+ return this.lfLoginService.self_hosted_account_endpoints?.oauthAuthorizeUrl ?? '';
+ }
+
+ storeInLocalStorage(accessTokenCredentials: AuthorizationCredentials, _accountId: string, _regionalDomain: string) {
+ this.lfLoginService.storeAccessToken(accessTokenCredentials);
+ if (this.lfLoginService.self_hosted_account_endpoints) {
+ this.lfLoginService.storeAccountEndpoints(this.lfLoginService.self_hosted_account_endpoints);
+ }
+ }
+
+ exchangeRedirectUriQueryParams(url: URL): RedirectUriQueryParams | undefined {
+ const authorizationCode = this.lfLoginService.extractCodeFromUrl(url);
+ const error = this.lfLoginService.extractErrorFromUrl(url);
+ if (authorizationCode) {
+ return {
+ authorizationCode,
+ };
+ } else if (error) {
+ return { error };
+ }
+ return undefined;
+ }
+
+ determineCurrentState(
+ callBackURIParams: RedirectUriQueryParams | undefined,
+ loginCompleted: EventEmitter,
+ logoutCompleted: EventEmitter
+ ): LoginState {
+ const storedAccessToken = localStorage.getItem(this.lfLoginService.accessTokenStorageKey!);
+ const storedAccountEndpoints = localStorage.getItem(this.lfLoginService.accountEndpointsStorageKey);
+ if (storedAccessToken && storedAccountEndpoints) {
+ this.lfLoginService._accessToken = JSON.parse(storedAccessToken);
+ this.lfLoginService._accountEndpoints = JSON.parse(storedAccountEndpoints);
+ loginCompleted.emit();
+ return LoginState.LoggedIn;
+ } else if (callBackURIParams?.authorizationCode || callBackURIParams?.error) {
+ return LoginState.LoggingIn;
+ } else {
+ logoutCompleted.emit();
+ return LoginState.LoggedOut;
+ }
+ }
+
+ logoutInitiatedViaUrl(url: string | undefined, logoutInitiated: { emit: (url?: string) => void }): void {
+ if (url) {
+ logoutInitiated.emit(url);
+ }
+ }
+}
diff --git a/projects/ui-components/lf-login/ng-package.json b/projects/ui-components/lf-login/ng-package.json
index 1ff9abf3..0e280510 100644
--- a/projects/ui-components/lf-login/ng-package.json
+++ b/projects/ui-components/lf-login/ng-package.json
@@ -1,5 +1,5 @@
{
"lib": {
- "entryFile": "./lf-login-public-api.ts"
+ "entryFile": "./lf-login-public-api.ts"
}
}
diff --git a/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/base-field/base-field.directive.ts b/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/base-field/base-field.directive.ts
index f7ca7ef6..76181171 100644
--- a/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/base-field/base-field.directive.ts
+++ b/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/base-field/base-field.directive.ts
@@ -10,6 +10,7 @@ import {
ViewChild,
ElementRef,
ChangeDetectorRef,
+ inject,
} from '@angular/core';
import { LfFieldInfo, LfFieldValue } from '../../../utils/lf-field-types';
import { FormControl, ValidatorFn, FormGroup } from '@angular/forms';
@@ -21,10 +22,13 @@ import { Observable, of } from 'rxjs';
import { map, mergeMap, startWith } from 'rxjs/operators';
import { CoreUtils } from '@laserfiche/lf-js-utils';
-
/** @internal */
@Directive()
export abstract class BaseFieldDirective implements OnInit {
+ public tokenService = inject(LfFieldTokenService);
+ public ref = inject(ChangeDetectorRef);
+ public localizationService = inject(AppLocalizationService);
+
@Input() lf_field_info!: LfFieldInfo;
@Input() lf_field_form_control!: FormControl;
@Input() lf_field_value: LfFieldValue | undefined;
@@ -96,11 +100,7 @@ export abstract class BaseFieldDirective implements OnInit {
);
}
- constructor(
- public tokenService: LfFieldTokenService,
- public ref: ChangeDetectorRef,
- public localizationService: AppLocalizationService
- ) {}
+ constructor() {}
fieldValidationErrorMsg!: Observable;
@@ -211,7 +211,6 @@ export abstract class BaseFieldDirective implements OnInit {
}
}
-
onTokenChosen(token: string) {
if (this.tokenTarget) {
const newFieldVal: string = this.createNewFieldValueWithToken(token);
diff --git a/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/base-field/datetime-base-field.directives.ts b/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/base-field/datetime-base-field.directives.ts
index b46aface..1bc5f2c5 100644
--- a/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/base-field/datetime-base-field.directives.ts
+++ b/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/base-field/datetime-base-field.directives.ts
@@ -1,15 +1,12 @@
// Copyright Laserfiche.
// Licensed under the MIT License. See LICENSE in the project root for license information.
-import { Directive, OnInit } from "@angular/core";
-import { BaseFieldDirective } from "./base-field.directive";
-import {
- UniComponentConfig,
- UniComponentSettings,
- UniDateTimeComponent,
-} from '../../../../lf-date-time-picker/uni-date-time.module';
-import { ValidationRule } from "@laserfiche/lf-ui-components/internal-shared";
-import { of } from "rxjs";
+import { Directive, OnInit } from '@angular/core';
+import { BaseFieldDirective } from './base-field.directive';
+import { ValidationRule } from '@laserfiche/lf-ui-components/internal-shared';
+import { of } from 'rxjs';
+import { UniComponentConfig, UniComponentSettings } from '../../../../lf-date-time-picker/uni-date-time.common';
+import { UniDateTimeComponent } from '../../../../lf-date-time-picker/uni-date-time.component';
@Directive()
export abstract class DateTimeBaseFieldDirective extends BaseFieldDirective implements OnInit {
diff --git a/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/date-field/date-field.component.css b/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/date-field/date-field.component.css
index c1edc7d8..ba8e6e42 100644
--- a/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/date-field/date-field.component.css
+++ b/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/date-field/date-field.component.css
@@ -1,17 +1,17 @@
::ng-deep .lf-datepicker-toggle > .mdc-icon-button:hover {
color: rgba(0, 0, 0, 0.8);
}
-::ng-deep mat-datepicker-toggle.mat-datepicker-toggle.lf-datepicker-toggle >.mat-mdc-icon-button.mat-mdc-button-base {
- padding-top: 12px;
- padding-right: 0px;
+::ng-deep mat-datepicker-toggle.mat-datepicker-toggle.lf-datepicker-toggle > .mat-mdc-icon-button.mat-mdc-button-base {
+ padding-top: 12px;
+ padding-right: 0px;
}
-::ng-deep .lf-datepicker-toggle > .mdc-icon-button .mat-mdc-button-persistent-ripple,
+::ng-deep .lf-datepicker-toggle > .mdc-icon-button .mat-mdc-button-persistent-ripple,
::ng-deep .lf-datepicker-toggle > .mdc-icon-button .mat-ripple.mat-mdc-button-ripple {
- top: 6px;
- left: 12px;
- height: 35px;
- width: 35px;
+ top: 6px;
+ left: 12px;
+ height: 35px;
+ width: 35px;
}
/* Add extra spacing only when no error is shown to keep date field visually consistent with other form fields */
diff --git a/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/date-field/date-field.component.html b/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/date-field/date-field.component.html
index 5cc36520..632e9e7b 100644
--- a/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/date-field/date-field.component.html
+++ b/projects/ui-components/lf-metadata/field-components/field-base-parts/lf-field-base/date-field/date-field.component.html
@@ -1,26 +1,48 @@
-
-
-