From 9ed88d4acb7d0352fd087f30516abc9dc27abee0 Mon Sep 17 00:00:00 2001 From: shamoon <4887959+shamoon@users.noreply.github.com> Date: Wed, 4 Dec 2024 16:31:16 -0800 Subject: [PATCH] Enhancement: homepage skeleton screens --- src-ui/messages.xlf | 98 ++++----- .../dashboard/dashboard.component.html | 15 +- .../saved-view-widget.component.html | 29 ++- .../saved-view-widget.component.ts | 6 +- .../statistics-widget.component.html | 80 +++++-- .../document-card-large.component.html | 121 ++++++---- .../document-card-small.component.html | 206 ++++++++++-------- 7 files changed, 342 insertions(+), 213 deletions(-) diff --git a/src-ui/messages.xlf b/src-ui/messages.xlf index 914e781d4..0dac319f2 100644 --- a/src-ui/messages.xlf +++ b/src-ui/messages.xlf @@ -259,15 +259,15 @@ src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html - 37 + 50 src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html - 40 + 53 src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html - 43 + 56 src/app/components/dashboard/widgets/upload-file-widget/upload-file-widget.component.html @@ -730,7 +730,7 @@ src/app/components/dashboard/dashboard.component.html - 15 + 21 src/app/components/dashboard/widgets/widget-frame/widget-frame.component.html @@ -2686,7 +2686,7 @@ src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html - 72 + 106 @@ -2705,7 +2705,7 @@ src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html - 64 + 93 src/app/components/document-list/bulk-editor/bulk-editor.component.html @@ -2736,7 +2736,7 @@ src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html - 80 + 119 @@ -2751,7 +2751,7 @@ src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html - 88 + 132 @@ -2911,11 +2911,11 @@ src/app/components/document-list/document-card-large/document-card-large.component.html - 57 + 72 src/app/components/document-list/document-card-small/document-card-small.component.html - 129 + 142 @@ -2933,7 +2933,7 @@ src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html - 79 + 92 src/app/components/document-detail/document-detail.component.html @@ -2945,11 +2945,11 @@ src/app/components/document-list/document-card-large/document-card-large.component.html - 63 + 78 src/app/components/document-list/document-card-small/document-card-small.component.html - 135 + 148 @@ -3238,7 +3238,7 @@ src/app/components/document-list/document-card-large/document-card-large.component.html - 60 + 75 @@ -5921,11 +5921,11 @@ Filter by correspondent src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html - 47 + 60 src/app/components/document-list/document-card-large/document-card-large.component.html - 20 + 25 src/app/components/document-list/document-list.component.html @@ -5936,11 +5936,11 @@ Filter by document type src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html - 57 + 70 src/app/components/document-list/document-card-large/document-card-large.component.html - 74 + 96 src/app/components/document-list/document-list.component.html @@ -5951,11 +5951,11 @@ Filter by storage path src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html - 62 + 75 src/app/components/document-list/document-card-large/document-card-large.component.html - 80 + 102 src/app/components/document-list/document-list.component.html @@ -5966,14 +5966,14 @@ View Preview src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html - 71 + 84 No documents src/app/components/dashboard/widgets/saved-view-widget/saved-view-widget.component.html - 121 + 144 @@ -5987,42 +5987,42 @@ Go to inbox src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html - 5 + 28 Documents in inbox src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html - 6 + 29 Go to documents src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html - 10 + 33 Total documents src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html - 11 + 34 Total characters src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html - 15 + 38 Current ASN src/app/components/dashboard/widgets/statistics-widget/statistics-widget.component.html - 20 + 43 @@ -6184,7 +6184,7 @@ src/app/components/document-list/document-card-large/document-card-large.component.html - 54 + 69 @@ -7159,7 +7159,7 @@ Filter by tag src/app/components/document-list/document-card-large/document-card-large.component.html - 31 + 36 src/app/components/document-list/document-list.component.html @@ -7170,74 +7170,74 @@ View notes src/app/components/document-list/document-card-large/document-card-large.component.html - 69 + 91 Created: src/app/components/document-list/document-card-large/document-card-large.component.html - 93,94 + 115,116 src/app/components/document-list/document-card-small/document-card-small.component.html - 66,67 + 75,76 src/app/components/document-list/document-card-small/document-card-small.component.html - 81,82 + 90,91 Added: src/app/components/document-list/document-card-large/document-card-large.component.html - 94,95 + 116,117 src/app/components/document-list/document-card-small/document-card-small.component.html - 67,68 + 76,77 src/app/components/document-list/document-card-small/document-card-small.component.html - 82,83 + 91,92 Modified: src/app/components/document-list/document-card-large/document-card-large.component.html - 95,96 + 117,118 src/app/components/document-list/document-card-small/document-card-small.component.html - 68,69 + 77,78 src/app/components/document-list/document-card-small/document-card-small.component.html - 83,84 + 92,93 {VAR_PLURAL, plural, =1 {1 page} other { pages}} src/app/components/document-list/document-card-large/document-card-large.component.html - 112 + 134 src/app/components/document-list/document-card-small/document-card-small.component.html - 96 + 105 Shared src/app/components/document-list/document-card-large/document-card-large.component.html - 122 + 144 src/app/components/document-list/document-card-small/document-card-small.component.html - 115 + 124 src/app/data/document.ts @@ -7252,35 +7252,35 @@ Score: src/app/components/document-list/document-card-large/document-card-large.component.html - 127 + 149 Toggle tag filter src/app/components/document-list/document-card-small/document-card-small.component.html - 16 + 20 Toggle correspondent filter src/app/components/document-list/document-card-small/document-card-small.component.html - 38 + 42 Toggle document type filter src/app/components/document-list/document-card-small/document-card-small.component.html - 49 + 58 Toggle storage path filter src/app/components/document-list/document-card-small/document-card-small.component.html - 56 + 65 diff --git a/src-ui/src/app/components/dashboard/dashboard.component.html b/src-ui/src/app/components/dashboard/dashboard.component.html index 4b217f8c3..4d6ae03b9 100644 --- a/src-ui/src/app/components/dashboard/dashboard.component.html +++ b/src-ui/src/app/components/dashboard/dashboard.component.html @@ -11,8 +11,19 @@ > @if (savedViewService.loading) {
- - Loading... +
+
+
+
+
+ +
+
Loading...
+
+
+
+
 
+
} 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 42de9f374..98dc94f16 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 (documents.length && displayMode === DisplayMode.TABLE) { + @if (displayMode === DisplayMode.TABLE) { @@ -28,6 +28,19 @@ + @if (loading) { + @for (i of [].constructor(pageSize); track i) { + + @for (field of displayFields; track field; let j = $index) { + + } + + } + } @for (doc of documents; track doc.id) { @for (field of displayFields; track field; let i = $index) { @@ -87,8 +100,13 @@ }
+
+ +
+
- } @else if (documents.length && displayMode === DisplayMode.SMALL_CARDS) { + } @else if (displayMode === DisplayMode.SMALL_CARDS) {
+ @if (loading) { + @for (i of [].constructor(pageSize); track i) { + + } + } @for (d of documents; track d.id) { }
- } @else if (documents.length && displayMode === DisplayMode.LARGE_CARDS) { + } @else if (displayMode === DisplayMode.LARGE_CARDS) {
+ @if (loading) { + @for (i of [].constructor(pageSize); track i) { + + } + } @for (d of documents; track d.id) {
- @if (statistics?.documents_inbox !== null) { - - Documents in inbox: - {{statistics?.documents_inbox}} - - } - - Total documents: - {{statistics?.documents_total}} - -
- Total characters: - {{statistics?.character_count | number}} -
- @if (statistics?.current_asn) { -
- Current ASN: - {{statistics?.current_asn}} + @if (loading) { +
+
+  
+
+
+   +
+
+
+   +
+
+
+   +
+
+
+
+
+
+ } @else { + @if (statistics?.documents_inbox !== null) { + + Documents in inbox: + {{statistics?.documents_inbox}} + + } + + Total documents: + {{statistics?.documents_total}} + +
+ Total characters: + {{statistics?.character_count | number}} +
+ @if (statistics?.current_asn) { +
+ Current ASN: + {{statistics?.current_asn}} +
+ } } @if (statistics?.document_file_type_counts?.length > 1) {
@@ -59,6 +83,11 @@
+ @if (loading) { +
+ +
+ } @if (statistics?.tag_count > 0) { Tags: @@ -67,6 +96,11 @@ } + @if (loading) { +
+ +
+ } @if (statistics?.correspondent_count > 0) { Correspondents: @@ -75,6 +109,11 @@ } + @if (loading) { +
+ +
+ } @if (statistics?.document_type_count > 0) { Document Types: @@ -83,6 +122,11 @@ } + @if (loading) { +
+ +
+ } @if (statistics?.storage_path_count > 0) { Storage Paths: 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 34557be31..90606fc0d 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,70 +1,92 @@ -
+
- + @if (document) { + -
-
- - +
+
+ + +
-
+ } @else { +
+ }
-
- @if (displayFields.includes(DisplayField.CORRESPONDENT) && document.correspondent) { - @if (clickCorrespondent.observers.length ) { - {{(document.correspondent$ | async)?.name}} - } @else { - {{(document.correspondent$ | async)?.name}} +
+ @if (document) { + @if (displayFields.includes(DisplayField.CORRESPONDENT) && document.correspondent) { + @if (clickCorrespondent.observers.length ) { + {{(document.correspondent$ | async)?.name}} + } @else { + {{(document.correspondent$ | async)?.name}} + } + @if (displayFields.includes(DisplayField.TITLE)) {:} } - @if (displayFields.includes(DisplayField.TITLE)) {:} - } - @if (displayFields.includes(DisplayField.TITLE)) { - {{document.title | documentTitle}} - } - @if (displayFields.includes(DisplayField.TAGS)) { - @for (t of document.tags$ | async; track t) { - + @if (displayFields.includes(DisplayField.TITLE)) { + {{document.title | documentTitle}} } + @if (displayFields.includes(DisplayField.TAGS)) { + @for (t of document.tags$ | async; track t) { + + } + } + } @else { +
 
}

- @if (document.__search_hit__ && document.__search_hit__.highlights) { - - } - @for (highlight of searchNoteHighlights; track highlight) { - - - - - } - @if (!document.__search_hit__?.score) { - {{contentTrimmed}} + @if (document) { + @if (document.__search_hit__ && document.__search_hit__.highlights) { + + } + @for (highlight of searchNoteHighlights; track highlight) { + + + + + } + @if (!document.__search_hit__?.score) { + {{contentTrimmed}} + } + } @else { +

+
+
}

- -  More like this - - -  Open - - -  View - - -  Download + @if (document) { + +  More like this -
+ +  Open + + +  View + + +  Download + + } @else { +
 
+
 
+
 
+
 
+ } +
-
+
+ @if (document) { @if (displayFields.includes(DisplayField.NOTES) && notesEnabled && document.notes.length) {
} } -
+ } @else { +
 
+
 
+
 
+
 
+
 
+ }
+
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 60713ef02..287b41463 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,16 +1,20 @@ -
+
- + @if (document) { + -
-
- - +
+
+ + +
-
+ } @else { +
+ } - @if (displayFields?.includes(DisplayField.TAGS)) { + @if (displayFields?.includes(DisplayField.TAGS) && document) {
@for (t of getTagsLimited$() | async; track t) { @@ -24,7 +28,7 @@ }
- @if (displayFields.includes(DisplayField.NOTES) && notesEnabled && document.notes.length) { + @if (document && displayFields.includes(DisplayField.NOTES) && notesEnabled && document.notes.length) { @@ -34,107 +38,121 @@

- @if (displayFields.includes(DisplayField.CORRESPONDENT) && document.correspondent) { + @if (document && displayFields.includes(DisplayField.CORRESPONDENT) && document.correspondent) { {{(document.correspondent$ | async)?.name ?? privateName}} @if (displayFields.includes(DisplayField.TITLE)) {:} } - @if (displayFields.includes(DisplayField.TITLE)) { + @if (document && displayFields.includes(DisplayField.TITLE)) { {{document.title | documentTitle}} } + @if (!document) { +

+
+ }

- @if (displayFields.includes(DisplayField.DOCUMENT_TYPE) && document.document_type) { - - } - @if (displayFields.includes(DisplayField.STORAGE_PATH) && document.storage_path) { - - } - @if (displayFields.includes(DisplayField.CREATED)) { -
- -
- Created: {{ document.created_date | customDate }} - Added: {{ document.added | customDate }} - Modified: {{ document.modified | customDate }} + @if (document) { + @if (displayFields.includes(DisplayField.DOCUMENT_TYPE) && document.document_type) { + + } + @if (displayFields.includes(DisplayField.STORAGE_PATH) && document.storage_path) { + + } + @if (displayFields.includes(DisplayField.CREATED)) { +
+ +
+ Created: {{ document.created_date | customDate }} + Added: {{ document.added | customDate }} + Modified: {{ document.modified | customDate }} +
+ +
+ + {{document.created_date | customDate:'mediumDate'}}
- -
- - {{document.created_date | customDate:'mediumDate'}} -
-
- } - @if (displayFields.includes(DisplayField.ADDED)) { -
- -
- Created: {{ document.created | customDate }} - Added: {{ document.added | customDate }} - Modified: {{ document.modified | customDate }} -
- -
- - {{document.added | customDate:'mediumDate'}} -
-
- } - @if (displayFields.includes(DisplayField.PAGE_COUNT) && document.page_count) { -
-
- - {document.page_count, plural, =1 {1 page} other {{{document.page_count}} pages}} -
-
- } - @if (displayFields.includes(DisplayField.ASN) && document.archive_serial_number | isNumber) { -
- - #{{document.archive_serial_number}} -
- } - @if (displayFields.includes(DisplayField.OWNER) && document.owner && document.owner !== settingsService.currentUser.id) { -
- - {{document.owner | username}} -
- } - @if (displayFields.includes(DisplayField.SHARED) && document.is_shared_by_requester) { -
- - Shared -
- } - @for (field of document.custom_fields; track field.field) { - @if (displayFields.includes(DisplayField.CUSTOM_FIELD + field.field)) { -
- -
} + @if (displayFields.includes(DisplayField.ADDED)) { +
+ +
+ Created: {{ document.created | customDate }} + Added: {{ document.added | customDate }} + Modified: {{ document.modified | customDate }} +
+ +
+ + {{document.added | customDate:'mediumDate'}} +
+
+ } + @if (displayFields.includes(DisplayField.PAGE_COUNT) && document.page_count) { +
+
+ + {document.page_count, plural, =1 {1 page} other {{{document.page_count}} pages}} +
+
+ } + @if (displayFields.includes(DisplayField.ASN) && document.archive_serial_number | isNumber) { +
+ + #{{document.archive_serial_number}} +
+ } + @if (displayFields.includes(DisplayField.OWNER) && document.owner && document.owner !== settingsService.currentUser.id) { +
+ + {{document.owner | username}} +
+ } + @if (displayFields.includes(DisplayField.SHARED) && document.is_shared_by_requester) { +
+ + Shared +
+ } + @for (field of document.custom_fields; track field.field) { + @if (displayFields.includes(DisplayField.CUSTOM_FIELD + field.field)) { +
+ + +
+ } + } + } @else { +
}
- - - - - - - - - + @if (document) { + + + + + + + + + + } @else { + + + + }