Geo 2.0 Regression - 51 years ago

ee/app/assets/javascripts/geo_nodes_beta/components/details/secondary_node/geo_node_secondary_other_info.vue

@@ -10,7 +10,7 @@ export default {
     otherInfo: __('Other information'),
     dbReplicationLag: s__('Geo|Data replication lag'),
     lastEventId: s__('Geo|Last event ID from primary'),
-    lastEvent: s__('Geo|%{eventId} (%{timeAgo})'),
+    lastEventTime: s__('Geo|(%{timeAgo})'),
     lastCursorEventId: s__('Geo|Last event ID processed by cursor'),
     storageConfig: s__('Geo|Storage config'),
     shardsNotMatched: s__('Geo|Does not match the primary storage configuration'),
@@ -58,6 +58,12 @@ export default {
       // Converting timestamp to ms
       return this.node.cursorLastEventTimestamp * 1000;
     },
+    hasEventInfo() {
+      return this.node.lastEventId || this.lastEventTimestamp;
+    },
+    hasCursorEventInfo() {
+      return this.node.cursorLastEventId || this.lastCursorEventTimestamp;
+    },
   },
 };
 </script>
@@ -75,31 +81,31 @@ export default {
     </div>
     <div class="gl-display-flex gl-flex-direction-column gl-mb-5">
       <span>{{ $options.i18n.lastEventId }}</span>
-      <span class="gl-font-weight-bold gl-mt-2" data-testid="last-event">
-        <gl-sprintf v-if="node.lastEventId" :message="$options.i18n.lastEvent">
-          <template #eventId>
-            {{ node.lastEventId }}
-          </template>
+      <div class="gl-font-weight-bold gl-mt-2" data-testid="last-event">
+        <template v-if="hasEventInfo">
+          <span v-if="node.lastEventId">{{ node.lastEventId }}</span>
+          <gl-sprintf v-if="lastEventTimestamp" :message="$options.i18n.lastEventTime">
             <template #timeAgo>
               <time-ago :time="lastEventTimestamp" />
             </template>
           </gl-sprintf>
+        </template>
         <span v-else>{{ $options.i18n.unknown }}</span>
-      </span>
+      </div>
     </div>
     <div class="gl-display-flex gl-flex-direction-column gl-mb-5">
       <span>{{ $options.i18n.lastCursorEventId }}</span>
-      <span class="gl-font-weight-bold gl-mt-2" data-testid="last-cursor-event">
-        <gl-sprintf v-if="node.cursorLastEventId" :message="$options.i18n.lastEvent">
-          <template #eventId>
-            {{ node.cursorLastEventId }}
-          </template>
+      <div class="gl-font-weight-bold gl-mt-2" data-testid="last-cursor-event">
+        <template v-if="hasCursorEventInfo">
+          <span v-if="node.cursorLastEventId">{{ node.cursorLastEventId }}</span>
+          <gl-sprintf v-if="lastCursorEventTimestamp" :message="$options.i18n.lastEventTime">
             <template #timeAgo>
               <time-ago :time="lastCursorEventTimestamp" />
             </template>
           </gl-sprintf>
+        </template>
         <span v-else>{{ $options.i18n.unknown }}</span>
-      </span>
+      </div>
     </div>
     <div class="gl-display-flex gl-flex-direction-column gl-mb-5">
       <span>{{ $options.i18n.storageConfig }}</span>

ee/spec/frontend/geo_nodes_beta/components/details/secondary_node/geo_node_secondary_other_info_spec.js

@@ -92,13 +92,14 @@ describe('GeoNodeSecondaryOtherInfo', () => {
       describe.each`
         lastEvent                                                | text
         ${{ lastEventId: null, lastEventTimestamp: null }}       | ${'Unknown'}
+        ${{ lastEventId: 1, lastEventTimestamp: 0 }}             | ${'1'}
         ${{ lastEventId: 1, lastEventTimestamp: MOCK_JUST_NOW }} | ${'1 (just now)'}
       `(`last event`, ({ lastEvent, text }) => {
         beforeEach(() => {
           createComponent({ node: { ...lastEvent } });
         });
 
-        it(`renders correctly when lastEventId is ${lastEvent.lastEventId}`, () => {
+        it(`renders correctly when lastEventId is ${lastEvent.lastEventId} and lastEventTimestamp is ${lastEvent.lastEventTimestamp}`, () => {
           expect(findLastEvent().text().replace(/\s+/g, ' ')).toBe(text);
         });
       });
@@ -106,13 +107,14 @@ describe('GeoNodeSecondaryOtherInfo', () => {
       describe.each`
         lastCursorEvent                                                      | text
         ${{ cursorLastEventId: null, cursorLastEventTimestamp: null }}       | ${'Unknown'}
+        ${{ cursorLastEventId: 1, cursorLastEventTimestamp: 0 }}             | ${'1'}
         ${{ cursorLastEventId: 1, cursorLastEventTimestamp: MOCK_JUST_NOW }} | ${'1 (just now)'}
       `(`last cursor event`, ({ lastCursorEvent, text }) => {
         beforeEach(() => {
           createComponent({ node: { ...lastCursorEvent } });
         });
 
-        it(`renders correctly when cursorLastEventId is ${lastCursorEvent.cursorLastEventId}`, () => {
+        it(`renders correctly when cursorLastEventId is ${lastCursorEvent.cursorLastEventId} and cursorLastEventTimestamp is ${lastCursorEvent.cursorLastEventTimestamp}`, () => {
           expect(findLastCursorEvent().text().replace(/\s+/g, ' ')).toBe(text);
         });
       });

locale/gitlab.pot

@@ -14669,9 +14669,6 @@ msgstr ""
 msgid "Geo|%{component} verified"
 msgstr ""
 
-msgid "Geo|%{eventId} (%{timeAgo})"
-msgstr ""
-
 msgid "Geo|%{itemTitle} checksum progress"
 msgstr ""
 
@@ -14699,6 +14696,9 @@ msgstr ""
 msgid "Geo|%{title} checksum progress"
 msgstr ""
 
+msgid "Geo|(%{timeAgo})"
+msgstr ""
+
 msgid "Geo|Add site"
 msgstr ""