diff --git a/src-ui/messages.xlf b/src-ui/messages.xlf index d37d90dca..d00235957 100644 --- a/src-ui/messages.xlf +++ b/src-ui/messages.xlf @@ -5177,7 +5177,7 @@ src/app/components/document-list/document-card-small/document-card-small.component.ts - 79 + 89 diff --git a/src-ui/src/app/components/admin/trash/trash.component.html b/src-ui/src/app/components/admin/trash/trash.component.html index f1e065c2c..55388d4cd 100644 --- a/src-ui/src/app/components/admin/trash/trash.component.html +++ b/src-ui/src/app/components/admin/trash/trash.component.html @@ -47,7 +47,7 @@ } @for (document of documentsInTrash; track document.id) { - +
diff --git a/src-ui/src/app/components/admin/trash/trash.component.scss b/src-ui/src/app/components/admin/trash/trash.component.scss index 648aa7f4d..e69de29bb 100644 --- a/src-ui/src/app/components/admin/trash/trash.component.scss +++ b/src-ui/src/app/components/admin/trash/trash.component.scss @@ -1,8 +0,0 @@ -.data-row { - opacity: 0; - transition: opacity .2s; -} - -.reveal { - opacity: 1; -} diff --git a/src-ui/src/app/components/admin/trash/trash.component.ts b/src-ui/src/app/components/admin/trash/trash.component.ts index 5f312cc50..543717f6b 100644 --- a/src-ui/src/app/components/admin/trash/trash.component.ts +++ b/src-ui/src/app/components/admin/trash/trash.component.ts @@ -50,7 +50,7 @@ export class TrashComponent delay(100) ) .subscribe(() => { - this.reveal = true + this.show = true }) } diff --git a/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html b/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html index 2cce1a848..e52272787 100644 --- a/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html +++ b/src-ui/src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html @@ -9,7 +9,7 @@ Show all } -
+
@if (displayMode === DisplayMode.TABLE) { @@ -33,7 +33,7 @@ @for (field of displayFields; track field; let j = $index) { } @for (object of data; track object) { - +
- @if (loading && reveal) { + @if (loading && show) {
@@ -94,9 +94,9 @@ @for (d of documents; track d.id; let i = $index) { { - this.reveal = true + this.show = true this.documents = result.results }), delay(500) diff --git a/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.html b/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.html index 5f0091dc5..5ec00f500 100644 --- a/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.html +++ b/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.html @@ -1,4 +1,4 @@ -
+
diff --git a/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.scss b/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.scss index 521a97c6b..4efdb0876 100644 --- a/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.scss +++ b/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.scss @@ -1,12 +1,3 @@ i-bs { cursor: move; } - -.card { - opacity: 0; - transition: opacity .2s; -} - -.reveal { - opacity: 1; -} diff --git a/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.spec.ts b/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.spec.ts index cfd7edb3d..b6e8d8515 100644 --- a/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.spec.ts +++ b/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.spec.ts @@ -53,9 +53,9 @@ describe('WidgetFrameComponent', () => { expect(fixture.debugElement.query(By.css('.spinner-border'))).not.toBeNull() }) - it('should reveal', () => { - expect(component.reveal).toBeFalsy() + it('should show', () => { + expect(component.show).toBeFalsy() jest.advanceTimersByTime(100) - expect(component.reveal).toBeTruthy() + expect(component.show).toBeTruthy() }) }) diff --git a/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.ts b/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.ts index 0ebe3b5ea..dbef53da8 100644 --- a/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.ts +++ b/src-ui/src/app/components/dashboard/widgets/widget-frame/widget-frame.component.ts @@ -25,7 +25,7 @@ export class WidgetFrameComponent ngAfterViewInit(): void { setTimeout(() => { - this.reveal = true + this.show = true }, 100) } } diff --git a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html index 810fea029..46399aa32 100644 --- a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html +++ b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html @@ -1,4 +1,4 @@ -
+
@if (document) { diff --git a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.spec.ts b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.spec.ts index 8905d3ff2..9fca1140d 100644 --- a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.spec.ts +++ b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.spec.ts @@ -71,6 +71,14 @@ describe('DocumentCardLargeComponent', () => { component = fixture.componentInstance component.document = doc fixture.detectChanges() + jest.useFakeTimers() + }) + + it('should show the card', () => { + expect(component.show).toBeFalsy() + component.ngAfterViewInit() + jest.advanceTimersByTime(100) + expect(component.show).toBeTruthy() }) it('should display a document', () => { diff --git a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts index d33cef9f3..de655ec2e 100644 --- a/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts +++ b/src-ui/src/app/components/document-list/document-card-large/document-card-large.component.ts @@ -1,4 +1,5 @@ import { + AfterViewInit, Component, EventEmitter, Input, @@ -13,7 +14,7 @@ import { import { DocumentService } from 'src/app/services/rest/document.service' import { SettingsService } from 'src/app/services/settings.service' import { SETTINGS_KEYS } from 'src/app/data/ui-settings' -import { ComponentWithPermissions } from '../../with-permissions/with-permissions.component' +import { LoadingComponentWithPermissions } from '../../loading-component/loading.component' import { PreviewPopupComponent } from '../../common/preview-popup/preview-popup.component' @Component({ @@ -21,7 +22,10 @@ import { PreviewPopupComponent } from '../../common/preview-popup/preview-popup. templateUrl: './document-card-large.component.html', styleUrls: ['./document-card-large.component.scss'], }) -export class DocumentCardLargeComponent extends ComponentWithPermissions { +export class DocumentCardLargeComponent + extends LoadingComponentWithPermissions + implements AfterViewInit +{ DisplayField = DisplayField constructor( @@ -70,6 +74,12 @@ export class DocumentCardLargeComponent extends ComponentWithPermissions { mouseOnPreview = false popoverHidden = true + ngAfterViewInit(): void { + setInterval(() => { + this.show = true + }, 100) + } + get searchScoreClass() { if (this.document.__search_hit__) { if (this.document.__search_hit__.score > 0.7) { diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html index 7b1b9bc93..cde273dfe 100644 --- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html +++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html @@ -1,4 +1,4 @@ -
+
@if (document) { diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.spec.ts b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.spec.ts index 7bdb0c3f8..c9a232c5c 100644 --- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.spec.ts +++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.spec.ts @@ -85,6 +85,14 @@ describe('DocumentCardSmallComponent', () => { component = fixture.componentInstance component.document = Object.assign({}, doc) fixture.detectChanges() + jest.useFakeTimers() + }) + + it('should show the card', () => { + expect(component.show).toBeFalsy() + component.ngAfterViewInit() + jest.advanceTimersByTime(100) + expect(component.show).toBeTruthy() }) it('should display page count', () => { diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts index f8705fa8e..44f7e69cb 100644 --- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts +++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.ts @@ -1,4 +1,5 @@ import { + AfterViewInit, Component, EventEmitter, Input, @@ -14,7 +15,7 @@ import { import { DocumentService } from 'src/app/services/rest/document.service' import { SettingsService } from 'src/app/services/settings.service' import { SETTINGS_KEYS } from 'src/app/data/ui-settings' -import { ComponentWithPermissions } from '../../with-permissions/with-permissions.component' +import { LoadingComponentWithPermissions } from '../../loading-component/loading.component' import { PreviewPopupComponent } from '../../common/preview-popup/preview-popup.component' @Component({ @@ -22,7 +23,10 @@ import { PreviewPopupComponent } from '../../common/preview-popup/preview-popup. templateUrl: './document-card-small.component.html', styleUrls: ['./document-card-small.component.scss'], }) -export class DocumentCardSmallComponent extends ComponentWithPermissions { +export class DocumentCardSmallComponent + extends LoadingComponentWithPermissions + implements AfterViewInit +{ DisplayField = DisplayField constructor( @@ -63,6 +67,12 @@ export class DocumentCardSmallComponent extends ComponentWithPermissions { @ViewChild('popupPreview') popupPreview: PreviewPopupComponent + ngAfterViewInit(): void { + setInterval(() => { + this.show = true + }, 50) + } + getIsThumbInverted() { return this.settingsService.get(SETTINGS_KEYS.DARK_MODE_THUMB_INVERTED) } diff --git a/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.html b/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.html index ae7c1f5f0..32c2a1908 100644 --- a/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.html +++ b/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.html @@ -1,6 +1,6 @@
-
+
@@ -36,7 +36,7 @@
@if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.Tag) && tags.length > 0) { - } @if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.Correspondent) && correspondents.length > 0) { - } @if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.DocumentType) && documentTypes.length > 0) { - } @if (permissionsService.currentUserCan(PermissionAction.View, PermissionType.StoragePath) && storagePaths.length > 0) { - 0) { - } - - diff --git a/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.scss b/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.scss index 5304721c6..82ad7e7a5 100644 --- a/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.scss +++ b/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.scss @@ -25,7 +25,3 @@ input[type="text"] { .z-10 { z-index: 10; } - -.reveal { - opacity: 1; -} diff --git a/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.ts b/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.ts index e34e66524..f9e5ec36e 100644 --- a/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.ts +++ b/src-ui/src/app/components/document-list/filter-editor/filter-editor.component.ts @@ -961,7 +961,7 @@ export class FilterEditorComponent this.loadingCount++ if (this.loadingCount == this.loadingCountTotal) { this.loading = false - this.reveal = true + this.show = true } } diff --git a/src-ui/src/app/components/loading-component/loading.component.spec.ts b/src-ui/src/app/components/loading-component/loading.component.spec.ts index 091745ce9..82ae0a014 100644 --- a/src-ui/src/app/components/loading-component/loading.component.spec.ts +++ b/src-ui/src/app/components/loading-component/loading.component.spec.ts @@ -29,8 +29,8 @@ describe('LoadingComponentWithPermissions', () => { expect(component.loading).toBeTruthy() }) - it('should have reveal set to false by default', () => { - expect(component.reveal).toBeFalsy() + it('should have show set to false by default', () => { + expect(component.show).toBeFalsy() }) it('should call next and complete on unsubscribeNotifier with itself on destroy', () => { diff --git a/src-ui/src/app/components/loading-component/loading.component.ts b/src-ui/src/app/components/loading-component/loading.component.ts index dcd8340a4..62c963c1d 100644 --- a/src-ui/src/app/components/loading-component/loading.component.ts +++ b/src-ui/src/app/components/loading-component/loading.component.ts @@ -8,7 +8,7 @@ export abstract class LoadingComponentWithPermissions implements OnDestroy { public loading: boolean = true - public reveal: boolean = false + public show: boolean = false protected unsubscribeNotifier: Subject = new Subject() diff --git a/src-ui/src/app/components/manage/custom-fields/custom-fields.component.html b/src-ui/src/app/components/manage/custom-fields/custom-fields.component.html index 291520b83..185e9da35 100644 --- a/src-ui/src/app/components/manage/custom-fields/custom-fields.component.html +++ b/src-ui/src/app/components/manage/custom-fields/custom-fields.component.html @@ -13,7 +13,7 @@
  • -
    +
    Name
    Data Type
    Actions
    @@ -29,7 +29,7 @@ @for (field of fields; track field) {
  • -
    +
    {{getDataType(field)}}
    diff --git a/src-ui/src/app/components/manage/custom-fields/custom-fields.component.scss b/src-ui/src/app/components/manage/custom-fields/custom-fields.component.scss index 22a61847c..dfdd20433 100644 --- a/src-ui/src/app/components/manage/custom-fields/custom-fields.component.scss +++ b/src-ui/src/app/components/manage/custom-fields/custom-fields.component.scss @@ -2,12 +2,3 @@ .d-block.d-sm-none .dropdown-toggle::after { display: none; } - -.list-group-item .row { - opacity: 0; - transition: opacity .2s; -} - -.list-group-item .reveal { - opacity: 1; -} diff --git a/src-ui/src/app/components/manage/custom-fields/custom-fields.component.ts b/src-ui/src/app/components/manage/custom-fields/custom-fields.component.ts index 7bf4066b9..106a88721 100644 --- a/src-ui/src/app/components/manage/custom-fields/custom-fields.component.ts +++ b/src-ui/src/app/components/manage/custom-fields/custom-fields.component.ts @@ -54,7 +54,7 @@ export class CustomFieldsComponent delay(100) ) .subscribe(() => { - this.reveal = true + this.show = true this.loading = false }) } diff --git a/src-ui/src/app/components/manage/mail/mail.component.html b/src-ui/src/app/components/manage/mail/mail.component.html index 090afe0cd..9b6fe0423 100644 --- a/src-ui/src/app/components/manage/mail/mail.component.html +++ b/src-ui/src/app/components/manage/mail/mail.component.html @@ -26,7 +26,7 @@
    • -
      +
      Name
      Server
      Username
      @@ -43,7 +43,7 @@ @for (account of mailAccounts; track account) {
    • -
      +
      {{rule.order}}
      {{(mailAccountService.getCached(rule.account) | async)?.name}}
      diff --git a/src-ui/src/app/components/manage/mail/mail.component.scss b/src-ui/src/app/components/manage/mail/mail.component.scss index d18ed3d30..0c1f432aa 100644 --- a/src-ui/src/app/components/manage/mail/mail.component.scss +++ b/src-ui/src/app/components/manage/mail/mail.component.scss @@ -2,12 +2,3 @@ .d-block.d-sm-none .dropdown-toggle::after { display: none; } - -.list-group-item .row { - opacity: 0; - transition: opacity .2s; -} - -.list-group-item .reveal { - opacity: 1; -} diff --git a/src-ui/src/app/components/manage/mail/mail.component.ts b/src-ui/src/app/components/manage/mail/mail.component.ts index d4bbf77c4..dce23b4b6 100644 --- a/src-ui/src/app/components/manage/mail/mail.component.ts +++ b/src-ui/src/app/components/manage/mail/mail.component.ts @@ -48,9 +48,9 @@ export class MailComponent } public loadingRules: boolean = true - public revealRules: boolean = false + public showRules: boolean = false public loadingAccounts: boolean = true - public revealAccounts: boolean = false + public showAccounts: boolean = false constructor( public mailAccountService: MailAccountService, @@ -85,7 +85,7 @@ export class MailComponent .subscribe({ next: () => { this.loadingAccounts = false - this.revealAccounts = true + this.showAccounts = true }, error: (e) => { this.toastService.showError( @@ -108,7 +108,7 @@ export class MailComponent .subscribe({ next: (r) => { this.loadingRules = false - this.revealRules = true + this.showRules = true }, error: (e) => { this.toastService.showError($localize`Error retrieving mail rules`, e) diff --git a/src-ui/src/app/components/manage/management-list/management-list.component.html b/src-ui/src/app/components/manage/management-list/management-list.component.html index 7d4647491..ca4e93095 100644 --- a/src-ui/src/app/components/manage/management-list/management-list.component.html +++ b/src-ui/src/app/components/manage/management-list/management-list.component.html @@ -53,7 +53,7 @@
diff --git a/src-ui/src/app/components/manage/management-list/management-list.component.scss b/src-ui/src/app/components/manage/management-list/management-list.component.scss index 79db7e74f..aa2871d68 100644 --- a/src-ui/src/app/components/manage/management-list/management-list.component.scss +++ b/src-ui/src/app/components/manage/management-list/management-list.component.scss @@ -10,12 +10,3 @@ tbody tr:last-child td { .form-check { min-height: 0; } - -.data-row { - opacity: 0; - transition: opacity .2s; -} - -.reveal { - opacity: 1; -} diff --git a/src-ui/src/app/components/manage/management-list/management-list.component.ts b/src-ui/src/app/components/manage/management-list/management-list.component.ts index 164b2fa52..75af9f94c 100644 --- a/src-ui/src/app/components/manage/management-list/management-list.component.ts +++ b/src-ui/src/app/components/manage/management-list/management-list.component.ts @@ -153,7 +153,7 @@ export abstract class ManagementListComponent delay(100) ) .subscribe(() => { - this.reveal = true + this.show = true this.loading = false }) } diff --git a/src-ui/src/app/components/manage/workflows/workflows.component.html b/src-ui/src/app/components/manage/workflows/workflows.component.html index 10c0cc80d..085de71ea 100644 --- a/src-ui/src/app/components/manage/workflows/workflows.component.html +++ b/src-ui/src/app/components/manage/workflows/workflows.component.html @@ -13,7 +13,7 @@
  • -
    +
    Name
    Sort order
    Status
    @@ -31,7 +31,7 @@ @for (workflow of workflows; track workflow.id) {
  • -
    +
    {{workflow.order}}
    @@ -77,6 +77,6 @@
    • } @if (!loading && workflows.length === 0) { -
  • No workflows defined.
    • +
  • No workflows defined.
    • }
diff --git a/src-ui/src/app/components/manage/workflows/workflows.component.scss b/src-ui/src/app/components/manage/workflows/workflows.component.scss index d18ed3d30..0c1f432aa 100644 --- a/src-ui/src/app/components/manage/workflows/workflows.component.scss +++ b/src-ui/src/app/components/manage/workflows/workflows.component.scss @@ -2,12 +2,3 @@ .d-block.d-sm-none .dropdown-toggle::after { display: none; } - -.list-group-item .row { - opacity: 0; - transition: opacity .2s; -} - -.list-group-item .reveal { - opacity: 1; -} diff --git a/src-ui/src/app/components/manage/workflows/workflows.component.ts b/src-ui/src/app/components/manage/workflows/workflows.component.ts index 1c04ff5d1..5178a04f7 100644 --- a/src-ui/src/app/components/manage/workflows/workflows.component.ts +++ b/src-ui/src/app/components/manage/workflows/workflows.component.ts @@ -47,7 +47,7 @@ export class WorkflowsComponent delay(100) ) .subscribe(() => { - this.reveal = true + this.show = true this.loading = false }) }