From 109fd7d11ebdbd7a5424665b0028a9d64220314f Mon Sep 17 00:00:00 2001 From: shamoon <4887959+shamoon@users.noreply.github.com> Date: Tue, 1 Oct 2024 20:36:15 -0700 Subject: [PATCH] Update frontend hint, use textarea for multiline --- src-ui/messages.xlf | 6 +++- src-ui/src/app/app.module.ts | 2 ++ .../storage-path-edit-dialog.component.html | 2 +- .../storage-path-edit-dialog.component.ts | 4 +-- .../input/textarea/textarea.component.html | 23 ++++++++++++++ .../input/textarea/textarea.component.scss | 0 .../input/textarea/textarea.component.spec.ts | 31 +++++++++++++++++++ .../input/textarea/textarea.component.ts | 24 ++++++++++++++ .../storage-path-list.component.ts | 3 +- 9 files changed, 90 insertions(+), 5 deletions(-) create mode 100644 src-ui/src/app/components/common/input/textarea/textarea.component.html create mode 100644 src-ui/src/app/components/common/input/textarea/textarea.component.scss create mode 100644 src-ui/src/app/components/common/input/textarea/textarea.component.spec.ts create mode 100644 src-ui/src/app/components/common/input/textarea/textarea.component.ts diff --git a/src-ui/messages.xlf b/src-ui/messages.xlf index f5d270376..47c3b8c0f 100644 --- a/src-ui/messages.xlf +++ b/src-ui/messages.xlf @@ -4698,6 +4698,10 @@ src/app/components/common/input/text/text.component.html 9 + + src/app/components/common/input/textarea/textarea.component.html + 9 + src/app/components/common/input/url/url.component.html 7 @@ -7885,7 +7889,7 @@ Do you really want to delete the storage path ""? src/app/components/manage/storage-path-list/storage-path-list.component.ts - 52 + 53 diff --git a/src-ui/src/app/app.module.ts b/src-ui/src/app/app.module.ts index 005de5369..13db08ea9 100644 --- a/src-ui/src/app/app.module.ts +++ b/src-ui/src/app/app.module.ts @@ -41,6 +41,7 @@ import { DocumentCardSmallComponent } from './components/document-list/document- import { BulkEditorComponent } from './components/document-list/bulk-editor/bulk-editor.component' import { NgxFileDropModule } from 'ngx-file-drop' import { TextComponent } from './components/common/input/text/text.component' +import { TextAreaComponent } from './components/common/input/textarea/textarea.component' import { SelectComponent } from './components/common/input/select/select.component' import { CheckComponent } from './components/common/input/check/check.component' import { UrlComponent } from './components/common/input/url/url.component' @@ -433,6 +434,7 @@ function initializeApp(settings: SettingsService) { DocumentCardSmallComponent, BulkEditorComponent, TextComponent, + TextAreaComponent, SelectComponent, CheckComponent, UrlComponent, diff --git a/src-ui/src/app/components/common/edit-dialog/storage-path-edit-dialog/storage-path-edit-dialog.component.html b/src-ui/src/app/components/common/edit-dialog/storage-path-edit-dialog/storage-path-edit-dialog.component.html index ecec393c9..32d663db8 100644 --- a/src-ui/src/app/components/common/edit-dialog/storage-path-edit-dialog/storage-path-edit-dialog.component.html +++ b/src-ui/src/app/components/common/edit-dialog/storage-path-edit-dialog/storage-path-edit-dialog.component.html @@ -10,7 +10,7 @@
- + @if (patternRequired) { diff --git a/src-ui/src/app/components/common/edit-dialog/storage-path-edit-dialog/storage-path-edit-dialog.component.ts b/src-ui/src/app/components/common/edit-dialog/storage-path-edit-dialog/storage-path-edit-dialog.component.ts index 4a18605e7..0f9cc9711 100644 --- a/src-ui/src/app/components/common/edit-dialog/storage-path-edit-dialog/storage-path-edit-dialog.component.ts +++ b/src-ui/src/app/components/common/edit-dialog/storage-path-edit-dialog/storage-path-edit-dialog.component.ts @@ -26,9 +26,9 @@ export class StoragePathEditDialogComponent extends EditDialogComponent{created_year}-{title} ' + + ' {{ created_year }}-{{ title }} ' + $localize`or use slashes to add directories e.g.` + - ' {created_year}/{correspondent}/{title}. ' + + ' {{ created_year }}/{{ title }}. ' + $localize`See documentation for full list.` ) } diff --git a/src-ui/src/app/components/common/input/textarea/textarea.component.html b/src-ui/src/app/components/common/input/textarea/textarea.component.html new file mode 100644 index 000000000..9feb29857 --- /dev/null +++ b/src-ui/src/app/components/common/input/textarea/textarea.component.html @@ -0,0 +1,23 @@ +
+
+
+ @if (title) { + + } + @if (removable) { + + } +
+
+ + @if (hint) { + + } +
+ {{error}} +
+
+
+
diff --git a/src-ui/src/app/components/common/input/textarea/textarea.component.scss b/src-ui/src/app/components/common/input/textarea/textarea.component.scss new file mode 100644 index 000000000..e69de29bb diff --git a/src-ui/src/app/components/common/input/textarea/textarea.component.spec.ts b/src-ui/src/app/components/common/input/textarea/textarea.component.spec.ts new file mode 100644 index 000000000..15113c472 --- /dev/null +++ b/src-ui/src/app/components/common/input/textarea/textarea.component.spec.ts @@ -0,0 +1,31 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing' +import { + FormsModule, + ReactiveFormsModule, + NG_VALUE_ACCESSOR, +} from '@angular/forms' +import { TextAreaComponent } from './textarea.component' + +describe('TextComponent', () => { + let component: TextAreaComponent + let fixture: ComponentFixture + let input: HTMLTextAreaElement + + beforeEach(async () => { + TestBed.configureTestingModule({ + declarations: [TextAreaComponent], + providers: [], + imports: [FormsModule, ReactiveFormsModule], + }).compileComponents() + + fixture = TestBed.createComponent(TextAreaComponent) + fixture.debugElement.injector.get(NG_VALUE_ACCESSOR) + component = fixture.componentInstance + fixture.detectChanges() + input = component.inputField.nativeElement + }) + + it('should support use of input field', () => { + expect(component.value).toBeUndefined() + }) +}) diff --git a/src-ui/src/app/components/common/input/textarea/textarea.component.ts b/src-ui/src/app/components/common/input/textarea/textarea.component.ts new file mode 100644 index 000000000..39b6c13fe --- /dev/null +++ b/src-ui/src/app/components/common/input/textarea/textarea.component.ts @@ -0,0 +1,24 @@ +import { Component, Input, forwardRef } from '@angular/core' +import { NG_VALUE_ACCESSOR } from '@angular/forms' +import { AbstractInputComponent } from '../abstract-input' + +@Component({ + providers: [ + { + provide: NG_VALUE_ACCESSOR, + useExisting: forwardRef(() => TextAreaComponent), + multi: true, + }, + ], + selector: 'pngx-input-textarea', + templateUrl: './textarea.component.html', + styleUrls: ['./textarea.component.scss'], +}) +export class TextAreaComponent extends AbstractInputComponent { + @Input() + placeholder: string = '' + + constructor() { + super() + } +} diff --git a/src-ui/src/app/components/manage/storage-path-list/storage-path-list.component.ts b/src-ui/src/app/components/manage/storage-path-list/storage-path-list.component.ts index d227f01a5..5177a0a21 100644 --- a/src-ui/src/app/components/manage/storage-path-list/storage-path-list.component.ts +++ b/src-ui/src/app/components/manage/storage-path-list/storage-path-list.component.ts @@ -40,8 +40,9 @@ export class StoragePathListComponent extends ManagementListComponent { - return c.path + return `${c.path}` }, }, ]