Add Record Page Links to Reminders

client/web/compose/src/components/Namespaces/Reminders/Edit.vue

@@ -50,10 +50,24 @@
           v-if="reminder.payload.link"
           :label="$t('reminder.routesTo')"
         >
-          <b-form-input
-            v-model="reminder.payload.link.label"
-            data-test-id="input-link"
-          />
+          <b-input-group>
+            <b-form-input
+              v-model="reminder.payload.link.label"
+              data-test-id="input-link"
+            />
+
+            <b-input-group-append>
+              <b-button
+                :disabled="!recordViewer"
+                :to="recordViewer(reminder.payload.link.params)"
+                :title="$t('label.recordPageLink')"
+                variant="light"
+                class="d-flex align-items-center"
+              >
+                <font-awesome-icon :icon="['fas', 'external-link-alt']" />
+              </b-button>
+            </b-input-group-append>
+          </b-input-group>
         </b-form-group>
       </b-form>
     </b-list-group-item>
@@ -177,6 +191,10 @@ export default {
   },
 
   methods: {
+    recordViewer (params) {
+      return params ? { name: 'page.record', params } : undefined
+    },
+
     save () {
       // @todo support for updating times
       let r = {}

client/web/compose/src/components/Namespaces/Reminders/List.vue

@@ -54,6 +54,17 @@
           class="ml-1"
         />
 
+        <b-button
+          v-if="r.payload.link"
+          :disabled="!recordViewer()"
+          :to="recordViewer(r.payload.link.params)"
+          :title="$t('label.recordPageLink')"
+          variant="link"
+          class="p-0 ml-2"
+        >
+          <font-awesome-icon :icon="['fas', 'external-link-alt']" />
+        </b-button>
+
         <b-button
           data-test-id="button-edit-reminder"
           variant="link"
@@ -127,6 +138,9 @@ export default {
     makeTooltip ({ remindAt }) {
       return fmt.fullDateTime(remindAt)
     },
+    recordViewer (params) {
+      return { name: 'page.record', params }
+    },
   },
 }
 </script>