From 84fe246ea9f0eb77775d5a5f609f80c5d725cc51 Mon Sep 17 00:00:00 2001
From: Atanas Yonkov <atanas.yonkov@crust.tech>
Date: Tue, 10 Jan 2023 13:21:38 +0200
Subject: [PATCH] Add Record Revisions Text Tessage When Revisions are Enabled

---
 .../components/PageBlocks/RecordListBase.vue  |   4 +-
 .../PageBlocks/RecordRevisionsBase.vue        | 121 ++++++++++--------
 locale/en/corteza-webapp-compose/block.yaml   |   1 +
 3 files changed, 72 insertions(+), 54 deletions(-)

diff --git a/client/web/compose/src/components/PageBlocks/RecordListBase.vue b/client/web/compose/src/components/PageBlocks/RecordListBase.vue
index f3e403010..2a6f1d1bb 100644
--- a/client/web/compose/src/components/PageBlocks/RecordListBase.vue
+++ b/client/web/compose/src/components/PageBlocks/RecordListBase.vue
@@ -463,12 +463,12 @@
               v-if="processing"
             />
 
-            <h6
+            <p
               v-else-if="!items.length"
               class="mb-0 mx-2"
             >
               {{ $t('recordList.noRecords') }}
-            </h6>
+            </p>
           </div>
         </b-table-simple>
       </div>
diff --git a/client/web/compose/src/components/PageBlocks/RecordRevisionsBase.vue b/client/web/compose/src/components/PageBlocks/RecordRevisionsBase.vue
index 4ca963f45..0afbea830 100644
--- a/client/web/compose/src/components/PageBlocks/RecordRevisionsBase.vue
+++ b/client/web/compose/src/components/PageBlocks/RecordRevisionsBase.vue
@@ -14,10 +14,12 @@
       >
         {{ $t('errors.disabled-on-module') }}
       </span>
+
       <b-spinner
         v-else-if="noRecord || processing"
         class="my-auto"
       />
+
       <b-button
         v-else-if="!preloadRevisions && !loadedRevisions"
         class="my-auto"
@@ -26,65 +28,80 @@
         {{ $t('show-revisions', { revision: record.revision }) }}
       </b-button>
 
-      <b-table-lite
+      <template
         v-else
-        :items="revisions"
-        :fields="columns"
-        sticky-header
-        class="flex-fill mh-100 mb-0 w-100 rounded"
       >
-        <template #cell(timestamp)="row">
-          {{ row.item.timestamp | locFullDateTime }}
-        </template>
-        <template
-          #cell(adt)="row"
+        <b-table-lite
+          :items="revisions"
+          :fields="columns"
+          sticky-header
+          class="flex-fill mh-100 mb-0 w-100 rounded"
         >
-          <b-button
-            v-if="row.item.changes.length > 0"
-            variant="link"
-            class="py-0 m-0"
-            @click="row.toggleDetails"
+          <template #cell(timestamp)="row">
+            {{ row.item.timestamp | locFullDateTime }}
+          </template>
+          <template
+            #cell(adt)="row"
           >
-            {{ row.detailsShowing ? '&times;' : $t(`show-changes`, { count: row.item.changes.length }) }}
-          </b-button>
-        </template>
-        <template #row-details="row">
-          <div
-            class="pl-5"
-          >
-            <b-table-simple
-              class="bg-light"
+            <b-button
+              v-if="row.item.changes.length > 0"
+              variant="link"
+              class="py-0 m-0"
+              @click="row.toggleDetails"
             >
-              <b-thead>
-                <b-tr>
-                  <b-th>{{ $t('changes.columns.field.label') }}</b-th>
-                  <b-th>{{ $t('changes.columns.old-value.label') }}</b-th>
-                  <b-th>{{ $t('changes.columns.new-value.label') }}</b-th>
-                </b-tr>
-              </b-thead>
-              <b-tbody
-                v-for="(change) in row.item.changes"
-                :key="change.key"
+              {{ row.detailsShowing ? '&times;' : $t(`show-changes`, { count: row.item.changes.length }) }}
+            </b-button>
+          </template>
+          <template #row-details="row">
+            <div
+              class="pl-5"
+            >
+              <b-table-simple
+                class="bg-light"
               >
-                <b-tr>
-                  <b-td :rowspan="Math.max(change.new ? change.new.length : 0, change.old ? change.old.length : 0)">
-                    {{ change.key }}
-                  </b-td>
-                  <b-td>{{ change.old ? change.old[0] : '-' }}</b-td>
-                  <b-td>{{ change.new ? change.new[0] : '-' }}</b-td>
-                </b-tr>
-                <b-tr
-                  v-for="index in Math.max(change.new ? change.new.length - 1 : 0, change.old ? change.old.length - 1 : 0)"
-                  :key="change.key + index"
+                <b-thead>
+                  <b-tr>
+                    <b-th>{{ $t('changes.columns.field.label') }}</b-th>
+                    <b-th>{{ $t('changes.columns.old-value.label') }}</b-th>
+                    <b-th>{{ $t('changes.columns.new-value.label') }}</b-th>
+                  </b-tr>
+                </b-thead>
+                <b-tbody
+                  v-for="(change) in row.item.changes"
+                  :key="change.key"
                 >
-                  <b-td>{{ change.old && change.old.length > index ? change.old[index]: '-' }}</b-td>
-                  <b-td>{{ change.new && change.new.length > index ? change.new[index]: '-' }}</b-td>
-                </b-tr>
-              </b-tbody>
-            </b-table-simple>
-          </div>
-        </template>
-      </b-table-lite>
+                  <b-tr>
+                    <b-td :rowspan="Math.max(change.new ? change.new.length : 0, change.old ? change.old.length : 0)">
+                      {{ change.key }}
+                    </b-td>
+                    <b-td>{{ change.old ? change.old[0] : '-' }}</b-td>
+                    <b-td>{{ change.new ? change.new[0] : '-' }}</b-td>
+                  </b-tr>
+                  <b-tr
+                    v-for="index in Math.max(change.new ? change.new.length - 1 : 0, change.old ? change.old.length - 1 : 0)"
+                    :key="change.key + index"
+                  >
+                    <b-td>{{ change.old && change.old.length > index ? change.old[index]: '-' }}</b-td>
+                    <b-td>{{ change.new && change.new.length > index ? change.new[index]: '-' }}</b-td>
+                  </b-tr>
+                </b-tbody>
+              </b-table-simple>
+            </div>
+          </template>
+        </b-table-lite>
+
+        <div
+          v-if="!revisions.length"
+          class="position-absolute text-center mt-5 d-print-none"
+          style="left: 0; right: 0;"
+        >
+          <p
+            class="mt-3"
+          >
+            {{ $t('errors.no-revisions') }}
+          </p>
+        </div>
+      </template>
     </div>
   </wrap>
 </template>
diff --git a/locale/en/corteza-webapp-compose/block.yaml b/locale/en/corteza-webapp-compose/block.yaml
index b503da63c..789ececae 100644
--- a/locale/en/corteza-webapp-compose/block.yaml
+++ b/locale/en/corteza-webapp-compose/block.yaml
@@ -419,6 +419,7 @@ recordRevisions:
   viewer:
     errors:
       no-record: No record found to display revisions for
+      no-revisions: No record revisions found
       disabled-on-module: Record revisions are disabled on this module
 
     show-revisions: Show record revisions ({{ revision }})