[Inspector Tabs] Updates

.cspell.json

@@ -484,7 +484,8 @@
     "darkmatter",
     "Undeletes",
     "SSSZ",
-    "pageerror"
+    "pageerror",
+    "annotatable"
   ],
   "dictionaries": ["npm", "softwareTerms", "node", "html", "css", "bash", "en_US", "en-gb", "misc"],
   "ignorePaths": [

e2e/tests/functional/ui/inspector.e2e.spec.js

@@ -59,7 +59,7 @@ const viewsTabsMatrix = {
     Browse: ['Properties', 'Annotations']
   },
   'Flexible Layout': {
-    Browse: ['Properties', 'Elements'],
+    Browse: ['Properties', 'Elements', 'Styles'],
     Edit: ['Elements', 'Styles', 'Properties']
   },
   Folder: {
@@ -74,7 +74,7 @@ const viewsTabsMatrix = {
     Edit: ['Elements', 'Styles', 'Properties']
   },
   Graph: {
-    Browse: ['Properties', 'Config', 'Elements'],
+    Browse: ['Properties', 'Config', 'Elements', 'Styles'],
     Edit: ['Config', 'Elements', 'Styles', 'Properties']
   },
   Hyperlink: {
@@ -85,37 +85,37 @@ const viewsTabsMatrix = {
     }
   },
   'LAD Table': {
-    Browse: ['Properties', 'Config', 'Elements'],
+    Browse: ['Properties', 'Config', 'Elements', 'Styles'],
     Edit: ['Config', 'Elements', 'Styles', 'Properties']
   },
   'LAD Table Set': {
-    Browse: ['Properties', 'Config', 'Elements'],
+    Browse: ['Properties', 'Config', 'Elements', 'Styles'],
     Edit: ['Config', 'Elements', 'Styles', 'Properties']
   },
   Notebook: {
     Browse: ['Properties']
   },
   'Overlay Plot': {
-    Browse: ['Properties', 'Config', 'Annotations'],
+    Browse: ['Properties', 'Config', 'Annotations', 'Styles'],
     Edit: ['Config', 'Elements', 'Styles', 'Filters', 'Properties']
   },
   'Scatter Plot': {
-    Browse: ['Properties', 'Config', 'Elements'],
+    Browse: ['Properties', 'Config', 'Elements', 'Styles'],
     Edit: ['Config', 'Elements', 'Styles', 'Properties']
   },
   'Sine Wave Generator': {
     Browse: ['Properties', 'Annotations']
   },
   'Stacked Plot': {
-    Browse: ['Properties', 'Config', 'Annotations', 'Elements'],
+    Browse: ['Properties', 'Config', 'Annotations', 'Elements', 'Styles'],
     Edit: ['Config', 'Elements', 'Styles', 'Properties']
   },
   'Tabs View': {
     Browse: ['Properties', 'Elements', 'Styles'],
     Edit: ['Elements', 'Styles', 'Properties']
   },
   'Telemetry Table': {
-    Browse: ['Properties', 'Config', 'Elements'],
+    Browse: ['Properties', 'Config', 'Elements', 'Styles'],
     Edit: ['Config', 'Elements', 'Styles', 'Filters', 'Properties']
   },
   'Time List': {
@@ -131,54 +131,6 @@ const viewsTabsMatrix = {
   }
 };
 
-// TODO: need to implement uniqueItemMatrix tests
-// const uniqueItemMatrix = {
-//   'Display Layout Alphanumeric': {
-//     'Browse': ['Properties', 'Styles', 'Format'],
-//     'Edit': ['Styles', 'Format', 'Properties']
-//   },
-//   'Display Layout Drawing object *': {
-//     'Browse': ['Styles'],
-//     'Edit': ['Styles']
-//   },
-//   'Display Layout Child domain object': {
-//     'Browse': ['']
-//   },
-//   'Gantt Chart Activity': {
-//     'Browse': ['Activity']
-//   },
-//   'Notebook Entry': {
-//     'Browse': ['Properties', 'Annotations']
-//   },
-//   Plan: {
-//     'Browse': ['Properties']
-//   },
-//   'Plan Activity': {
-//     'Browse': ['Activity']
-//   },
-//   'View-only Plot View': {
-//     'Browse': ['Properties', 'Annotations']
-//   },
-//   'Stacked Plot Child plot': {
-//     'Browse': ['']
-//   },
-//   'View-only Telemetry Table': {
-//     'Browse': ['Properties']
-//   },
-//   'Time List Activity': {
-//     'Browse': ['Activity']
-//   },
-//   'Time Strip Activity': {
-//     'Browse': ['Activity']
-//   },
-//   'Web Page': {
-//     Browse: ['Properties'],
-//     required: {
-//       url: 'http://www.google.com'
-//     }
-// }
-// };
-
 test.describe('Inspector tests', () => {
   test.beforeEach(async ({ page }) => {
     await page.goto('./', { waitUntil: 'domcontentloaded' });

src/api/annotation/AnnotationAPI.js

@@ -95,7 +95,6 @@ export default class AnnotationAPI extends EventEmitter {
     this.availableTags = {};
     this.namespaceToSaveAnnotations = '';
     this.#targetComparatorMap = new Map();
-    this.annotatableTypes = [];
 
     this.ANNOTATION_TYPES = ANNOTATION_TYPES;
     this.ANNOTATION_TYPE = ANNOTATION_TYPE;
@@ -116,17 +115,6 @@ export default class AnnotationAPI extends EventEmitter {
         domainObject.annotationType = domainObject.annotationType || 'plotspatial';
       }
     });
-
-    this.openmct.on('start', () => {
-      const types = this.openmct.types.getTypes();
-      const typeKeys = Object.keys(types);
-
-      typeKeys.forEach((key) => {
-        if (types[key].definition.annotatable) {
-          this.annotatableTypes.push(key);
-        }
-      });
-    });
   }
   /**
    * Creates an annotation on a given domain object (e.g., a plot) and a set of targets (e.g., telemetry objects)
@@ -601,6 +589,8 @@ export default class AnnotationAPI extends EventEmitter {
    * @returns {boolean} Returns true if the type is annotatable
    */
   isAnnotatableType(type) {
-    return this.annotatableTypes.some((annotatableType) => annotatableType === type);
+    const types = this.openmct.types.getAllTypes();
+
+    return types[type]?.definition?.annotatable;
   }
 }

src/api/types/TypeRegistry.js

@@ -93,7 +93,7 @@ export default class TypeRegistry {
    * List all registered types.
    * @returns {Type[]} all registered types
    */
-  getTypes() {
+  getAllTypes() {
     return this.types;
   }
   /**

src/plugins/LADTable/components/LadTableConfiguration.vue

@@ -30,9 +30,9 @@
         </div>
         <div class="c-inspect-properties__value">
           <input
+            v-if="isEditing"
             :id="key + 'ColumnControl'"
             type="checkbox"
-            v-if="isEditing"
             :checked="configuration.hiddenColumns[key] !== true"
             @change="toggleColumn(key)"
           />
@@ -147,8 +147,8 @@
       this.ladTableObjects.push(ladTable);
 
       const composition = this.openmct.composition.get(ladTable.domainObject);
       composition.on('add', this.addItem);
       composition.on('remove', this.removeItem);
       composition.load();
 
       this.compositions.push({

src/plugins/conditionWidget/components/ConditionWidget.vue

@@ -79,13 +79,6 @@ export default {
   },
   mounted() {
     if (this.domainObject) {
-      if (!this.domainObject.configuration) {
-        // older versions didn't initialize configuration
-        this.domainObject.configuration = {
-          objectStyles: {}
-        };
-      }
-
       this.listenToConditionSetChanges();
     }
   },

src/plugins/conditionWidget/conditionWidgetStylesInterceptor.js

@@ -0,0 +1,40 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2024, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+export default function conditionWidgetStylesInterceptor(openmct) {
+  return {
+    appliesTo: (identifier, domainObject) => {
+      return domainObject?.type === 'conditionWidget' && !domainObject.configuration?.objectStyles;
+    },
+    invoke: (identifier, domainObject) => {
+      if (!domainObject.configuration) {
+        domainObject.configuration = {};
+      }
+
+      domainObject.configuration.objectStyles = {};
+
+      openmct.objects.save(domainObject);
+
+      return domainObject;
+    }
+  };
+}

src/plugins/conditionWidget/plugin.js

@@ -20,11 +20,13 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
+import conditionWidgetStylesInterceptor from './conditionWidgetStylesInterceptor.js';
 import ConditionWidgetViewProvider from './ConditionWidgetViewProvider.js';
 
 export default function plugin() {
   return function install(openmct) {
     openmct.objectViews.addProvider(new ConditionWidgetViewProvider(openmct));
+    openmct.objects.addGetInterceptor(conditionWidgetStylesInterceptor(openmct));
 
     openmct.types.addType('conditionWidget', {
       key: 'conditionWidget',

src/plugins/inspectorViews/styles/StylesInspectorViewProvider.js

@@ -87,19 +87,6 @@ export default function StylesInspectorViewProvider(openmct) {
     },
     view: function (selection) {
       let _destroy = null;
-      const objectSelection = selection?.[0];
-      const objectContext = objectSelection?.[0]?.context;
-      const domainObject = objectContext?.item;
-      const onlyEditMode = [
-        'flexible-layout',
-        'LadTable',
-        'LadTableSet',
-        'table',
-        'telemetry.plot.bar-graph',
-        'telemetry.plot.overlay',
-        'telemetry.plot.stacked',
-        'telemetry.plot.scatter-plot'
-      ].includes(domainObject?.type);
 
       return {
         show: function (element) {
@@ -124,10 +111,6 @@ export default function StylesInspectorViewProvider(openmct) {
           _destroy = destroy;
         },
         showTab: function (isEditing) {
-          if (onlyEditMode && !isEditing) {
-            return false;
-          }
-
           return true;
         },
         priority: function () {

src/plugins/interceptors/missingObjectInterceptor.js

@@ -38,6 +38,7 @@ export default function MissingObjectInterceptor(openmct) {
       }
 
       return object;
-    }
+    },
+    priority: openmct.priority.HIGH + 1 // this should be the first interceptor to run
   });
 }

src/plugins/plot/PlotView.vue

@@ -165,15 +165,6 @@ export default {
   created() {
     eventHelpers.extend(this);
     this.imageExporter = new ImageExporter(this.openmct);
-
-    // Initialize objectStyles for overlay plot if it doesn't exist
-    if (
-      this.domainObject.type === 'telemetry.plot.overlay' &&
-      !this.domainObject.configuration.objectStyles
-    ) {
-      this.domainObject.configuration.objectStyles = {};
-    }
-
     this.loadComposition();
     this.setupClockChangedEvent((domainObject) => {
       this.triggerUnsubscribeFromStaleness(domainObject);

src/plugins/plot/overlayPlot/overlayPlotStylesInterceptor.js

@@ -0,0 +1,43 @@
+/*****************************************************************************
+ * Open MCT, Copyright (c) 2014-2024, United States Government
+ * as represented by the Administrator of the National Aeronautics and Space
+ * Administration. All rights reserved.
+ *
+ * Open MCT is licensed under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0.
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
+ * License for the specific language governing permissions and limitations
+ * under the License.
+ *
+ * Open MCT includes source code licensed under additional open source
+ * licenses. See the Open Source Licenses file (LICENSES.md) included with
+ * this source code distribution or the Licensing information page available
+ * at runtime from the About dialog for additional information.
+ *****************************************************************************/
+
+export default function overlayPlotStylesInterceptor(openmct) {
+  return {
+    appliesTo: (identifier, domainObject) => {
+      return (
+        domainObject?.type === 'telemetry.plot.overlay' &&
+        !domainObject?.configuration?.objectStyles
+      );
+    },
+    invoke: (identifier, domainObject) => {
+      if (!domainObject.configuration) {
+        domainObject.configuration = {};
+      }
+
+      domainObject.configuration.objectStyles = {};
+
+      openmct.objects.save(domainObject);
+
+      return domainObject;
+    }
+  };
+}

src/plugins/plot/plugin.js

@@ -23,6 +23,7 @@ import PlotViewActions from './actions/ViewActions.js';
 import PlotsInspectorViewProvider from './inspector/PlotsInspectorViewProvider.js';
 import StackedPlotsInspectorViewProvider from './inspector/StackedPlotsInspectorViewProvider.js';
 import OverlayPlotCompositionPolicy from './overlayPlot/OverlayPlotCompositionPolicy.js';
+import overlayPlotStylesInterceptor from './overlayPlot/overlayPlotStylesInterceptor.js';
 import OverlayPlotViewProvider from './overlayPlot/OverlayPlotViewProvider.js';
 import PlotViewProvider from './PlotViewProvider.js';
 import StackedPlotCompositionPolicy from './stackedPlot/StackedPlotCompositionPolicy.js';
@@ -50,6 +51,8 @@ export default function () {
       priority: 891
     });
 
+    openmct.objects.addGetInterceptor(overlayPlotStylesInterceptor(openmct));
+
     openmct.types.addType('telemetry.plot.stacked', {
       key: 'telemetry.plot.stacked',
       name: 'Stacked Plot',

src/plugins/plot/stackedPlot/StackedPlot.vue

@@ -147,11 +147,6 @@ export default {
     this.config = this.getConfig(configId);
     this.showLegendsForChildren = this.config.legend.get('showLegendsForChildren');
 
-    // Initialize objectStyles if it doesn't exist
-    if (!this.domainObject.configuration.objectStyles) {
-      this.domainObject.configuration.objectStyles = {};
-    }
-
     this.loaded = true;
     this.imageExporter = new ImageExporter(this.openmct);