diff --git a/.eslintrc.json b/.eslintrc.json index 37e9487d1..c995d01d9 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -31,7 +31,6 @@ "@angular-eslint/directive-selector": [ "error", { - "prefix": "suricate", "style": "camelCase", "type": "attribute" } diff --git a/karma.conf.js b/karma.conf.js deleted file mode 100644 index 5f8b640fc..000000000 --- a/karma.conf.js +++ /dev/null @@ -1,42 +0,0 @@ -// Karma configuration file, see link for more information -// https://karma-runner.github.io/1.0/config/configuration-file.html - -module.exports = function(config) { - config.set({ - basePath: '', - frameworks: ['jasmine', '@angular-devkit/build-angular'], - plugins: [ - require('karma-jasmine'), - require('karma-coverage'), - require('karma-chrome-launcher'), - require('karma-jasmine-html-reporter'), - require('@angular-devkit/build-angular/plugins/karma') - ], - client: { - clearContext: false // leave Jasmine Spec Runner output visible in browser - }, - coverageReporter: { - dir: require('path').join(__dirname, 'coverage'), - subdir: '.', - reporters: [{ type: 'html' }, { type: 'text-summary' }] - }, - reporters: ['progress', 'kjhtml'], - port: 9876, - colors: true, - logLevel: config.LOG_INFO, - autoWatch: true, - browsers: ['Chrome', 'ChromeHeadlessNoSandbox'], - customLaunchers: { - ChromeHeadlessNoSandbox: { - base: 'ChromeHeadless', - flags: ['--headless', '--disable-gpu', '--no-sandbox', '--js-flags=--max-old-space-size=8192'] - } - }, - captureTimeout: 600000, - browserNoActivityTimeout: 120000, - browserDisconnectTimeout: 120000, - browserDisconnectTolerance: 2, - singleRun: false, - restartOnFileChange: true - }); -}; diff --git a/package.json b/package.json index 0827bd7ac..f1d8081c3 100644 --- a/package.json +++ b/package.json @@ -56,7 +56,9 @@ "@angular/language-service": "^17.0.5", "@types/jasmine": "~5.1.4", "@types/jasminewd2": "~2.0.13", + "@types/jotform-css.js": "^1.0.4", "@types/node": "^20.10.2", + "@types/sockjs-client": "^1.5.4", "@typescript-eslint/eslint-plugin": "^6.13.1", "@typescript-eslint/parser": "^6.13.1", "eslint": "^8.55.0", @@ -75,4 +77,4 @@ "ts-node": "~10.9.1", "typescript": "~5.2.2" } -} \ No newline at end of file +} diff --git a/src/main/webapp/.eslintrc.json b/src/main/webapp/.eslintrc.json deleted file mode 100644 index e5fa1ae3e..000000000 --- a/src/main/webapp/.eslintrc.json +++ /dev/null @@ -1,42 +0,0 @@ -{ - "extends": "../../../.eslintrc.json", - "ignorePatterns": [ - "!**/*" - ], - "overrides": [ - { - "files": [ - "*.ts" - ], - "parserOptions": { - "project": [ - "src/main/webapp/tsconfig.app.json", - "src/main/webapp/tsconfig.spec.json" - ], - "createDefaultProgram": true - }, - "rules": { - "@angular-eslint/directive-selector": [ - "error", - { - "type": "attribute", - "style": "camelCase" - } - ], - "@angular-eslint/component-selector": [ - "error", - { - "type": "element", - "style": "kebab-case" - } - ] - } - }, - { - "files": [ - "*.html" - ], - "rules": {} - } - ] -} diff --git a/src/main/webapp/app/admin/configurations/configurations.component.ts b/src/main/webapp/app/admin/configurations/configurations.component.ts index 34913f234..a05539c7d 100644 --- a/src/main/webapp/app/admin/configurations/configurations.component.ts +++ b/src/main/webapp/app/admin/configurations/configurations.component.ts @@ -26,6 +26,10 @@ import { } from '../../shared/services/backend/http-category-parameters/http-category-parameters.service'; import { CategoryParameter } from '../../shared/models/backend/category-parameters/category-parameter'; import { DataTypeEnum } from '../../shared/enums/data-type.enum'; +import { + WidgetConfigurationRequest +} from '../../shared/models/backend/widget-configuration/widget-configuration-request'; +import { UntypedFormGroup } from '@angular/forms'; /** * Component used to display the list of widgets @@ -34,7 +38,7 @@ import { DataTypeEnum } from '../../shared/enums/data-type.enum'; templateUrl: '../../shared/components/list/list.component.html', styleUrls: ['../../shared/components/list/list.component.scss'] }) -export class ConfigurationsComponent extends ListComponent { +export class ConfigurationsComponent extends ListComponent { /** * Constructor * @@ -55,14 +59,14 @@ export class ConfigurationsComponent extends ListComponent { /** * {@inheritDoc} */ - protected getFirstLabel(configuration: CategoryParameter): string { + protected override getFirstLabel(configuration: CategoryParameter): string { return configuration.description; } /** * {@inheritDoc} */ - protected getSecondLabel(configuration: CategoryParameter): string { + protected override getSecondLabel(configuration: CategoryParameter): string { return configuration.value && configuration.dataType === DataTypeEnum.PASSWORD && !configuration.showValue ? '•'.repeat(configuration.value.length) : configuration.value; @@ -71,7 +75,7 @@ export class ConfigurationsComponent extends ListComponent { /** * {@inheritDoc} */ - protected getThirdLabel(configuration: CategoryParameter): string { + protected override getThirdLabel(configuration: CategoryParameter): string { return configuration.category.name; } @@ -141,11 +145,11 @@ export class ConfigurationsComponent extends ListComponent { * @param configuration The repository clicked on the list * @param saveCallback The function to call when save button is clicked */ - private openFormSidenav(event: Event, configuration: CategoryParameter, saveCallback: (configuration: CategoryParameter) => void): void { + private openFormSidenav(event: Event, configuration: CategoryParameter, saveCallback: (formGroup: UntypedFormGroup) => void): void { this.sidenavService.openFormSidenav({ title: 'configuration.edit', formFields: this.widgetConfigurationFormFieldsService.generateFormFields(configuration), - save: (configurationRequest: CategoryParameter) => saveCallback(configurationRequest) + save: (formGroup: UntypedFormGroup) => saveCallback(formGroup) }); } @@ -171,10 +175,10 @@ export class ConfigurationsComponent extends ListComponent { /** * Update a configuration * - * @param configuration The configuration to update + * @param formGroup The form group */ - private updateConfiguration(configuration: CategoryParameter): void { - this.httpCategoryParametersService.update(configuration.key, configuration).subscribe(() => { + private updateConfiguration(formGroup: UntypedFormGroup): void { + this.httpCategoryParametersService.update(formGroup.value.key, formGroup.value).subscribe(() => { this.refreshList(); this.toastService.sendMessage('configuration.update.success', ToastTypeEnum.SUCCESS); }); diff --git a/src/main/webapp/app/admin/dashboards/dashboards.component.ts b/src/main/webapp/app/admin/dashboards/dashboards.component.ts index e042c26a7..50f2d71e4 100644 --- a/src/main/webapp/app/admin/dashboards/dashboards.component.ts +++ b/src/main/webapp/app/admin/dashboards/dashboards.component.ts @@ -32,12 +32,13 @@ import { ValueChangedEvent } from '../../shared/models/frontend/form/value-chang import { EMPTY, Observable, of } from 'rxjs'; import { switchMap } from 'rxjs/operators'; import { CssService } from '../../shared/services/frontend/css/css.service'; +import { UntypedFormGroup } from '@angular/forms'; @Component({ templateUrl: '../../shared/components/list/list.component.html', styleUrls: ['../../shared/components/list/list.component.scss'] }) -export class DashboardsComponent extends ListComponent { +export class DashboardsComponent extends ListComponent { /** * Project selected in the list for modifications */ @@ -75,21 +76,21 @@ export class DashboardsComponent extends ListComponent /** * {@inheritDoc} */ - protected getFirstLabel(project: Project): string { + protected override getFirstLabel(project: Project): string { return project.name; } /** * {@inheritDoc} */ - protected getSecondLabel(project: Project): string { + protected override getSecondLabel(project: Project): string { return project.token; } /** * {@inheritDoc} */ - public redirectToBean(project: Project): void { + public override redirectToBean(project: Project): void { this.router.navigate(['/dashboards', project.token, project.grids[0].id]); } @@ -152,16 +153,17 @@ export class DashboardsComponent extends ListComponent this.sidenavService.openFormSidenav({ title: project ? 'dashboard.edit' : 'dashboard.create', formFields: this.projectFormFieldsService.generateProjectFormFields(project), - save: (projectRequest: ProjectRequest) => this.editProject(projectRequest) + save: (formGroup: UntypedFormGroup) => this.editProject(formGroup) }); } /** * Redirect on the edit page * - * @param projectRequest The project clicked on the list + * @param formGroup The form group */ - private editProject(projectRequest: ProjectRequest): void { + private editProject(formGroup: UntypedFormGroup): void { + const projectRequest: ProjectRequest = formGroup.value; projectRequest.cssStyle = CssService.buildCssFile([CssService.buildCssGridBackgroundColor(projectRequest.gridBackgroundColor)]); this.httpProjectService.update(this.projectSelected.token, projectRequest).subscribe(() => { diff --git a/src/main/webapp/app/admin/repositories/repositories.component.ts b/src/main/webapp/app/admin/repositories/repositories.component.ts index 7921c4394..4f044e3fb 100644 --- a/src/main/webapp/app/admin/repositories/repositories.component.ts +++ b/src/main/webapp/app/admin/repositories/repositories.component.ts @@ -30,6 +30,7 @@ import { ToastTypeEnum } from '../../shared/enums/toast-type.enum'; import { Observable } from 'rxjs/internal/Observable'; import { BehaviorSubject, EMPTY, forkJoin, of } from 'rxjs'; import { DatePipe } from '@angular/common'; +import { UntypedFormGroup } from '@angular/forms'; /** * Component used to display the list of git repositories @@ -38,7 +39,7 @@ import { DatePipe } from '@angular/common'; templateUrl: '../../shared/components/list/list.component.html', styleUrls: ['../../shared/components/list/list.component.scss'] }) -export class RepositoriesComponent extends ListComponent { +export class RepositoriesComponent extends ListComponent { /** * The repository being built */ @@ -69,21 +70,21 @@ export class RepositoriesComponent extends ListComponent { /** * {@inheritDoc} */ - protected getFirstLabel(repository: Repository): string { + protected override getFirstLabel(repository: Repository): string { return repository.name; } /** * {@inheritDoc} */ - protected getSecondLabel(repository: Repository): string { + protected override getSecondLabel(repository: Repository): string { return repository.type === RepositoryTypeEnum.REMOTE ? repository.url : repository.localPath; } /** * {@inheritDoc} */ - protected getThirdLabel(repository: Repository): string { + protected override getThirdLabel(repository: Repository): string { return this.translateService.instant('repository.third.label', { type: repository.type, priority: repository.priority, @@ -148,7 +149,7 @@ export class RepositoriesComponent extends ListComponent { /** * {@inheritDoc} */ - protected onItemsLoaded() { + protected override onItemsLoaded() { this.initHeaderConfiguration(); this.dragAndDropDisabled = !this.objectsPaged.content || this.objectsPaged.content.length <= 1; } @@ -160,13 +161,13 @@ export class RepositoriesComponent extends ListComponent { * @param repository The repository clicked on the list * @param saveCallback The function to call when save button is clicked */ - private openFormSidenav(event: Event, repository: Repository, saveCallback: (repositoryRequest: RepositoryRequest) => void): void { + private openFormSidenav(event: Event, repository: Repository, saveCallback: (formGroup: UntypedFormGroup) => void): void { this.repository = repository ? Object.assign({}, repository) : new Repository(); this.sidenavService.openFormSidenav({ title: repository ? 'repository.edit' : 'repository.add', formFields: this.repositoryFormFieldsService.generateFormFields(repository), - save: (repositoryRequest: RepositoryRequest) => saveCallback(repositoryRequest), + save: (formGroup: UntypedFormGroup) => saveCallback(formGroup), onValueChanged: (valueChangedEvent: ValueChangedEvent) => this.onValueChanged(valueChangedEvent) }); } @@ -211,9 +212,10 @@ export class RepositoriesComponent extends ListComponent { /** * Update a repository * If the repository is enabled, all the repositories will be resynchronized in priority order - * @param repositoryRequest The new repository with the modification made on the form + * @param formGroup The form group */ - private updateRepository(repositoryRequest: RepositoryRequest): void { + private updateRepository(formGroup: UntypedFormGroup): void { + const repositoryRequest: RepositoryRequest = formGroup.value; if (repositoryRequest.login.trim().length === 0) { repositoryRequest.login = null; } @@ -239,7 +241,8 @@ export class RepositoriesComponent extends ListComponent { * Function used to add a repository * @param repositoryRequest The new repository to add with the modification made on the form */ - private addRepository(repositoryRequest: RepositoryRequest): void { + private addRepository(fromGroup: UntypedFormGroup): void { + const repositoryRequest: RepositoryRequest = fromGroup.value; this.disableAllReposSync.next(true); this.dragAndDropDisabled = true; if (repositoryRequest.enabled) { @@ -287,7 +290,7 @@ export class RepositoriesComponent extends ListComponent { /** * Update repositories priority when dropped and save them */ - public drop(): void { + public override drop(): void { this.objectsPaged.content.forEach(repository => { repository.priority = this.objectsPaged.content.indexOf(repository) + 1; }); diff --git a/src/main/webapp/app/admin/users/users.component.ts b/src/main/webapp/app/admin/users/users.component.ts index f215ba585..62e482600 100644 --- a/src/main/webapp/app/admin/users/users.component.ts +++ b/src/main/webapp/app/admin/users/users.component.ts @@ -26,6 +26,7 @@ import { } from '../../shared/services/frontend/form-fields/user-form-fields/user-form-fields.service'; import { UserRequest } from '../../shared/models/backend/user/user-request'; import { HttpAdminUserService } from '../../shared/services/backend/http-admin-user/http-admin-user.service'; +import { UntypedFormGroup } from '@angular/forms'; /** * Component used to display the list of users @@ -34,7 +35,7 @@ import { HttpAdminUserService } from '../../shared/services/backend/http-admin-u templateUrl: '../../shared/components/list/list.component.html', styleUrls: ['../../shared/components/list/list.component.scss'] }) -export class UsersComponent extends ListComponent implements OnInit { +export class UsersComponent extends ListComponent implements OnInit { /** * User selected in the list for modification */ @@ -60,7 +61,7 @@ export class UsersComponent extends ListComponent implements OnInit { /** * Called when the component is init */ - public ngOnInit(): void { + public override ngOnInit(): void { super.ngOnInit(); } @@ -105,21 +106,21 @@ export class UsersComponent extends ListComponent implements OnInit { /** * {@inheritDoc} */ - protected getFirstLabel(user: User): string { + protected override getFirstLabel(user: User): string { return `${user.firstname} ${user.lastname} (${user.username})`; } /** * {@inheritDoc} */ - protected getSecondLabel(user: User): string { + protected override getSecondLabel(user: User): string { return user.email; } /** * {@inheritDoc} */ - protected getThirdLabel(user: User): string { + protected override getThirdLabel(user: User): string { return user.roles.map((role: Role) => role.name).join(', '); } @@ -130,21 +131,22 @@ export class UsersComponent extends ListComponent implements OnInit { * @param user The user clicked on the list * @param saveCallback The function to call when save button is clicked */ - private openFormSidenav(event: Event, user: User, saveCallback: (userRequest: UserRequest) => void): void { + private openFormSidenav(event: Event, user: User, saveCallback: (formGroup: UntypedFormGroup) => void): void { this.userSelected = user; this.sidenavService.openFormSidenav({ title: user ? 'user.edit' : 'user.add', formFields: this.userFormFieldsService.generateFormFields(user), - save: (userRequest: UserRequest) => saveCallback(userRequest) + save: (formGroup: UntypedFormGroup) => saveCallback(formGroup) }); } /** * Edit a user - * @param userRequest The user request to make + * @param formGroup The form group */ - private editUser(userRequest: UserRequest): void { + private editUser(formGroup: UntypedFormGroup): void { + const userRequest: UserRequest = formGroup.value; this.httpAdminUserService.update(this.userSelected.id, userRequest).subscribe(() => { super.refreshList(); }); diff --git a/src/main/webapp/app/core/components/home/home.component.ts b/src/main/webapp/app/core/components/home/home.component.ts index 22a838030..ab648833e 100644 --- a/src/main/webapp/app/core/components/home/home.component.ts +++ b/src/main/webapp/app/core/components/home/home.component.ts @@ -1,5 +1,7 @@ import { Component, OnInit } from '@angular/core'; -import { ProjectFormFieldsService } from '../../../shared/services/frontend/form-fields/project-form-fields/project-form-fields.service'; +import { + ProjectFormFieldsService +} from '../../../shared/services/frontend/form-fields/project-form-fields/project-form-fields.service'; import { ProjectRequest } from '../../../shared/models/backend/project/project-request'; import { CssService } from '../../../shared/services/frontend/css/css.service'; import { Project } from '../../../shared/models/backend/project/project'; @@ -15,6 +17,7 @@ import { MaterialIconRecords } from '../../../shared/records/material-icon.recor import { IconEnum } from '../../../shared/enums/icon.enum'; import { HeaderConfiguration } from '../../../shared/models/frontend/header/header-configuration'; import { ButtonTypeEnum } from '../../../shared/enums/button-type.enum'; +import { UntypedFormGroup } from '@angular/forms'; @Component({ selector: 'suricate-my-dashboards', @@ -102,16 +105,17 @@ export class HomeComponent implements OnInit { this.sidenavService.openFormSidenav({ title: 'dashboard.create', formFields: this.projectFormFieldsService.generateProjectFormFields(), - save: (formData: ProjectRequest) => this.saveDashboard(formData) + save: (formGroup: UntypedFormGroup) => this.saveDashboard(formGroup) }); } /** * Create a new dashboard * - * @param formData The data retrieved from the form + * @param formGroup The form group */ - private saveDashboard(formData: ProjectRequest): void { + private saveDashboard(formGroup: UntypedFormGroup): void { + const formData: ProjectRequest = formGroup.value; formData.cssStyle = CssService.buildCssFile([CssService.buildCssGridBackgroundColor(formData.gridBackgroundColor)]); this.httpProjectService.create(formData).subscribe((project: Project) => { diff --git a/src/main/webapp/app/core/components/settings/security-settings/security-settings.component.ts b/src/main/webapp/app/core/components/settings/security-settings/security-settings.component.ts index e1d234318..b8ef2d5b4 100644 --- a/src/main/webapp/app/core/components/settings/security-settings/security-settings.component.ts +++ b/src/main/webapp/app/core/components/settings/security-settings/security-settings.component.ts @@ -57,7 +57,7 @@ export class SecuritySettingsComponent implements OnInit { /** * The revoke button */ - public revokeButton: ButtonConfiguration; + public revokeButton: ButtonConfiguration; /** * The created token diff --git a/src/main/webapp/app/core/components/settings/ux-settings/ux-settings.component.ts b/src/main/webapp/app/core/components/settings/ux-settings/ux-settings.component.ts index fc791c3a4..9a2e07264 100644 --- a/src/main/webapp/app/core/components/settings/ux-settings/ux-settings.component.ts +++ b/src/main/webapp/app/core/components/settings/ux-settings/ux-settings.component.ts @@ -91,28 +91,26 @@ export class UxSettingsComponent implements OnInit { this.formService.validate(this.formGroup); if (this.formGroup.valid) { - this.saveSettings(this.formGroup.value); + this.saveSettings(); } } /** * Save the selected settings - * - * @param formData The selected settings from the form */ - private saveSettings(formData: FormData): void { + private saveSettings(): void { from(this.userSettings.map(userSetting => userSetting.setting)) .pipe( mergeMap((setting: Setting) => { const userSettingRequest = new UserSettingRequest(); if (setting.constrained && setting.allowedSettingValues) { const selectedAllowedSetting = setting.allowedSettingValues.find((allowedSettingValue: AllowedSettingValue) => { - return allowedSettingValue.value === formData[setting.type]; + return allowedSettingValue.value === this.formGroup.get(setting.type).value; }); userSettingRequest.allowedSettingValueId = selectedAllowedSetting.id; } else { - userSettingRequest.unconstrainedValue = formData[setting.type]; + userSettingRequest.unconstrainedValue = this.formGroup.get(setting.type).value; } return this.httpUserService.updateUserSetting(AuthenticationService.getConnectedUser().username, setting.id, userSettingRequest); diff --git a/src/main/webapp/app/dashboard/components/dashboard-detail/dashboard-detail.component.ts b/src/main/webapp/app/dashboard/components/dashboard-detail/dashboard-detail.component.ts index b350d115b..800641231 100644 --- a/src/main/webapp/app/dashboard/components/dashboard-detail/dashboard-detail.component.ts +++ b/src/main/webapp/app/dashboard/components/dashboard-detail/dashboard-detail.component.ts @@ -36,7 +36,6 @@ import { } from '../../../shared/services/frontend/form-fields/project-form-fields/project-form-fields.service'; import { mergeMap, switchMap, takeUntil, tap } from 'rxjs/operators'; import { EMPTY, Observable, of, Subject } from 'rxjs'; -import { DashboardScreenComponent } from '../dashboard-screen/dashboard-screen.component'; import { MatDialog } from '@angular/material/dialog'; import { MaterialIconRecords } from '../../../shared/records/material-icon.record'; import { ValueChangedEvent } from '../../../shared/models/frontend/form/value-changed-event'; @@ -54,6 +53,7 @@ import { import { ProjectGridRequest } from '../../../shared/models/backend/project-grid/project-grid-request'; import { ProjectGrid } from '../../../shared/models/backend/project-grid/project-grid'; import { GridRequest } from '../../../shared/models/backend/project-grid/grid-request'; +import { UntypedFormGroup } from '@angular/forms'; /** * Component used to display a specific dashboard @@ -65,14 +65,15 @@ import { GridRequest } from '../../../shared/models/backend/project-grid/grid-re }) export class DashboardDetailComponent implements OnInit, OnDestroy { /** - * Subject used to unsubscribe all the subscriptions when the component is destroyed + * The dashboard screen */ - private unsubscribe: Subject = new Subject(); + @ViewChild('dashboardScreen', { read: ElementRef }) + public dashboardScreen: ElementRef; /** - * The dashboard html (as HTML Element) + * Subject used to unsubscribe all the subscriptions when the component is destroyed */ - public dashboardScreen: DashboardScreenComponent; + private unsubscribe: Subject = new Subject(); /** * Hold the configuration of the header component @@ -377,8 +378,8 @@ export class DashboardDetailComponent implements OnInit, OnDestroy { this.sidenavService.openFormSidenav({ title: 'dashboard.edit', formFields: this.projectFormFieldsService.generateProjectFormFields(this.project), - belongingComponent: this.dashboardScreen, - save: (formData: ProjectRequest) => this.editDashboard(formData) + componentRef: this.dashboardScreen, + save: (formGroup: UntypedFormGroup) => this.editDashboard(formGroup) }); } @@ -389,7 +390,7 @@ export class DashboardDetailComponent implements OnInit, OnDestroy { this.sidenavService.openFormSidenav({ title: 'grid.add', formFields: this.projectFormFieldsService.generateAddGridFormField(), - save: (formData: GridRequest) => this.addNewGrid(formData) + save: (formGroup: UntypedFormGroup) => this.addNewGrid(formGroup) }); } @@ -400,16 +401,17 @@ export class DashboardDetailComponent implements OnInit, OnDestroy { this.sidenavService.openFormSidenav({ title: 'dashboard.grid.management', formFields: this.projectFormFieldsService.generateGridsManagementFormFields(this.project), - save: (formData: ProjectGridRequest) => this.editGrids(formData) + save: (formGroup: UntypedFormGroup) => this.editGrids(formGroup) }); } /** * Execute the action edit the dashboard when the sidenav has been saved * - * @param formData The data retrieve from the form sidenav + * @param formGroup The form group */ - private editDashboard(formData: ProjectRequest): void { + private editDashboard(formGroup: UntypedFormGroup): void { + const formData: ProjectRequest = formGroup.value; formData.cssStyle = `.grid { background-color: ${formData.gridBackgroundColor}; }`; this.httpProjectService.update(this.project.token, formData).subscribe(() => { @@ -438,7 +440,8 @@ export class DashboardDetailComponent implements OnInit, OnDestroy { * * @param formData The data retrieved from the side nav */ - private addNewGrid(formData: GridRequest): void { + private addNewGrid(formGroup: UntypedFormGroup): void { + const formData: GridRequest = formGroup.value; this.httpProjectGridsService.create(this.project.token, formData).subscribe((createdProjectGrid: ProjectGrid) => { this.router.navigate(['/dashboards', this.dashboardToken, createdProjectGrid.id]); }); @@ -449,7 +452,8 @@ export class DashboardDetailComponent implements OnInit, OnDestroy { * * @param formData The data retrieve from the form sidenav */ - private editGrids(formData: ProjectGridRequest): void { + private editGrids(formGroup: UntypedFormGroup): void { + const formData: ProjectGridRequest = formGroup.value; const newTimes = Object.keys(formData) .filter(key => key.includes(ProjectFormFieldsService.timeFormFieldKey)) .map(key => formData[key]); @@ -554,15 +558,4 @@ export class DashboardDetailComponent implements OnInit, OnDestroy { public handlingDashboardDisconnect(): void { this.router.navigate(['/home']); } - - /** - * Set the dashboard screen component - * @param content The dashboard screen component - */ - @ViewChild('dashboardScreen', { read: ElementRef }) - public set content(content: DashboardScreenComponent) { - if (content) { - this.dashboardScreen = content; - } - } } diff --git a/src/main/webapp/app/dashboard/components/dashboard-screen/dashboard-screen-widget/dashboard-screen-widget.component.ts b/src/main/webapp/app/dashboard/components/dashboard-screen/dashboard-screen-widget/dashboard-screen-widget.component.ts index a98ccb192..cd985bab0 100644 --- a/src/main/webapp/app/dashboard/components/dashboard-screen/dashboard-screen-widget/dashboard-screen-widget.component.ts +++ b/src/main/webapp/app/dashboard/components/dashboard-screen/dashboard-screen-widget/dashboard-screen-widget.component.ts @@ -214,7 +214,7 @@ export class DashboardScreenWidgetComponent implements OnInit, OnDestroy { this.widget.params, this.projectWidget.backendConfig ), - save: (formData: FormData) => this.saveWidget(formData), + save: (formGroup: UntypedFormGroup) => this.saveWidget(formGroup), slideToggleButtonConfiguration: this.buildSlideToggleButtonConfiguration(this.widget.category.categoryParameters) }); } @@ -222,17 +222,17 @@ export class DashboardScreenWidgetComponent implements OnInit, OnDestroy { /** * Save the widget modifications * - * @param formData The form data + * @param formGroup The form group */ - public saveWidget(formData: FormData) { + public saveWidget(formGroup: UntypedFormGroup) { this.loading = true; const projectWidgetRequest: ProjectWidgetRequest = { widgetId: this.projectWidget.widgetId, customStyle: this.projectWidget.customStyle, - backendConfig: Object.keys(formData) - .filter((key: string) => formData[key] != null && String(formData[key]).trim() !== '') - .map((key: string) => `${key}=${String(formData[key]).replace(/\n/g, '\\n')}`) + backendConfig: Object.keys(formGroup.value) + .filter((key: string) => formGroup.get(key).value != null && String(formGroup.get(key).value).trim() !== '') + .map((key: string) => `${key}=${String(formGroup.get(key).value).replace(/\n/g, '\\n')}`) .join('\n') }; diff --git a/src/main/webapp/app/dashboard/components/dashboard-screen/dashboard-screen.component.ts b/src/main/webapp/app/dashboard/components/dashboard-screen/dashboard-screen.component.ts index 062dc7b4b..49fcddf62 100644 --- a/src/main/webapp/app/dashboard/components/dashboard-screen/dashboard-screen.component.ts +++ b/src/main/webapp/app/dashboard/components/dashboard-screen/dashboard-screen.component.ts @@ -155,36 +155,36 @@ export class DashboardScreenComponent implements AfterViewInit, OnChanges, OnDes * @param changes The change event */ public ngOnChanges(changes: SimpleChanges): void { - if (changes.project) { - if (!changes.project.previousValue) { + if (changes['project']) { + if (!changes['project'].previousValue) { // Inject this variable in the window scope because some widgets use it to init the js (window as any).page_loaded = true; } - if (changes.project.currentValue) { + if (changes['project'].currentValue) { this.initGridStackOptions(); // Do not add libs in the DOM at first view init // Let the after view init method handle the first initialization - if (!changes.project.firstChange) { + if (!changes['project'].firstChange) { this.addExternalJSLibrariesToTheDOM(); } - if (!changes.project.previousValue) { + if (!changes['project'].previousValue) { this.initProjectWebsockets(); } else { - if (changes.project.previousValue.token !== changes.project.currentValue.token) { + if (changes['project'].previousValue.token !== changes['project'].currentValue.token) { this.resetProjectWebsockets(); } } } } - if (changes.readOnly) { + if (changes['readOnly']) { this.initGridStackOptions(); } - if (changes.projectWidgets) { + if (changes['projectWidgets']) { this.initGrid(); } } diff --git a/src/main/webapp/app/dashboard/components/wizard/add-widget-to-project-wizard/add-widget-to-project-wizard.component.ts b/src/main/webapp/app/dashboard/components/wizard/add-widget-to-project-wizard/add-widget-to-project-wizard.component.ts index 37946797f..9ff66e538 100644 --- a/src/main/webapp/app/dashboard/components/wizard/add-widget-to-project-wizard/add-widget-to-project-wizard.component.ts +++ b/src/main/webapp/app/dashboard/components/wizard/add-widget-to-project-wizard/add-widget-to-project-wizard.component.ts @@ -29,6 +29,7 @@ import { import { ProjectWidget } from '../../../../shared/models/backend/project-widget/project-widget'; import { HttpProjectService } from '../../../../shared/services/backend/http-project/http-project.service'; import { Project } from '../../../../shared/models/backend/project/project'; +import { UntypedFormGroup } from '@angular/forms'; @Component({ templateUrl: '../../../../shared/components/wizard/wizard.component.html', @@ -55,7 +56,7 @@ export class AddWidgetToProjectWizardComponent extends WizardComponent implement /** * Called when the component is init */ - public ngOnInit(): void { + public override ngOnInit(): void { this.projectWidgetFormStepsService.generateGlobalSteps().subscribe((formSteps: FormStep[]) => { this.wizardConfiguration = { steps: formSteps }; @@ -75,14 +76,14 @@ export class AddWidgetToProjectWizardComponent extends WizardComponent implement /** * {@inheritDoc} */ - protected closeWizard(): void { + protected override closeWizard(): void { this.redirectToDashboard(); } /** * {@inheritDoc} */ - protected saveWizard(formData: FormData): void { + protected override saveWizard(formGroup: UntypedFormGroup): void { this.httpProjectService.getById(this.dashboardToken).subscribe((project: Project) => { this.httpProjectWidgetsService.getAllByProjectToken(this.dashboardToken).subscribe((widgets: ProjectWidget[]) => { let row = 1; @@ -103,15 +104,15 @@ export class AddWidgetToProjectWizardComponent extends WizardComponent implement } const projectWidgetRequest: ProjectWidgetRequest = { - widgetId: formData[ProjectWidgetFormStepsService.selectWidgetStepKey][ProjectWidgetFormStepsService.widgetIdFieldKey], - backendConfig: Object.keys(formData[ProjectWidgetFormStepsService.configureWidgetStepKey]) + widgetId: formGroup.get(ProjectWidgetFormStepsService.selectWidgetStepKey).value[ProjectWidgetFormStepsService.widgetIdFieldKey], + backendConfig: Object.keys(formGroup.get(ProjectWidgetFormStepsService.configureWidgetStepKey).value) .filter( (key: string) => - formData[ProjectWidgetFormStepsService.configureWidgetStepKey][key] != null && - String(formData[ProjectWidgetFormStepsService.configureWidgetStepKey][key]).trim() !== '' + formGroup.get(ProjectWidgetFormStepsService.configureWidgetStepKey).value[key] != null && + String(formGroup.get(ProjectWidgetFormStepsService.configureWidgetStepKey).value[key]).trim() !== '' ) .map( - (key: string) => `${key}=${String(formData[ProjectWidgetFormStepsService.configureWidgetStepKey][key]).replace(/\n/g, '\\n')}` + (key: string) => `${key}=${String(formGroup.get(ProjectWidgetFormStepsService.configureWidgetStepKey).value[key]).replace(/\n/g, '\\n')}` ) .join('\n'), gridColumn: column, diff --git a/src/main/webapp/app/shared/components/communication-dialog/communication-dialog.component.scss b/src/main/webapp/app/shared/components/communication-dialog/communication-dialog.component.scss index 562d8b8db..2ec91047b 100644 --- a/src/main/webapp/app/shared/components/communication-dialog/communication-dialog.component.scss +++ b/src/main/webapp/app/shared/components/communication-dialog/communication-dialog.component.scss @@ -15,31 +15,25 @@ * * limitations under the License. * */ -@use '@angular/material' as mat; .communication-dialog-wrapper { height: 100%; display: flex; flex-direction: column; - .mat-dialog-content { + .mat-mdc-dialog-content { & { - width: 94%; background-color: #cfd2da42; - margin: auto; - padding: 19px 20px; + margin: auto 24px; + padding: 20px; } &.spacer { flex-grow: 1; } } -} -@mixin communication-dialog-component-theme($theme) { - $warn: map-get($theme, warn); - - .communication-dialog-wrapper .mat-dialog-content.communication-dialog-error { - color: mat.get-color-from-palette($warn, 500); + .mat-mdc-dialog-actions { + padding: 14px 24px; } -} +} \ No newline at end of file diff --git a/src/main/webapp/app/shared/components/form-sidenav/form-sidenav.component.html b/src/main/webapp/app/shared/components/form-sidenav/form-sidenav.component.html index 88ecaaec7..fc7a695bb 100644 --- a/src/main/webapp/app/shared/components/form-sidenav/form-sidenav.component.html +++ b/src/main/webapp/app/shared/components/form-sidenav/form-sidenav.component.html @@ -16,7 +16,7 @@

{{ configuration.title | translate | uppercase }}

diff --git a/src/main/webapp/app/shared/components/form-sidenav/form-sidenav.component.ts b/src/main/webapp/app/shared/components/form-sidenav/form-sidenav.component.ts index b599abaea..758c689ca 100644 --- a/src/main/webapp/app/shared/components/form-sidenav/form-sidenav.component.ts +++ b/src/main/webapp/app/shared/components/form-sidenav/form-sidenav.component.ts @@ -151,7 +151,7 @@ export class FormSidenavComponent implements OnInit, OnDestroy { this.formService.validate(this.formGroup); if (this.formGroup.valid) { - this.configuration.save(this.formGroup.value); + this.configuration.save(this.formGroup); this.closeSidenav(); } } diff --git a/src/main/webapp/app/shared/components/inputs/fields/fields.component.ts b/src/main/webapp/app/shared/components/inputs/fields/fields.component.ts index 16bcf2e10..6ff1780eb 100644 --- a/src/main/webapp/app/shared/components/inputs/fields/fields.component.ts +++ b/src/main/webapp/app/shared/components/inputs/fields/fields.component.ts @@ -47,7 +47,7 @@ export class FieldsComponent extends InputComponent implements OnInit{ /** * Called when the component is init */ - public ngOnInit(): void { + public override ngOnInit(): void { super.ngOnInit() if (this.field.deleteRow) { diff --git a/src/main/webapp/app/shared/components/inputs/file-input/file-input.component.html b/src/main/webapp/app/shared/components/inputs/file-input/file-input.component.html index 43f15314a..a63e1b4a0 100644 --- a/src/main/webapp/app/shared/components/inputs/file-input/file-input.component.html +++ b/src/main/webapp/app/shared/components/inputs/file-input/file-input.component.html @@ -15,7 +15,7 @@