Changes for tabs visibility and priority

- Priorities set for Graph, Lad Table, Scatter Plot, Telem Tables and Time List views.
- Changed several Inspector tab names to 'Config'; tests and other code changed to target `key` instead of `name`:
  - LAD Table
  - Time List - will need regression testing for change noted re. `key` above.
- Created browse mode read-only Inspector views:
  - LAD Table, Lad Table set.
  - Telemetry Table.
  and `showTab` functions; `showTab` has just been set to true for now.
to prevent it from displaying when no filters can be set.
- Changed AnnotationsViewProvider.js canView to return false if editor.isEditing.
- Plot plugin.js now adds configuration.objectStyles {} for overlay and stacked plots on initialize.
- FiltersView now displays a message for telem sources that don't have filter criteria available.
- Code cleanup in FiltersInspectorViewProvider.js to remove metadata checks that never evaluated.
- Annotations tab now set to never display when a view is being edited.

e2e/helper/planningUtils.js

@@ -224,7 +224,7 @@ export async function createTimelistWithPlanAndSetActivityInProgress(page, planJ
   await page.getByRole('button', { name: 'Edit Object' }).click();
 
   // Find the display properties section in the inspector
-  await page.getByRole('tab', { name: 'View Properties' }).click();
+  await page.getByRole('tab', { name: 'Config' }).click();
   // Switch to expanded view and save the setting
   await page.getByLabel('Display Style').selectOption({ label: 'Expanded' });
 

e2e/tests/functional/planning/timelist.e2e.spec.js

@@ -132,7 +132,7 @@ test("View a timelist in expanded view, verify all the activities are displayed
     await page.getByRole('button', { name: 'Edit Object' }).click();
 
     // Find the display properties section in the inspector
-    await page.getByRole('tab', { name: 'View Properties' }).click();
+    await page.getByRole('tab', { name: 'Config' }).click();
     // Switch to expanded view and save the setting
     await page.getByLabel('Display Style').selectOption({ label: 'Expanded' });
 

e2e/tests/functional/plugins/lad/lad.e2e.spec.js

@@ -53,7 +53,7 @@ test.describe('Testing LAD table configuration', () => {
   test('in edit mode, LAD Tables provide ability to hide columns', async ({ page }) => {
     // Edit LAD table
     await page.getByLabel('Edit Object').click();
-    await page.getByRole('tab', { name: 'LAD Table Configuration' }).click();
+    await page.getByRole('tab', { name: 'Config' }).click();
 
     // make sure headers are visible initially
     await expect(page.getByRole('columnheader', { name: 'Timestamp', exact: true })).toBeVisible();
@@ -114,7 +114,7 @@ test.describe('Testing LAD table configuration', () => {
 
     // Edit LAD table
     await page.getByLabel('Edit Object').click();
-    await page.getByRole('tab', { name: 'LAD Table Configuration' }).click();
+    await page.getByRole('tab', { key: 'lad-table-configuration' }).click();
 
     // show timestamp column
     await page.getByLabel('Timestamp', { exact: true }).check();
@@ -142,7 +142,7 @@ test.describe('Testing LAD table configuration', () => {
 
     // Edit LAD table
     await page.getByLabel('Edit Object').click();
-    await page.getByRole('tab', { name: 'LAD Table Configuration' }).click();
+    await page.getByRole('tab', { key: 'lad-table-configuration' }).click();
 
     // show units, type, and WATCH columns
     await page.getByLabel('Units').check();
@@ -182,7 +182,7 @@ test.describe('Testing LAD table configuration', () => {
 
     // Edit LAD table
     await page.getByLabel('Edit Object').click();
-    await page.getByRole('tab', { name: 'LAD Table Configuration' }).click();
+    await page.getByRole('tab', { key: 'lad-table-configuration' }).click();
 
     // make sure Sine Wave headers are visible initially too
     await expect(page.getByRole('columnheader', { name: 'Timestamp', exact: true })).toBeVisible();

src/plugins/LADTable/LADTableConfigurationViewProvider.js

@@ -27,7 +27,7 @@ import LadTableConfiguration from './components/LadTableConfiguration.vue';
 export default function LADTableConfigurationViewProvider(openmct) {
   return {
     key: 'lad-table-configuration',
-    name: 'LAD Table Configuration',
+    name: 'Config',
     canView(selection) {
       if (selection.length !== 1 || selection[0].length === 0) {
         return false;
@@ -61,7 +61,7 @@ export default function LADTableConfigurationViewProvider(openmct) {
           _destroy = destroy;
         },
         priority() {
-          return 1;
+          return openmct.editor.isEditing() ? openmct.priority.HIGH + 1 : openmct.priority.DEFAULT;
         },
         destroy() {
           if (_destroy) {

src/plugins/LADTable/components/LadTableConfiguration.vue

@@ -22,28 +22,24 @@
 
 <template>
   <div class="c-inspect-properties">
-    <template v-if="isEditing">
+    <div class="c-inspect-properties__header">Table Column Visibility</div>
-      <div class="c-inspect-properties__header">Table Column Visibility</div>
+    <ul class="c-inspect-properties__section">
-      <ul class="c-inspect-properties__section">
+      <li v-for="(title, key) in headers" :key="key" class="c-inspect-properties__row">
-        <li v-for="(title, key) in headers" :key="key" class="c-inspect-properties__row">
+        <div class="c-inspect-properties__label" title="Show or hide column">
-          <div class="c-inspect-properties__label" title="Show or hide column">
+          <label :for="key + 'ColumnControl'">{{ title }}</label>
-            <label :for="key + 'ColumnControl'">{{ title }}</label>
+        </div>
-          </div>
+        <div class="c-inspect-properties__value">
-          <div class="c-inspect-properties__value">
+          <input
-            <input
+            :id="key + 'ColumnControl'"
-              :id="key + 'ColumnControl'"
+            type="checkbox"
-              type="checkbox"
+            v-if="isEditing"
-              :checked="configuration.hiddenColumns[key] !== true"
+            :checked="configuration.hiddenColumns[key] !== true"
-              @change="toggleColumn(key)"
+            @change="toggleColumn(key)"
-            />
+          />
-          </div>
+          <span v-if="!isEditing && configuration.hiddenColumns[key] !== true">Visible</span>
-        </li>
+        </div>
-      </ul>
+      </li>
-    </template>
+    </ul>
-    <template v-else>
-      <div class="c-inspect-properties__header">LAD Table Configuration</div>
-      <div class="c-inspect-properties__row--span-all">Only available in edit mode.</div>
-    </template>
   </div>
 </template>
 

src/plugins/charts/bar/inspector/BarGraphInspectorViewProvider.js

@@ -41,7 +41,7 @@ export default function BarGraphInspectorViewProvider(openmct) {
           _destroy = destroy;
         },
         priority: function () {
-          return openmct.priority.HIGH + 1;
+          return openmct.editor.isEditing() ? openmct.priority.HIGH + 1 : openmct.priority.DEFAULT;
         },
         destroy: function () {
           if (_destroy) {

src/plugins/charts/scatter/inspector/ScatterPlotInspectorViewProvider.js

@@ -40,7 +40,7 @@ export default function ScatterPlotInspectorViewProvider(openmct) {
           _destroy = destroy;
         },
         priority: function () {
-          return openmct.priority.HIGH + 1;
+          return openmct.editor.isEditing() ? openmct.priority.HIGH + 1 : openmct.priority.DEFAULT;
         },
         destroy: function () {
           if (_destroy) {

src/plugins/filters/FiltersInspectorViewProvider.js

@@ -43,8 +43,6 @@ export default class FiltersInspectorViewProvider {
     let openmct = this.openmct;
     let _destroy = null;
 
-    const domainObject = selection?.[0]?.[0]?.context?.item;
-
     return {
       show: function (element) {
         const { destroy } = mount(
@@ -69,13 +67,6 @@ export default class FiltersInspectorViewProvider {
         if (isEditing) {
           return true;
         }
-
-        const metadata = openmct.telemetry.getMetadata(domainObject);
-        const metadataWithFilters = metadata
-          ? metadata.valueMetadatas.filter((value) => value.filters)
-          : [];
-
-        return metadataWithFilters.length;
       },
       priority: function () {
         return openmct.priority.DEFAULT;

src/plugins/filters/components/FiltersView.vue

@@ -38,6 +38,9 @@
       @update-filters="persistFilters"
     />
   </ul>
+  <span v-else>
+    This view doesn't include any parameters that have configured filter criteria.
+  </span>
 </template>
 
 <script>

src/plugins/inspectorViews/annotations/AnnotationsViewProvider.js

@@ -34,7 +34,7 @@ export default function AnnotationsViewProvider(openmct) {
       const domainObject = selectionContext?.item;
       const isLayoutItem = selectionContext?.layoutItem;
 
-      if (availableTags.length < 1 || isLayoutItem || !domainObject) {
+      if (availableTags.length < 1 || isLayoutItem || !domainObject || openmct.editor.isEditing()) {
         return false;
       }
 

src/plugins/inspectorViews/styles/StylesInspectorViewProvider.js

@@ -97,7 +97,7 @@ export default function StylesInspectorViewProvider(openmct) {
           _destroy = destroy;
         },
         priority: function () {
-          return openmct.priority.DEFAULT;
+          return openmct.editor.isEditing() ? openmct.priority.DEFAULT : openmct.priority.LOW;
         },
         destroy: function () {
           if (_destroy) {

src/plugins/plot/inspector/StackedPlotsInspectorViewProvider.js

@@ -50,7 +50,7 @@ export default function StackedPlotsInspectorViewProvider(openmct) {
           _destroy = destroy;
         },
         priority: function () {
-          return openmct.priority.HIGH + 1;
+          return openmct.editor.isEditing() ? openmct.priority.HIGH + 1 : openmct.priority.DEFAULT;
         },
         destroy: function () {
           if (_destroy) {

src/plugins/plot/plugin.js

@@ -42,7 +42,8 @@ export default function () {
         domainObject.composition = [];
         domainObject.configuration = {
           //series is an array of objects of type: {identifier, series: {color...}, yAxis:{}}
-          series: []
+          series: [],
+          objectStyles: {}
         };
       },
       priority: 891
@@ -60,7 +61,8 @@ export default function () {
         domainObject.configuration = {
           series: [],
           yAxis: {},
-          xAxis: {}
+          xAxis: {},
+          objectStyles: {}
         };
       },
       priority: 890

src/plugins/telemetryTable/TableConfigurationViewProvider.js

@@ -66,10 +66,10 @@ export default function TableConfigurationViewProvider(openmct, options) {
           _destroy = destroy;
         },
         showTab: function (isEditing) {
-          return isEditing;
+          return true;
         },
         priority: function () {
-          return 1;
+          return openmct.editor.isEditing() ? openmct.priority.HIGH + 1 : openmct.priority.DEFAULT;
         },
         destroy: function () {
           if (_destroy) {

src/plugins/telemetryTable/components/TableConfiguration.vue

@@ -21,53 +21,57 @@
 -->
 <template>
   <div class="c-inspect-properties">
-    <template v-if="isEditing">
+    <div class="c-inspect-properties__header">Layout</div>
-      <div class="c-inspect-properties__header">Layout</div>
+    <ul class="c-inspect-properties__section">
-      <ul class="c-inspect-properties__section">
+      <li class="c-inspect-properties__row">
-        <li class="c-inspect-properties__row">
+        <div class="c-inspect-properties__label" title="Auto-size table">
-          <div class="c-inspect-properties__label" title="Auto-size table">
+          <label for="AutoSizeControl">Auto-size</label>
-            <label for="AutoSizeControl">Auto-size</label>
+        </div>
-          </div>
+        <div class="c-inspect-properties__value">
-          <div class="c-inspect-properties__value">
+          <input
-            <input
+            v-if="isEditing"
-              id="AutoSizeControl"
+            id="AutoSizeControl"
-              type="checkbox"
+            type="checkbox"
-              :checked="configuration.autosize !== false"
+            :checked="configuration.autosize !== false"
-              @change="toggleAutosize()"
+            @change="toggleAutosize()"
-            />
+          />
-          </div>
+          <span v-if="!isEditing && configuration.autosize !== false">Enabled</span>
-        </li>
+        </div>
-        <li class="c-inspect-properties__row">
+      </li>
-          <div class="c-inspect-properties__label" title="Show or hide headers">
+      <li class="c-inspect-properties__row">
-            <label for="header-visibility">Hide Header</label>
+        <div class="c-inspect-properties__label" title="Show or hide headers">
-          </div>
+          <label for="header-visibility">Hide Header</label>
-          <div class="c-inspect-properties__value">
+        </div>
-            <input
+        <div class="c-inspect-properties__value">
-              id="header-visibility"
+          <input
-              type="checkbox"
+            v-if="isEditing"
-              :checked="configuration.hideHeaders === true"
+            id="header-visibility"
-              @change="toggleHeaderVisibility"
+            type="checkbox"
-            />
+            :checked="configuration.hideHeaders === true"
-          </div>
+            @change="toggleHeaderVisibility"
-        </li>
+          />
-      </ul>
+          <span v-if="!isEditing && configuration.hideHeaders === true">True</span>
-      <div class="c-inspect-properties__header">Columns</div>
+        </div>
-      <ul class="c-inspect-properties__section">
+      </li>
-        <li v-for="(title, key) in headers" :key="key" class="c-inspect-properties__row">
+    </ul>
-          <div class="c-inspect-properties__label" title="Show or hide column">
+    <div class="c-inspect-properties__header">Columns</div>
-            <label :for="key + 'ColumnControl'">{{ title }}</label>
+    <ul class="c-inspect-properties__section">
-          </div>
+      <li v-for="(title, key) in headers" :key="key" class="c-inspect-properties__row">
-          <div class="c-inspect-properties__value">
+        <div class="c-inspect-properties__label" title="Show or hide column">
-            <input
+          <label :for="key + 'ColumnControl'">{{ title }}</label>
-              :id="key + 'ColumnControl'"
+        </div>
-              type="checkbox"
+        <div class="c-inspect-properties__value">
-              :checked="configuration.hiddenColumns[key] !== true"
+          <input
-              @change="toggleColumn(key)"
+            v-if="isEditing"
-            />
+            :id="key + 'ColumnControl'"
-          </div>
+            type="checkbox"
-        </li>
+            :checked="configuration.hiddenColumns[key] !== true"
-      </ul>
+            @change="toggleColumn(key)"
-    </template>
+          />
+          <span v-if="!isEditing && configuration.hiddenColumns[key] !== true">Visible</span>
+        </div>
+      </li>
+    </ul>
   </div>
 </template>
 

src/plugins/timelist/inspector/TimeListInspectorViewProvider.js

@@ -28,7 +28,7 @@ import TimelistPropertiesView from './TimelistPropertiesView.vue';
 export default function TimeListInspectorViewProvider(openmct) {
   return {
     key: 'timelist-inspector',
-    name: 'View Properties',
+    name: 'Config',
     canView: function (selection) {
       if (selection.length === 0 || selection[0].length === 0) {
         return false;
@@ -63,7 +63,7 @@ export default function TimeListInspectorViewProvider(openmct) {
           _destroy = destroy;
         },
         priority: function () {
-          return openmct.priority.HIGH + 1;
+          return openmct.editor.isEditing() ? openmct.priority.HIGH + 1 : openmct.priority.DEFAULT;
         },
         destroy: function () {
           if (_destroy) {