Remove snapshot (#6887)

* created a throttle util and using it in timer plugin to throttle refreshing the timer domain object

* Simplify timer logic

* Clarify code a little

* refactor: lint:fix

* Fix linting issue

---------

Co-authored-by: Andrew Henry <akhenry@gmail.com>
Co-authored-by: Jamie V <jamie.j.vigliotta@nasa.gov>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "openmct",
-  "version": "3.0.0-SNAPSHOT",
+  "version": "3.0.0",
   "description": "The Open MCT core platform",
   "devDependencies": {
     "@babel/eslint-parser": "7.22.5",

src/api/time/TimeContext.js

@@ -42,6 +42,7 @@ class TimeContext extends EventEmitter {
     this.activeClock = undefined;
     this.offsets = undefined;
     this.mode = undefined;
+    this.warnCounts = {};
 
     this.tick = this.tick.bind(this);
   }
@@ -648,6 +649,17 @@ class TimeContext extends EventEmitter {
   }
 
   #warnMethodDeprecated(method, newMethod) {
+    const MAX_CALLS = 1; // Only warn once per unique method and newMethod combination
+
+    const key = `${method}.${newMethod}`;
+    const currentWarnCount = this.warnCounts[key] || 0;
+
+    if (currentWarnCount >= MAX_CALLS) {
+      return; // Don't warn if already warned once
+    }
+
+    this.warnCounts[key] = currentWarnCount + 1;
+
     let message = `[DEPRECATION WARNING]: The ${method} API method is deprecated and will be removed in a future version of Open MCT.`;
 
     if (newMethod) {

src/plugins/plot/chart/MctChart.vue

@@ -42,7 +42,8 @@ import configStore from '../configuration/ConfigStore';
 import PlotConfigurationModel from '../configuration/PlotConfigurationModel';
 import LimitLine from './LimitLine.vue';
 import LimitLabel from './LimitLabel.vue';
-import Vue from 'vue';
+import mount from 'utils/mount';
+import { toRaw } from 'vue';
 
 const MARKER_SIZE = 6.0;
 const HIGHLIGHT_SIZE = MARKER_SIZE * 2.0;
@@ -315,7 +316,7 @@ export default {
         return;
       }
 
-      const elements = this.seriesElements.get(series);
+      const elements = this.seriesElements.get(toRaw(series));
       elements.lines.forEach(function (line) {
         this.lines.splice(this.lines.indexOf(line), 1);
         line.destroy();
@@ -333,7 +334,7 @@ export default {
         return;
       }
 
-      const elements = this.seriesElements.get(series);
+      const elements = this.seriesElements.get(toRaw(series));
       if (elements.alarmSet) {
         elements.alarmSet.destroy();
         this.alarmSets.splice(this.alarmSets.indexOf(elements.alarmSet), 1);
@@ -349,7 +350,7 @@ export default {
         return;
       }
 
-      const elements = this.seriesElements.get(series);
+      const elements = this.seriesElements.get(toRaw(series));
       elements.pointSets.forEach(function (pointSet) {
         this.pointSets.splice(this.pointSets.indexOf(pointSet), 1);
         pointSet.destroy();
@@ -473,7 +474,7 @@ export default {
       this.$emit('plotReinitializeCanvas');
     },
     removeChartElement(series) {
-      const elements = this.seriesElements.get(series);
+      const elements = this.seriesElements.get(toRaw(series));
 
       elements.lines.forEach(function (line) {
         this.lines.splice(this.lines.indexOf(line), 1);
@@ -488,7 +489,7 @@ export default {
         this.alarmSets.splice(this.alarmSets.indexOf(elements.alarmSet), 1);
       }
 
-      this.seriesElements.delete(series);
+      this.seriesElements.delete(toRaw(series));
 
       this.clearLimitLines(series);
     },
@@ -554,7 +555,7 @@ export default {
         this.alarmSets.push(elements.alarmSet);
       }
 
-      this.seriesElements.set(series, elements);
+      this.seriesElements.set(toRaw(series), elements);
     },
     makeLimitLines(series) {
       this.clearLimitLines(series);
@@ -573,10 +574,10 @@ export default {
         this.limitLines.push(limitLine);
       }
 
-      this.seriesLimits.set(series, limitElements);
+      this.seriesLimits.set(toRaw(series), limitElements);
     },
     clearLimitLines(series) {
-      const seriesLimits = this.seriesLimits.get(series);
+      const seriesLimits = this.seriesLimits.get(toRaw(series));
 
       if (seriesLimits) {
         seriesLimits.limitLines.forEach(function (line) {
@@ -584,7 +585,7 @@ export default {
           line.destroy();
         }, this);
 
-        this.seriesLimits.delete(series);
+        this.seriesLimits.delete(toRaw(series));
       }
     },
     canDraw(yAxisId) {
@@ -747,16 +748,14 @@ export default {
         left: 0,
         top: this.drawAPI.y(limit.point.y)
       };
-      let LimitLineClass = Vue.extend(LimitLine);
-      const component = new LimitLineClass({
-        propsData: {
+      const { vNode } = mount(LimitLine, {
+        props: {
           point,
           limit
         }
       });
-      component.$mount();
 
-      return component.$el;
+      return vNode.el;
     },
     getLimitOverlap(limit, overlapMap) {
       //calculate if limit lines are too close to each other
@@ -792,16 +791,14 @@ export default {
         left: 0,
         top: this.drawAPI.y(limit.point.y)
       };
-      let LimitLabelClass = Vue.extend(LimitLabel);
-      const component = new LimitLabelClass({
-        propsData: {
+      const { vNode } = mount(LimitLabel, {
+        props: {
           limit: Object.assign({}, overlap, limit),
           point
         }
       });
-      component.$mount();
 
-      return component.$el;
+      return vNode.el;
     },
     drawAlarmPoints(alarmSet) {
       this.drawAPI.drawLimitPoints(

src/plugins/timer/components/Timer.vue

@@ -43,9 +43,11 @@
 
 <script>
 import raf from 'utils/raf';
+import throttle from '../../../utils/throttle';
 
 const moment = require('moment-timezone');
 const momentDurationFormatSetup = require('moment-duration-format');
+const refreshRateSeconds = 2;
 
 momentDurationFormatSetup(moment);
 
@@ -68,38 +70,21 @@ export default {
     };
   },
   computed: {
-    relativeTimestamp() {
-      let relativeTimestamp;
-      if (this.configuration && this.configuration.timestamp) {
-        relativeTimestamp = moment(this.configuration.timestamp).toDate();
-      } else if (this.configuration && this.configuration.timestamp === undefined) {
-        relativeTimestamp = undefined;
-      }
-
-      return relativeTimestamp;
-    },
     timeDelta() {
-      return this.lastTimestamp - this.relativeTimestamp;
+      if (this.configuration.pausedTime) {
+        return Date.parse(this.configuration.pausedTime) - this.startTimeMs;
+      } else {
+        return this.lastTimestamp - this.startTimeMs;
+      }
+    },
+    startTimeMs() {
+      return Date.parse(this.configuration.timestamp);
     },
     timeTextValue() {
-      if (isNaN(this.timeDelta)) {
-        return null;
-      }
-
       const toWholeSeconds = Math.abs(Math.floor(this.timeDelta / 1000) * 1000);
 
       return moment.duration(toWholeSeconds, 'ms').format(this.format, { trim: false });
     },
-    pausedTime() {
-      let pausedTime;
-      if (this.configuration && this.configuration.pausedTime) {
-        pausedTime = moment(this.configuration.pausedTime).toDate();
-      } else if (this.configuration && this.configuration.pausedTime === undefined) {
-        pausedTime = undefined;
-      }
-
-      return pausedTime;
-    },
     timerState() {
       let timerState = 'started';
       if (this.configuration && this.configuration.timerState) {
@@ -179,13 +164,9 @@ export default {
     }
   },
   mounted() {
-    this.unobserve = this.openmct.objects.observe(
-      this.domainObject,
-      'configuration',
-      (configuration) => {
-        this.configuration = configuration;
-      }
-    );
+    this.unobserve = this.openmct.objects.observe(this.domainObject, '*', (domainObject) => {
+      this.configuration = domainObject.configuration;
+    });
     this.$nextTick(() => {
       if (!this.configuration?.timerState) {
         const timerAction = !this.relativeTimestamp ? 'stop' : 'start';
@@ -193,6 +174,7 @@ export default {
       }
 
       this.handleTick = raf(this.handleTick);
+      this.refreshTimerObject = throttle(this.refreshTimerObject, refreshRateSeconds * 1000);
       this.openmct.time.on('tick', this.handleTick);
 
       this.viewActionsCollection = this.openmct.actions.getActionsCollection(
@@ -210,15 +192,11 @@ export default {
   },
   methods: {
     handleTick() {
-      const isTimerRunning = !['paused', 'stopped'].includes(this.timerState);
-
-      if (isTimerRunning) {
-        this.lastTimestamp = new Date(this.openmct.time.now());
-      }
-
-      if (this.timerState === 'paused' && !this.lastTimestamp) {
-        this.lastTimestamp = this.pausedTime;
-      }
+      this.lastTimestamp = new Date(this.openmct.time.now());
+      this.refreshTimerObject();
+    },
+    refreshTimerObject() {
+      this.openmct.objects.refresh(this.domainObject);
     },
     restartTimer() {
       this.triggerAction('timer.restart');

src/utils/throttle.js

@@ -0,0 +1,34 @@
+/**
+ * Creates a throttled function that only invokes the provided function at most once every
+ * specified number of milliseconds. Subsequent calls within the waiting period will be ignored.
+ * @param {Function} func The function to throttle.
+ * @param {number} wait The number of milliseconds to wait between successive calls to the function.
+ * @return {Function} Returns the new throttled function.
+ */
+export default function throttle(func, wait) {
+  let timeout;
+  let result;
+  let previous = 0;
+
+  return function (...args) {
+    const now = new Date().getTime();
+    const remaining = wait - (now - previous);
+
+    if (remaining <= 0 || remaining > wait) {
+      if (timeout) {
+        clearTimeout(timeout);
+        timeout = null;
+      }
+
+      previous = now;
+      result = func(...args);
+    } else if (!timeout) {
+      timeout = setTimeout(() => {
+        previous = new Date().getTime();
+        timeout = null;
+        result = func(...args);
+      }, remaining);
+    }
+    return result;
+  };
+}