From 966a4f5013ef07f010467ccc5c1c3dd85042f5ce Mon Sep 17 00:00:00 2001
From: Dannon Baker <dannon.baker@gmail.com>
Date: Fri, 22 Apr 2022 20:33:32 -0400
Subject: [PATCH] Swap SavedRulesSelector to use standard UtcDate component

---
 .../src/components/RuleBuilder/SavedRulesSelector.vue | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/client/src/components/RuleBuilder/SavedRulesSelector.vue b/client/src/components/RuleBuilder/SavedRulesSelector.vue
index 2acbeba2a39..d4e79dc3d9c 100644
--- a/client/src/components/RuleBuilder/SavedRulesSelector.vue
+++ b/client/src/components/RuleBuilder/SavedRulesSelector.vue
@@ -15,7 +15,8 @@
                 @click="$emit('update-rules', session.rule)"
                 v-b-tooltip.hover.right
                 :title="formatPreview(session.rule, index)"
-                >Saved rule from {{ formatDate(session.dateTime) }}
+                >Saved rule from
+                <UtcDate :date="session.dateTime" mode="elapsed" />
             </a>
         </div>
     </div>
@@ -25,8 +26,8 @@
 import Vue from "vue";
 import _l from "utils/localization";
 import BootstrapVue from "bootstrap-vue";
-import moment from "moment";
 import { RULES, MAPPING_TARGETS } from "mvc/rules/rule-definitions";
+import UtcDate from "components/UtcDate";
 
 Vue.use(BootstrapVue);
 export default {
@@ -35,6 +36,9 @@ export default {
             savedRulesMenu: _l("Recently used rules"),
         };
     },
+    components: {
+        UtcDate,
+    },
     props: {
         savedRules: {
             type: Array,
@@ -54,9 +58,6 @@ export default {
         },
     },
     methods: {
-        formatDate(dateTime) {
-            return moment.utc(dateTime).from(moment().utc());
-        },
         formatPreview(savedRuleJson, index) {
             let prettyString = "";
             let delim = "";