[Staleness] API and Component Functionality (#6108)

* initial telemetry api updates for staleness support

* modifying staleness to a subsription style

* fixing variable name

* debuggin

* put the subscribe in the wrong place

* stale class for object views

* temp cyan border for testing

* added staleness to swg, working on stacked plot staleness

* WIP: stacked plot staleness

* reverting, going a different route

* staleness on stacked plots

* plot legend staleness

* remove debug code

* staleness for alphanumerics

* lad table and table set staleness

* overlay plot staleness

* remove debug code

* hardened lad staleness functionality fixed plots without composition bug

* adding staleness to gauges

* renaming telemetry age check functionality so it does not conflict with new staleness functionality

* couple one-off fixes here and there, and WIP for condition sets, moving to telemetry tables to facilitate styling of completed components

* small fix on lad tables, added staleness functionality to tables

* finishing up condition sets

* some cleaning up

* adding border to condition sets when an item is stale

* fixing dub sub

* addressing PR comment, moving repeated code to a function

* robustified the SWG stalenes provider, little fixes here and there as far as cleaning up listeners and... whatnot

* removing debug code

* typo fixes

* cleanin up debug code

* created a simple stalenes mixin for more basic usage in components

* more robustification, if a new staleness subscription happens, will now send the current staleness value if we have it, beefed up example stalenes swg provider

* beefed up staleness mixin a bit to give it more use

* copyright

* cleanin up ladtable code

* cleanin up ladtable code

* cleaning up lad table sets

* some minor updates

* Closes #6109
- New staleness glyph and font CSS added.

* Closes #6109
- Normalized staleness colors as theme constants.
- New mixins for staleness application to view elements.
- Applied staleness styling to all relevant view elements.
- TODO: smoke-test in Show theme.

* adding staleness utils helper, mixin and isStale functionalirty for telemtry api

* Closes #6109
- Refined style for Snow theme.

* need to have one domainObject per stalenes utility

* making sure we handle domains correctly while dealing with staleness

* couple fixes

* moving abort controller logic to a spot where it makes more sense

* added some more info for the StalenesProvider interface docs

* returning undefinded for ifStale requests with no provider

* debuggin

* debuggin

* missed "isStale" call in condtioncollections

* removing debug code and using mixin unsubscribe in gauge

* fixing tests

* more targeted tree item click

Co-authored-by: Charles Hacskaylo <charlesh88@gmail.com>
Co-authored-by: Andrew Henry <akhenry@gmail.com>
Co-authored-by: Scott Bell <scott@traclabs.com>

src/plugins/displayLayout/components/TelemetryView.vue

@@ -31,7 +31,7 @@
     <div
         v-if="domainObject"
         class="c-telemetry-view u-style-receiver"
-        :class="[statusClass]"
+        :class="[itemClasses]"
         :style="styleObject"
         :data-font-size="item.fontSize"
         :data-font="item.font"
@@ -73,6 +73,7 @@
 <script>
 import LayoutFrame from './LayoutFrame.vue';
 import conditionalStylesMixin from "../mixins/objectStyles-mixin";
+import stalenessMixin from '@/ui/mixins/staleness-mixin';
 import { getDefaultNotebook, getNotebookSectionAndPage } from '@/plugins/notebook/utils/notebook-storage.js';
 
 const DEFAULT_TELEMETRY_DIMENSIONS = [10, 5];
@@ -102,7 +103,7 @@ export default {
     components: {
         LayoutFrame
     },
-    mixins: [conditionalStylesMixin],
+    mixins: [conditionalStylesMixin, stalenessMixin],
     inject: ['openmct', 'objectPath', 'currentView'],
     props: {
         item: {
@@ -137,8 +138,18 @@ export default {
         };
     },
     computed: {
-        statusClass() {
-            return (this.status) ? `is-status--${this.status}` : '';
+        itemClasses() {
+            let classes = [];
+
+            if (this.status) {
+                classes.push(`is-status--${this.status}`);
+            }
+
+            if (this.isStale) {
+                classes.push('is-stale');
+            }
+
+            return classes;
         },
         showLabel() {
             let displayMode = this.item.displayMode;
@@ -310,6 +321,7 @@ export default {
             this.removeSelectable = this.openmct.selection.selectable(
                 this.$el, this.context, this.immediatelySelect || this.initSelect);
             delete this.immediatelySelect;
+            this.subscribeToStaleness(this.domainObject);
         },
         updateTelemetryFormat(format) {
             this.customStringformatter.setFormat(format);

src/plugins/displayLayout/components/telemetry-view.scss

@@ -25,6 +25,12 @@
         margin-right: $interiorMargin;
     }
 
+    &.is-stale {
+        .c-telemetry-view__value {
+            @include isStaleElement();
+        }
+    }
+
     .c-frame & {
         @include abs();
         border: 1px solid transparent;