diff --git a/apps/red-ui/src/app/components/base-screen/base-screen.component.html b/apps/red-ui/src/app/components/base-screen/base-screen.component.html index 20eb64e45..d26b35bc0 100644 --- a/apps/red-ui/src/app/components/base-screen/base-screen.component.html +++ b/apps/red-ui/src/app/components/base-screen/base-screen.component.html @@ -1,4 +1,4 @@ - +
@@ -21,11 +21,11 @@ - + +
{{ 'top-bar.navigation-items.back' | translate }} @@ -29,15 +29,17 @@ > - - {{ option.name$ | async }} - - + diff --git a/apps/red-ui/src/app/models/file/annotation-permissions.utils.ts b/apps/red-ui/src/app/models/file/annotation-permissions.utils.ts index ef53f5c51..9d466ccd1 100644 --- a/apps/red-ui/src/app/models/file/annotation-permissions.utils.ts +++ b/apps/red-ui/src/app/models/file/annotation-permissions.utils.ts @@ -25,9 +25,8 @@ export const canRemoveFromDictionary = (annotation: AnnotationWrapper) => !annotation.pending && !annotation.hasBeenResized; -export const canRemoveRedaction = (annotations: AnnotationWrapper[], permissions: AnnotationPermissions) => - annotations.length === 1 && - (permissions.canRemoveOnlyHere || permissions.canRemoveFromDictionary || permissions.canMarkAsFalsePositive); +export const canRemoveRedaction = (permissions: AnnotationPermissions) => + permissions.canRemoveOnlyHere || permissions.canRemoveFromDictionary || permissions.canMarkAsFalsePositive; export const canChangeLegalBasis = (annotation: AnnotationWrapper, canAddRedaction: boolean) => canAddRedaction && annotation.isRedacted && !annotation.pending; diff --git a/apps/red-ui/src/app/models/file/annotation.permissions.ts b/apps/red-ui/src/app/models/file/annotation.permissions.ts index 16eef7da4..aa287465d 100644 --- a/apps/red-ui/src/app/models/file/annotation.permissions.ts +++ b/apps/red-ui/src/app/models/file/annotation.permissions.ts @@ -29,6 +29,7 @@ export class AnnotationPermissions { canResizeAnnotation = true; canRecategorizeAnnotation = true; canForceHint = true; + canEditAnnotations = true; static forUser( isApprover: boolean, @@ -46,7 +47,6 @@ export class AnnotationPermissions { for (const annotation of annotations) { const permissions: AnnotationPermissions = new AnnotationPermissions(); const annotationEntity = entities.find(entity => entity.type === annotation.type); - permissions.canUndo = canUndo(annotation, isApprover); permissions.canForceHint = canForceHint(annotation, canAddRedaction); permissions.canForceRedaction = canForceRedaction(annotation, canAddRedaction); @@ -54,10 +54,11 @@ export class AnnotationPermissions { permissions.canMarkAsFalsePositive = canMarkAsFalsePositive(annotation, annotationEntity); permissions.canRemoveOnlyHere = canRemoveOnlyHere(annotation, canAddRedaction); permissions.canRemoveFromDictionary = canRemoveFromDictionary(annotation); - permissions.canRemoveRedaction = canRemoveRedaction(annotations, permissions); + permissions.canRemoveRedaction = canRemoveRedaction(permissions); permissions.canChangeLegalBasis = canChangeLegalBasis(annotation, canAddRedaction); permissions.canRecategorizeAnnotation = canRecategorizeAnnotation(annotation, canAddRedaction); permissions.canResizeAnnotation = canResizeAnnotation(annotation, canAddRedaction); + permissions.canEditAnnotations = annotation.isSkipped || annotation.isRedacted; summedPermissions._merge(permissions); } @@ -77,6 +78,7 @@ export class AnnotationPermissions { result.canRemoveOnlyHere = permissions.reduce((acc, next) => acc && next.canRemoveOnlyHere, true); result.canRemoveRedaction = permissions.reduce((acc, next) => acc && next.canRemoveRedaction, true); result.canUndo = permissions.reduce((acc, next) => acc && next.canUndo, true); + result.canEditAnnotations = permissions.reduce((acc, next) => acc && next.canEditAnnotations, true); return result; } diff --git a/apps/red-ui/src/app/models/file/annotation.wrapper.ts b/apps/red-ui/src/app/models/file/annotation.wrapper.ts index 1dce4e86a..91c88b5bc 100644 --- a/apps/red-ui/src/app/models/file/annotation.wrapper.ts +++ b/apps/red-ui/src/app/models/file/annotation.wrapper.ts @@ -302,6 +302,7 @@ export class AnnotationWrapper implements IListable { changeLogType: ChangeType, legalBasisList: ILegalBasis[], hintDictionary: boolean, + isDocumine: boolean, ) { const annotationWrapper = new AnnotationWrapper(); @@ -351,7 +352,7 @@ export class AnnotationWrapper implements IListable { c => c.manualRedactionType === ManualRedactionTypes.LEGAL_BASIS_CHANGE && c.annotationStatus === LogEntryStatuses.REQUESTED, )?.propertyChanges.legalBasis; - this.#createContent(annotationWrapper, redactionLogEntry); + this.#createContent(annotationWrapper, redactionLogEntry, isDocumine); this.#setSuperType(annotationWrapper, redactionLogEntry); this.#handleRecommendations(annotationWrapper, redactionLogEntry); annotationWrapper.typeLabel = this.#getTypeLabel(redactionLogEntry, annotationWrapper); @@ -421,20 +422,24 @@ export class AnnotationWrapper implements IListable { } } - static #createContent(annotationWrapper: AnnotationWrapper, entry: IRedactionLogEntry) { + static #createContent(annotationWrapper: AnnotationWrapper, entry: IRedactionLogEntry, isDocumine: boolean) { let content = ''; if (entry.matchedRule) { - content += `Rule ${entry.matchedRule} matched \n\n`; + content += `Rule ${entry.matchedRule} matched${isDocumine ? ':' : ''} \n\n`; } if (entry.reason) { + if (isDocumine && entry.reason.slice(-1) === '.') { + entry.reason = entry.reason.slice(0, -1); + } + content += entry.reason + '\n\n'; //remove leading and trailing commas and whitespaces content = content.replace(/(^[, ]*)|([, ]*$)/g, ''); content = content.substring(0, 1).toUpperCase() + content.substring(1); } - if (annotationWrapper.legalBasis) { + if (annotationWrapper.legalBasis && !isDocumine) { content += 'Legal basis: ' + annotationWrapper.legalBasis + '\n\n'; } @@ -443,7 +448,7 @@ export class AnnotationWrapper implements IListable { } if (entry.section) { - let prefix = 'In section: '; + let prefix = `In section${isDocumine ? '' : ':'} `; if (content.length) { prefix = ` ${prefix.toLowerCase()}`; } diff --git a/apps/red-ui/src/app/modules/account/account-side-nav/account-side-nav.component.html b/apps/red-ui/src/app/modules/account/account-side-nav/account-side-nav.component.html index b72fd75dd..1a97e0126 100644 --- a/apps/red-ui/src/app/modules/account/account-side-nav/account-side-nav.component.html +++ b/apps/red-ui/src/app/modules/account/account-side-nav/account-side-nav.component.html @@ -4,7 +4,7 @@ *ngIf="item.show" [routerLinkActiveOptions]="{ exact: false }" [routerLink]="'../' + item.screen" - [attr.help-mode-key]="'user_account'" + [attr.help-mode-key]="item.helpModeKey" class="item" routerLinkActive="active" > diff --git a/apps/red-ui/src/app/modules/account/account-side-nav/account-side-nav.component.ts b/apps/red-ui/src/app/modules/account/account-side-nav/account-side-nav.component.ts index c21b6346c..bebf6d1a1 100644 --- a/apps/red-ui/src/app/modules/account/account-side-nav/account-side-nav.component.ts +++ b/apps/red-ui/src/app/modules/account/account-side-nav/account-side-nav.component.ts @@ -9,6 +9,7 @@ interface NavItem { readonly label: string; readonly screen: string; readonly show?: boolean; + readonly helpModeKey?: string; } @Component({ @@ -24,21 +25,25 @@ export class AccountSideNavComponent { screen: 'user-profile', label: _('user-profile'), show: true, + helpModeKey: 'my_profile', }, { screen: 'notifications', show: this.currentUser.isUser && this._permissionsService.has(Roles.notifications.write), label: _('notifications.label'), + helpModeKey: 'notification_preferences', }, { screen: 'preferences', label: _('preferences-screen.label'), show: this.currentUser.isUser, + helpModeKey: 'user_preferences', }, { screen: 'warnings-preferences', label: _('preferences-screen.warnings-label'), show: this.currentUser.isUser, + helpModeKey: 'prompts_and_dialogs', }, ]; diff --git a/apps/red-ui/src/app/modules/account/screens/notifications/notifications-screen/notifications-screen.component.ts b/apps/red-ui/src/app/modules/account/screens/notifications/notifications-screen/notifications-screen.component.ts index a6a2b4fe5..1f80c321c 100644 --- a/apps/red-ui/src/app/modules/account/screens/notifications/notifications-screen/notifications-screen.component.ts +++ b/apps/red-ui/src/app/modules/account/screens/notifications/notifications-screen/notifications-screen.component.ts @@ -4,6 +4,7 @@ import { NotificationPreferencesService } from '../../../services/notification-p import { BaseFormComponent, getConfig, LoadingService, Toaster } from '@iqser/common-ui'; import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker'; import { + DocumentNotificationsTypes, NotificationCategoriesValues, NotificationGroupsKeys, NotificationGroupsValues, @@ -77,7 +78,8 @@ export class NotificationsScreenComponent extends BaseFormComponent implements O async save() { this.#loadingService.start(); try { - await firstValueFrom(this.#notificationPreferencesService.update(this.form.value)); + const preferences = this.#filterNotificationPreferences(); + await firstValueFrom(this.#notificationPreferencesService.update(preferences)); } catch (e) { this.#toaster.error(_('notifications-screen.error.generic')); } @@ -106,4 +108,27 @@ export class NotificationsScreenComponent extends BaseFormComponent implements O this.#loadingService.stop(); } + + #filterNotificationPreferences() { + if (!this.#config.IS_DOCUMINE) { + return this.form.value; + } + + if (!this.isPreferenceChecked('inAppNotifications', DocumentNotificationsTypes.assignApprover)) { + return { + ...this.form.value, + inAppNotifications: this.form + .get('inAppNotifications') + .value.filter((preference: string) => !RSS_EXCLUDED_SETTINGS.includes(preference)), + }; + } + if (!this.form.get('inAppNotifications').value.includes(DocumentNotificationsTypes.assignReviewer)) { + return { + ...this.form.value, + inAppNotifications: [...this.form.get('inAppNotifications').value, DocumentNotificationsTypes.assignReviewer], + }; + } + + return this.form.value; + } } diff --git a/apps/red-ui/src/app/modules/admin/admin-routing.module.ts b/apps/red-ui/src/app/modules/admin/admin-routing.module.ts index 0f8631355..a29289c29 100644 --- a/apps/red-ui/src/app/modules/admin/admin-routing.module.ts +++ b/apps/red-ui/src/app/modules/admin/admin-routing.module.ts @@ -61,6 +61,19 @@ const dossierTemplateIdRoutes: IqserRoutes = [ }, loadChildren: () => import('./screens/rules/rules.module').then(m => m.RulesModule), }, + { + path: 'component-rules', + component: BaseDossierTemplateScreenComponent, + canActivate: [CompositeRouteGuard, IqserPermissionsGuard], + data: { + routeGuards: [IqserAuthGuard, RedRoleGuard], + permissions: { + allow: [Roles.rules.read], + redirectTo: 'info', + }, + }, + loadChildren: () => import('./screens/component-rules/component-rules.module').then(m => m.ComponentRulesModule), + }, { path: 'file-attributes', component: BaseDossierTemplateScreenComponent, diff --git a/apps/red-ui/src/app/modules/admin/admin.module.ts b/apps/red-ui/src/app/modules/admin/admin.module.ts index fc8df4e81..495528870 100644 --- a/apps/red-ui/src/app/modules/admin/admin.module.ts +++ b/apps/red-ui/src/app/modules/admin/admin.module.ts @@ -57,6 +57,7 @@ import { DossierTemplateActionsComponent } from './shared/components/dossier-tem import { IqserUsersModule } from '@iqser/common-ui/lib/users'; import { TenantPipe } from '@iqser/common-ui/lib/tenants'; import { SelectComponent } from '@shared/components/select/select.component'; +import { ComponentRulesService } from './services/component-rules.service'; const dialogs = [ AddEditCloneDossierTemplateDialogComponent, @@ -97,7 +98,7 @@ const components = [ @NgModule({ declarations: [...components], - providers: [AdminDialogService, AuditService, DigitalSignatureService, RulesService, SmtpConfigService], + providers: [AdminDialogService, AuditService, DigitalSignatureService, RulesService, ComponentRulesService, SmtpConfigService], imports: [ CommonModule, SharedModule, diff --git a/apps/red-ui/src/app/modules/admin/screens/component-rules/component-rules.module.ts b/apps/red-ui/src/app/modules/admin/screens/component-rules/component-rules.module.ts new file mode 100644 index 000000000..14c171ff2 --- /dev/null +++ b/apps/red-ui/src/app/modules/admin/screens/component-rules/component-rules.module.ts @@ -0,0 +1,26 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { RouterModule } from '@angular/router'; +import { ComponentRulesScreenComponent } from './rules-screen/component-rules-screen.component'; +import { MonacoEditorModule } from '@materia-ui/ngx-monaco-editor'; +import { PendingChangesGuard } from '@guards/can-deactivate.guard'; +import { TranslateModule } from '@ngx-translate/core'; +import { IconButtonComponent } from '@iqser/common-ui'; +import { FormsModule } from '@angular/forms'; +import { MatIconModule } from '@angular/material/icon'; + +const routes = [{ path: '', component: ComponentRulesScreenComponent, canDeactivate: [PendingChangesGuard] }]; + +@NgModule({ + declarations: [ComponentRulesScreenComponent], + imports: [ + RouterModule.forChild(routes), + CommonModule, + MonacoEditorModule, + TranslateModule, + IconButtonComponent, + FormsModule, + MatIconModule, + ], +}) +export class ComponentRulesModule {} diff --git a/apps/red-ui/src/app/modules/admin/screens/component-rules/rules-screen/component-rules-screen.component.html b/apps/red-ui/src/app/modules/admin/screens/component-rules/rules-screen/component-rules-screen.component.html new file mode 100644 index 000000000..13c6432f7 --- /dev/null +++ b/apps/red-ui/src/app/modules/admin/screens/component-rules/rules-screen/component-rules-screen.component.html @@ -0,0 +1,26 @@ +
+
+
+
+ + + +
+
+ + + + + +
+
+ + +
+
+
diff --git a/apps/red-ui/src/app/modules/admin/screens/component-rules/rules-screen/component-rules-screen.component.scss b/apps/red-ui/src/app/modules/admin/screens/component-rules/rules-screen/component-rules-screen.component.scss new file mode 100644 index 000000000..0d44f017a --- /dev/null +++ b/apps/red-ui/src/app/modules/admin/screens/component-rules/rules-screen/component-rules-screen.component.scss @@ -0,0 +1,67 @@ +:host { + flex-grow: 1; + overflow: hidden; + padding: 15px 0 0 15px; +} + +ngx-monaco-editor { + height: 100%; + width: 100%; +} + +.header-container { + display: flex; + align-items: center; + padding-bottom: 15px; + margin-left: 30px; + + .error { + color: red; + font-size: 8px; + font-weight: 500; + margin-left: 20px; + font-style: italic; + } +} + +.changes-box { + flex-direction: column; + justify-content: center; + align-items: start; + gap: 10px; + + > div { + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + width: 100%; + } + + .errors { + cursor: pointer; + + .icon { + scale: 0.7; + } + + :first-child { + display: flex; + align-items: center; + gap: 0.5em; + font-weight: 500; + /* TODO: Update this to --iqser-error when added */ + color: #dd4d50; + } + + .face-up { + transform: rotate(90deg); + } + + margin-right: 0; + } + + .actions { + gap: 24px; + } +} diff --git a/apps/red-ui/src/app/modules/admin/screens/component-rules/rules-screen/component-rules-screen.component.ts b/apps/red-ui/src/app/modules/admin/screens/component-rules/rules-screen/component-rules-screen.component.ts new file mode 100644 index 000000000..c17ee1beb --- /dev/null +++ b/apps/red-ui/src/app/modules/admin/screens/component-rules/rules-screen/component-rules-screen.component.ts @@ -0,0 +1,216 @@ +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, computed, ElementRef, OnInit, signal, ViewChild } from '@angular/core'; +import { PermissionsService } from '@services/permissions.service'; +import { IconButtonTypes, LoadingService, Toaster } from '@iqser/common-ui'; +import { saveAs } from 'file-saver'; +import { marker as _ } from '@biesbjerg/ngx-translate-extract-marker'; +import { firstValueFrom } from 'rxjs'; +import { DOSSIER_TEMPLATE_ID } from '@red/domain'; +import { EditorThemeService } from '@services/editor-theme.service'; +import { ComponentCanDeactivate } from '@guards/can-deactivate.guard'; +import { Debounce, getParam } from '@iqser/common-ui/lib/utils'; +import { ComponentRulesService } from '../../../services/component-rules.service'; +import ICodeEditor = monaco.editor.ICodeEditor; +import IModelDeltaDecoration = monaco.editor.IModelDeltaDecoration; +import IStandaloneEditorConstructionOptions = monaco.editor.IStandaloneEditorConstructionOptions; + +interface SyntaxError { + line: number; + column: number; + message: string; +} + +@Component({ + templateUrl: './component-rules-screen.component.html', + styleUrls: ['./component-rules-screen.component.scss'], + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class ComponentRulesScreenComponent implements OnInit, ComponentCanDeactivate { + readonly iconButtonTypes = IconButtonTypes; + readonly editorOptions: IStandaloneEditorConstructionOptions = { + theme: 'vs', + language: 'java', + automaticLayout: true, + readOnly: !this.permissionsService.canEditRules(), + glyphMargin: true, + }; + initialLines: string[] = []; + currentLines: string[] = []; + isLeaving = false; + @ViewChild('fileInput') + private _fileInput: ElementRef; + private _codeEditor: ICodeEditor; + private _decorations: string[] = []; + readonly #errorGlyphs = signal([]); + readonly numberOfErrors = computed(() => this.#errorGlyphs().length); + readonly #dossierTemplateId = getParam(DOSSIER_TEMPLATE_ID); + + constructor( + readonly permissionsService: PermissionsService, + private readonly _componentRulesService: ComponentRulesService, + private readonly _changeDetectorRef: ChangeDetectorRef, + private readonly _toaster: Toaster, + private readonly _loadingService: LoadingService, + private readonly _editorThemeService: EditorThemeService, + ) {} + + set isLeavingPage(isLeaving: boolean) { + this.isLeaving = isLeaving; + this._changeDetectorRef.detectChanges(); + } + + get changed(): boolean { + return this.currentLines.toString() !== this.initialLines.toString(); + } + + get codeEditorText() { + return this.currentLines.join('\n'); + } + + set codeEditorText($event: any) { + this.currentLines = $event.split('\n'); + this.codeEditorTextChanged(); + this._closeProblemsView(); + } + + async ngOnInit() { + await this._initialize(); + } + + onCodeEditorInit(editor: ICodeEditor) { + this._codeEditor = editor; + for (const theme of this._editorThemeService.themes) { + (window as any).monaco.editor.defineTheme(theme, this._editorThemeService.configurations[theme]); + } + (window as any).monaco.editor.setTheme(this._editorThemeService.getTheme(true)); + this._changeDetectorRef.detectChanges(); + } + + @Debounce() + codeEditorTextChanged() { + const newDecorations = this.currentLines.filter(entry => this._isNew(entry)).map(entry => this._makeDecorationFor(entry)); + this._decorations = this._codeEditor.deltaDecorations(this._decorations, newDecorations); + } + + goToErrors() { + this._codeEditor.trigger(null, 'editor.action.marker.next', null); + } + + async save(): Promise { + this._loadingService.start(); + this._removeErrorMarkers(); + await firstValueFrom( + this._componentRulesService.uploadRules({ + rules: this._codeEditor.getModel().getValue(), + dossierTemplateId: this.#dossierTemplateId, + }), + ).then( + async () => { + await this._initialize(); + this._toaster.success(_('component-rules-screen.success.generic')); + }, + error => { + const errors = error.error as SyntaxError[] | undefined; + this._drawErrorMarkers(errors); + this._loadingService.stop(); + this._toaster.error(_('component-rules-screen.error.generic')); + }, + ); + } + + revert(): void { + this.currentLines = this.initialLines; + this._decorations = this._codeEditor?.deltaDecorations(this._decorations, []) || []; + this._removeErrorMarkers(); + this._changeDetectorRef.detectChanges(); + this._loadingService.stop(); + } + + download(): void { + const content = this._codeEditor.getModel().getValue(); + const blob = new Blob([content], { + type: 'text/plain;charset=utf-8', + }); + saveAs(blob, 'rules.txt'); + } + + upload($event): void { + const file: File = $event.target.files[0]; + const fileReader = new FileReader(); + + if (file) { + fileReader.onload = () => { + this._codeEditor.getModel().setValue(fileReader.result as string); + this._fileInput.nativeElement.value = null; + }; + fileReader.readAsText(file); + } + } + + private _isNew(entry: string): boolean { + return this.initialLines.indexOf(entry) < 0 && entry?.trim().length > 0; + } + + private _makeDecorationFor(entry: string): IModelDeltaDecoration { + const line = this.currentLines.indexOf(entry) + 1; + + return { + range: new monaco.Range(line, 1, line, 1), + options: { isWholeLine: true, className: 'changed-row-marker' }, + } as IModelDeltaDecoration; + } + + private _drawErrorMarkers(errors: SyntaxError[] | undefined) { + const model = this._codeEditor?.getModel(); + if (!model || !errors?.length) { + return; + } + const markers = []; + const glyphs = []; + errors + .filter(e => e.line > 0) + .forEach(e => { + const endColumn = model.getLineLength(e.line) + 1; + markers.push({ + message: e.message, + severity: monaco.MarkerSeverity.Error, + startLineNumber: e.line, + startColumn: e.column, + endLineNumber: e.line, + endColumn, + }); + glyphs.push({ + range: new monaco.Range(e.line, e.column, e.line, endColumn), + options: { + glyphMarginClassName: 'error-glyph-margin', + }, + }); + }); + this.#errorGlyphs.set(this._codeEditor.deltaDecorations(this.#errorGlyphs(), glyphs)); + (window as any).monaco.editor.setModelMarkers(model, model.id, markers); + } + + private _closeProblemsView() { + this._codeEditor.trigger(null, 'closeMarkersNavigation', null); + } + + private _removeErrorMarkers() { + const model = this._codeEditor?.getModel(); + if (!model) { + return; + } + (window as any).monaco.editor.setModelMarkers(model, model.id, []); + this.#errorGlyphs.set(this._codeEditor.deltaDecorations(this.#errorGlyphs(), []) || []); + this._closeProblemsView(); + } + + private async _initialize() { + this._loadingService.start(); + await firstValueFrom(this._componentRulesService.download(this.#dossierTemplateId)).then( + rules => { + this.currentLines = this.initialLines = rules.rules.split('\n'); + this.revert(); + }, + () => this._loadingService.stop(), + ); + } +} diff --git a/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.html b/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.html index 80bb36faf..88a74ec4e 100644 --- a/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.html +++ b/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.html @@ -6,12 +6,21 @@
- +
+ + + + + +
+
+ -
+
+
diff --git a/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.scss b/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.scss index 02e4143ba..0d44f017a 100644 --- a/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.scss +++ b/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.scss @@ -23,3 +23,45 @@ ngx-monaco-editor { font-style: italic; } } + +.changes-box { + flex-direction: column; + justify-content: center; + align-items: start; + gap: 10px; + + > div { + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + width: 100%; + } + + .errors { + cursor: pointer; + + .icon { + scale: 0.7; + } + + :first-child { + display: flex; + align-items: center; + gap: 0.5em; + font-weight: 500; + /* TODO: Update this to --iqser-error when added */ + color: #dd4d50; + } + + .face-up { + transform: rotate(90deg); + } + + margin-right: 0; + } + + .actions { + gap: 24px; + } +} diff --git a/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.ts b/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.ts index a3020e91b..2635ec949 100644 --- a/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.ts +++ b/apps/red-ui/src/app/modules/admin/screens/rules/rules-screen/rules-screen.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, OnInit, ViewChild } from '@angular/core'; +import { ChangeDetectionStrategy, ChangeDetectorRef, Component, computed, ElementRef, OnInit, signal, ViewChild } from '@angular/core'; import { PermissionsService } from '@services/permissions.service'; import { IconButtonTypes, LoadingService, Toaster } from '@iqser/common-ui'; import { saveAs } from 'file-saver'; @@ -40,7 +40,8 @@ export class RulesScreenComponent implements OnInit, ComponentCanDeactivate { private _fileInput: ElementRef; private _codeEditor: ICodeEditor; private _decorations: string[] = []; - private _errorGlyphs: string[] = []; + readonly #errorGlyphs = signal([]); + readonly numberOfErrors = computed(() => this.#errorGlyphs().length); readonly #dossierTemplateId = getParam(DOSSIER_TEMPLATE_ID); constructor( @@ -68,6 +69,7 @@ export class RulesScreenComponent implements OnInit, ComponentCanDeactivate { set codeEditorText($event: any) { this.currentLines = $event.split('\n'); this.codeEditorTextChanged(); + this._closeProblemsView(); } async ngOnInit() { @@ -86,12 +88,16 @@ export class RulesScreenComponent implements OnInit, ComponentCanDeactivate { @Debounce() codeEditorTextChanged() { const newDecorations = this.currentLines.filter(entry => this._isNew(entry)).map(entry => this._makeDecorationFor(entry)); - this._decorations = this._codeEditor.deltaDecorations(this._decorations, newDecorations); } + goToErrors() { + this._codeEditor.trigger(null, 'editor.action.marker.next', null); + } + async save(): Promise { this._loadingService.start(); + this._removeErrorMarkers(); await firstValueFrom( this._rulesService.uploadRules({ rules: this._codeEditor.getModel().getValue(), @@ -100,7 +106,6 @@ export class RulesScreenComponent implements OnInit, ComponentCanDeactivate { ).then( async () => { await this._initialize(); - this._removeErrorMarkers(); this._toaster.success(_('rules-screen.success.generic')); }, error => { @@ -180,17 +185,22 @@ export class RulesScreenComponent implements OnInit, ComponentCanDeactivate { }, }); }); - this._errorGlyphs = this._codeEditor.deltaDecorations(this._errorGlyphs, glyphs); + this.#errorGlyphs.set(this._codeEditor.deltaDecorations(this.#errorGlyphs(), glyphs)); (window as any).monaco.editor.setModelMarkers(model, model.id, markers); } + private _closeProblemsView() { + this._codeEditor.trigger(null, 'closeMarkersNavigation', null); + } + private _removeErrorMarkers() { const model = this._codeEditor?.getModel(); if (!model) { return; } (window as any).monaco.editor.setModelMarkers(model, model.id, []); - this._errorGlyphs = this._codeEditor?.deltaDecorations(this._errorGlyphs, []) || []; + this.#errorGlyphs.set(this._codeEditor.deltaDecorations(this.#errorGlyphs(), []) || []); + this._closeProblemsView(); } private async _initialize() { diff --git a/apps/red-ui/src/app/modules/admin/screens/rules/rules.module.ts b/apps/red-ui/src/app/modules/admin/screens/rules/rules.module.ts index bd26cc278..e6b248714 100644 --- a/apps/red-ui/src/app/modules/admin/screens/rules/rules.module.ts +++ b/apps/red-ui/src/app/modules/admin/screens/rules/rules.module.ts @@ -7,11 +7,20 @@ import { PendingChangesGuard } from '@guards/can-deactivate.guard'; import { TranslateModule } from '@ngx-translate/core'; import { IconButtonComponent } from '@iqser/common-ui'; import { FormsModule } from '@angular/forms'; +import { MatIconModule } from '@angular/material/icon'; const routes = [{ path: '', component: RulesScreenComponent, canDeactivate: [PendingChangesGuard] }]; @NgModule({ declarations: [RulesScreenComponent], - imports: [RouterModule.forChild(routes), CommonModule, MonacoEditorModule, TranslateModule, IconButtonComponent, FormsModule], + imports: [ + RouterModule.forChild(routes), + CommonModule, + MonacoEditorModule, + TranslateModule, + IconButtonComponent, + FormsModule, + MatIconModule, + ], }) export class RulesModule {} diff --git a/apps/red-ui/src/app/modules/admin/services/component-rules.service.ts b/apps/red-ui/src/app/modules/admin/services/component-rules.service.ts new file mode 100644 index 000000000..74b4ffa61 --- /dev/null +++ b/apps/red-ui/src/app/modules/admin/services/component-rules.service.ts @@ -0,0 +1,16 @@ +import { Injectable } from '@angular/core'; +import { GenericService } from '@iqser/common-ui'; +import { IComponentRules } from '@red/domain'; + +@Injectable() +export class ComponentRulesService extends GenericService { + protected readonly _defaultModelPath = 'rules'; + + download(dossierTemplateId: string) { + return this._getOne([dossierTemplateId]); + } + + uploadRules(body: IComponentRules) { + return this._post(body); + } +} diff --git a/apps/red-ui/src/app/modules/admin/shared/components/admin-side-nav/admin-side-nav.component.ts b/apps/red-ui/src/app/modules/admin/shared/components/admin-side-nav/admin-side-nav.component.ts index e313824b6..71888466f 100644 --- a/apps/red-ui/src/app/modules/admin/shared/components/admin-side-nav/admin-side-nav.component.ts +++ b/apps/red-ui/src/app/modules/admin/shared/components/admin-side-nav/admin-side-nav.component.ts @@ -33,10 +33,9 @@ export class AdminSideNavComponent implements OnInit { readonly translations = adminSideNavTranslations; readonly currentUser = getCurrentUser(); readonly roles = Roles; + prefix: string; readonly isDocumine = this.#config.IS_DOCUMINE; readonly canAccessRulesInDocumine = this.isDocumine && !this.#config.RULE_EDITOR_DEV_ONLY; - prefix: string; - readonly items: { readonly [key in AdminSideNavType]: NavItem[] } = { settings: [ { @@ -86,13 +85,13 @@ export class AdminSideNavComponent implements OnInit { { screen: 'info', label: _('admin-side-nav.dossier-template-info'), - helpModeKey: 'dossier_templates_info', + helpModeKey: this.currentUser.isAdmin ? 'dossier_templates_info' : 'user_dossier_template_info', show: true, }, { screen: 'entities', label: _('admin-side-nav.entities'), - helpModeKey: 'entities', + helpModeKey: this.currentUser.isAdmin ? 'entities' : 'user_dossier_template_entities', show: true, }, { @@ -100,6 +99,14 @@ export class AdminSideNavComponent implements OnInit { label: _('admin-side-nav.rule-editor'), show: (this.isIqserDevMode || this.canAccessRulesInDocumine) && this._permissionsService.has(Roles.rules.read), }, + { + screen: 'component-rules', + label: _('admin-side-nav.component-rule-editor'), + show: + this.isDocumine && + (this.isIqserDevMode || this.canAccessRulesInDocumine) && + this._permissionsService.has(Roles.rules.read), + }, { screen: 'default-colors', label: _('admin-side-nav.default-colors'), @@ -127,14 +134,14 @@ export class AdminSideNavComponent implements OnInit { { screen: 'dossier-states', label: _('admin-side-nav.dossier-states'), - helpModeKey: 'dossier_states', + helpModeKey: this.currentUser.isAdmin ? 'dossier_states' : 'user_dossier_template_dossier_states', show: true, }, { screen: 'reports', label: _('admin-side-nav.reports'), show: this._permissionsService.has([Roles.reportTemplates.read]), - helpModeKey: 'reports', + helpModeKey: this.currentUser.isAdmin ? 'admin_reports' : 'user_dossier_template_reports', }, { screen: 'justifications', @@ -170,7 +177,10 @@ export class AdminSideNavComponent implements OnInit { ], }; - constructor(private readonly _permissionsService: IqserPermissionsService, private readonly _route: ActivatedRoute) {} + constructor( + private readonly _permissionsService: IqserPermissionsService, + private readonly _route: ActivatedRoute, + ) {} @HostBinding('class.smaller') get isSmaller(): boolean { return [AdminSideNavTypes.dossierTemplates, AdminSideNavTypes.entities].includes(this.type); diff --git a/apps/red-ui/src/app/modules/archive/services/config.service.ts b/apps/red-ui/src/app/modules/archive/services/config.service.ts index 5655dbf0c..d1472e149 100644 --- a/apps/red-ui/src/app/modules/archive/services/config.service.ts +++ b/apps/red-ui/src/app/modules/archive/services/config.service.ts @@ -106,14 +106,14 @@ export class ConfigService { label: this._translateService.instant('dossier-listing.quick-filters.owner'), checker: dossierOwnerQuickChecker(userId), disabled: entities.filter(dossierOwnerQuickChecker(userId)).length === 0, - helpModeKey: 'filter_dossier_list', + helpModeKey: 'quick_filter_dossiers', }, { id: 'member', label: this._translateService.instant('dossier-listing.quick-filters.member'), checker: dossierMemberQuickChecker(userId), disabled: entities.filter(dossierMemberQuickChecker(userId)).length === 0, - helpModeKey: 'filter_dossier_list', + helpModeKey: 'quick_filter_dossiers', }, ].map(filter => new NestedFilter(filter)); } diff --git a/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.html b/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.html index ea1fd5a08..7c479b1dc 100644 --- a/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.html +++ b/apps/red-ui/src/app/modules/dashboard/components/template-stats/template-stats.component.html @@ -2,7 +2,7 @@ *ngIf="stats as dossierTemplate" [class.empty]="dossierTemplate.isEmpty" [routerLink]="dossierTemplate.isEmpty ? null : ['..', dossierTemplate.dossierTemplateId]" - [attr.help-mode-key]="!dossierTemplate.isEmpty ? 'dossier_overview' : null" + [attr.help-mode-key]="!dossierTemplate.isEmpty ? 'open_dossier_template' : null" class="dialog" > @@ -13,7 +13,7 @@
@@ -21,20 +21,18 @@
- +
@@ -44,7 +42,7 @@ [config]="translateChartService.translateDossierStates(dossierTemplate.dossiersChartConfig, dossierTemplate.id)" [radius]="63" [strokeWidth]="15" - [subtitles]="['dossier-template-stats.active-dossiers' | translate : { count: dossierTemplate.numberOfActiveDossiers }]" + [subtitles]="['dossier-template-stats.active-dossiers' | translate: { count: dossierTemplate.numberOfActiveDossiers }]" direction="row" totalType="sum" > @@ -76,7 +74,7 @@ *ngIf="permissionsService.canCreateDossier(dossierTemplate)" [label]="'dashboard.empty-template.new-dossier' | translate" [type]="iconButtonTypes.primary" - [attr.help-mode-key]="'new_dossier_button'" + [attr.help-mode-key]="'new_dossier'" icon="iqser:plus" > diff --git a/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html b/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html index 9db020284..1a46d08ff 100644 --- a/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html +++ b/apps/red-ui/src/app/modules/dossier-overview/components/screen-header/dossier-overview-screen-header.component.html @@ -7,7 +7,7 @@ > this.#openEditDossierDialog(dossierId), icon: 'iqser:edit', hide: !this.#currentUser.isManager && !this._iqserPermissionsService.has(Roles.dossiers.edit), - helpModeKey: 'edit_dossier_in_dossier', + helpModeKey: 'edit_dossier', disabled$, }, ]; @@ -446,28 +446,28 @@ export class ConfigService { required: true, checker: this._recentlyModifiedChecker, disabled: entities.filter(this._recentlyModifiedChecker).length === 0, - helpModeKey: 'filter_document_list', + helpModeKey: 'quick_filters_documents', }, { id: 'assigned-to-me', label: this._translateService.instant('dossier-overview.quick-filters.assigned-to-me'), checker: this._assignedToMeChecker, disabled: entities.filter(this._assignedToMeChecker).length === 0, - helpModeKey: 'filter_document_list', + helpModeKey: 'quick_filters_documents', }, { id: 'unassigned', label: this._translateService.instant('dossier-overview.quick-filters.unassigned'), checker: this._unassignedChecker, disabled: entities.filter(this._unassignedChecker).length === 0, - helpModeKey: 'filter_document_list', + helpModeKey: 'quick_filters_documents', }, { id: 'assigned-to-others', label: this._translateService.instant('dossier-overview.quick-filters.assigned-to-others'), checker: this._assignedToOthersChecker, disabled: entities.filter(this._assignedToOthersChecker).length === 0, - helpModeKey: 'filter_document_list', + helpModeKey: 'quick_filters_documents', }, ].map(filter => new NestedFilter(filter)); } diff --git a/apps/red-ui/src/app/modules/dossier-overview/screen/dossier-overview-screen.component.html b/apps/red-ui/src/app/modules/dossier-overview/screen/dossier-overview-screen.component.html index 5f60630ae..774daaa1e 100644 --- a/apps/red-ui/src/app/modules/dossier-overview/screen/dossier-overview-screen.component.html +++ b/apps/red-ui/src/app/modules/dossier-overview/screen/dossier-overview-screen.component.html @@ -41,6 +41,7 @@ [noDataIcon]="'iqser:document'" [noDataText]="'dossier-overview.no-data.title' | translate" [showNoDataButton]="true" + [id]="'workflow-view'" addElementColumn="NEW" > diff --git a/apps/red-ui/src/app/modules/dossiers-listing/config.service.ts b/apps/red-ui/src/app/modules/dossiers-listing/config.service.ts index 5245afec3..5f6490ad0 100644 --- a/apps/red-ui/src/app/modules/dossiers-listing/config.service.ts +++ b/apps/red-ui/src/app/modules/dossiers-listing/config.service.ts @@ -69,7 +69,7 @@ export class ConfigService { hide: !this._permissionsService.canCreateDossier(dossierTemplate), icon: 'iqser:plus', type: 'primary', - helpModeKey: 'new_dossier_button', + helpModeKey: 'new_dossier', }, ]; } @@ -226,14 +226,14 @@ export class ConfigService { label: this._translateService.instant('dossier-listing.quick-filters.owner'), checker: dossierOwnerQuickChecker(userId), disabled: entities.filter(dossierOwnerQuickChecker(userId)).length === 0, - helpModeKey: 'filter_dossier_list', + helpModeKey: 'quick_filter_dossiers', }, { id: 'member', label: this._translateService.instant('dossier-listing.quick-filters.member'), checker: dossierMemberQuickChecker(userId), disabled: entities.filter(dossierMemberQuickChecker(userId)).length === 0, - helpModeKey: 'filter_dossier_list', + helpModeKey: 'quick_filter_dossiers', }, ].map(filter => new NestedFilter(filter)); } diff --git a/apps/red-ui/src/app/modules/file-preview/components/annotation-actions/annotation-actions.component.html b/apps/red-ui/src/app/modules/file-preview/components/annotation-actions/annotation-actions.component.html index eae5e9d7d..23d3978c5 100644 --- a/apps/red-ui/src/app/modules/file-preview/components/annotation-actions/annotation-actions.component.html +++ b/apps/red-ui/src/app/modules/file-preview/components/annotation-actions/annotation-actions.component.html @@ -30,20 +30,17 @@ [tooltipPosition]="tooltipPosition" [tooltip]="'annotation-actions.resize.label' | translate" [type]="buttonType" + [attr.help-mode-key]="helpModeKey('resize')" icon="red:resize" > @@ -139,10 +136,11 @@ diff --git a/apps/red-ui/src/app/modules/file-preview/components/annotation-actions/annotation-actions.component.ts b/apps/red-ui/src/app/modules/file-preview/components/annotation-actions/annotation-actions.component.ts index b368cea86..b9a28495d 100644 --- a/apps/red-ui/src/app/modules/file-preview/components/annotation-actions/annotation-actions.component.ts +++ b/apps/red-ui/src/app/modules/file-preview/components/annotation-actions/annotation-actions.component.ts @@ -1,5 +1,5 @@ import { Component, computed, Input, OnChanges } from '@angular/core'; -import { HelpModeService, IqserPermissionsService } from '@iqser/common-ui'; +import { getConfig, HelpModeService, IqserPermissionsService } from '@iqser/common-ui'; import { AnnotationPermissions } from '@models/file/annotation.permissions'; import { AnnotationWrapper } from '@models/file/annotation.wrapper'; import { PermissionsService } from '@services/permissions.service'; @@ -24,8 +24,6 @@ export type AnnotationButtonType = keyof typeof AnnotationButtonTypes; styleUrls: ['./annotation-actions.component.scss'], }) export class AnnotationActionsComponent implements OnChanges { - #annotations: AnnotationWrapper[] = []; - protected _annotationId = ''; @Input() buttonType: AnnotationButtonType = AnnotationButtonTypes.default; @Input() tooltipPosition: 'before' | 'above' = 'before'; @Input() canPerformAnnotationActions: boolean; @@ -33,10 +31,45 @@ export class AnnotationActionsComponent implements OnChanges { readonly roles = Roles; annotationPermissions: AnnotationPermissions; isImage = true; + protected _annotationId = ''; + #annotations: AnnotationWrapper[] = []; readonly isVisible = computed(() => { const hidden = this._annotationManager.hidden(); return this.#annotations.reduce((acc, annotation) => !hidden.has(annotation.id) && acc, true); }); + readonly #isDocumine = getConfig().IS_DOCUMINE; + + get annotations(): AnnotationWrapper[] { + return this.#annotations; + } + + @Input() + set annotations(annotations: AnnotationWrapper[]) { + this.#annotations = annotations.filter(a => a !== undefined); + this.isImage = this.#annotations?.reduce((accumulator, annotation) => annotation.isImage && accumulator, true); + this._annotationId = this.#annotations[0]?.id; + } + + get canEdit(): boolean { + const documineCanEditRedactions = + this.annotationPermissions.canChangeLegalBasis || + this.annotationPermissions.canRecategorizeAnnotation || + this.annotationPermissions.canForceHint || + this.annotationPermissions.canForceRedaction; + return this.#isDocumine && this.annotations.length > 1 ? this.annotationPermissions.canEditAnnotations : documineCanEditRedactions; + } + + get canRemoveRedaction(): boolean { + return (this.#isDocumine || this.annotations.length === 1) && this.annotationPermissions.canRemoveRedaction; + } + + get viewerAnnotations() { + return this._annotationManager.get(this.#annotations); + } + + get resizing() { + return this.#annotations?.length === 1 && this.#annotations?.[0].id === this._annotationManager.resizingAnnotationId; + } constructor( readonly viewModeService: ViewModeService, @@ -50,31 +83,12 @@ export class AnnotationActionsComponent implements OnChanges { readonly annotationReferencesService: AnnotationReferencesService, ) {} - get annotations(): AnnotationWrapper[] { - return this.#annotations; - } - - @Input() - set annotations(annotations: AnnotationWrapper[]) { - this.#annotations = annotations.filter(a => a !== undefined); - this.isImage = this.#annotations?.reduce((accumulator, annotation) => annotation.isImage && accumulator, true); - this._annotationId = this.#annotations[0]?.id; - } - - get viewerAnnotations() { - return this._annotationManager.get(this.#annotations); - } - - get resizing() { - return this.#annotations?.length === 1 && this.#annotations?.[0].id === this._annotationManager.resizingAnnotationId; - } - ngOnChanges(): void { this.#setPermissions(); } removeOrSuggestRemoveRedaction() { - this.annotationActionsService.removeRedaction(this.annotations[0], this.annotationPermissions); + this.annotationActionsService.removeRedaction(this.annotations, this.annotationPermissions); } acceptRecommendation() { @@ -113,4 +127,8 @@ export class AnnotationActionsComponent implements OnChanges { this._iqserPermissionsService, ); } + + helpModeKey(action: string) { + return this.#isDocumine ? `${action}_annotation` : ''; + } } diff --git a/apps/red-ui/src/app/modules/file-preview/components/annotation-wrapper/annotation-wrapper.component.ts b/apps/red-ui/src/app/modules/file-preview/components/annotation-wrapper/annotation-wrapper.component.ts index a8046088a..5ec1cb170 100644 --- a/apps/red-ui/src/app/modules/file-preview/components/annotation-wrapper/annotation-wrapper.component.ts +++ b/apps/red-ui/src/app/modules/file-preview/components/annotation-wrapper/annotation-wrapper.component.ts @@ -4,6 +4,7 @@ import { PdfProxyService } from '../../services/pdf-proxy.service'; import { ActionsHelpModeKeys } from '../../utils/constants'; import { ListItem } from '@models/file/list-item'; import { MultiSelectService } from '../../services/multi-select.service'; +import { getConfig } from '@iqser/common-ui'; @Component({ selector: 'redaction-annotation-wrapper', @@ -16,6 +17,7 @@ export class AnnotationWrapperComponent implements OnChanges { @HostBinding('attr.annotation-id') annotationId: string; @HostBinding('class.active') active = false; actionsHelpModeKey?: string; + readonly #isDocumine = getConfig().IS_DOCUMINE; protected readonly _pdfProxyService = inject(PdfProxyService); protected readonly _multiSelectService = inject(MultiSelectService); @@ -26,11 +28,14 @@ export class AnnotationWrapperComponent implements OnChanges { } #getActionsHelpModeKey(): string { - const type = this.annotation.item.typeLabel?.split('.')[1]; - const typeValue = this.annotation.item.typeValue; - if (type === 'hint' && (typeValue === 'ocr' || typeValue === 'formula' || typeValue === 'image')) { - return ActionsHelpModeKeys[`${type}-${typeValue}`]; + if (!this.#isDocumine) { + const type = this.annotation.item.typeLabel?.split('.')[1]; + const typeValue = this.annotation.item.typeValue; + if (type === 'hint' && (typeValue === 'ocr' || typeValue === 'formula' || typeValue === 'image')) { + return ActionsHelpModeKeys[`${type}-${typeValue}`]; + } + return ActionsHelpModeKeys[type]; } - return ActionsHelpModeKeys[type]; + return ''; } } diff --git a/apps/red-ui/src/app/modules/file-preview/components/file-workload/file-workload.component.html b/apps/red-ui/src/app/modules/file-preview/components/file-workload/file-workload.component.html index 4b6a9beba..ab5ab8c6b 100644 --- a/apps/red-ui/src/app/modules/file-preview/components/file-workload/file-workload.component.html +++ b/apps/red-ui/src/app/modules/file-preview/components/file-workload/file-workload.component.html @@ -20,7 +20,7 @@
@@ -28,7 +28,7 @@ +
-
- - {{ redactedText }} +
+ + +
    +
  • {{ text }}
    • +
+
- - + {{ displayedDictionaryLabel }}