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.
This commit is contained in:
Charles Hacskaylo 2025-01-17 11:49:10 -08:00
parent f4f010ac4f
commit 3527e4e4a1
16 changed files with 93 additions and 97 deletions

View File

@ -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' });

View File

@ -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' });

View File

@ -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();

View File

@ -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) {

View File

@ -22,28 +22,24 @@
<template>
<div class="c-inspect-properties">
<template v-if="isEditing">
<div class="c-inspect-properties__header">Table Column Visibility</div>
<ul class="c-inspect-properties__section">
<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">
<label :for="key + 'ColumnControl'">{{ title }}</label>
</div>
<div class="c-inspect-properties__value">
<input
:id="key + 'ColumnControl'"
type="checkbox"
:checked="configuration.hiddenColumns[key] !== true"
@change="toggleColumn(key)"
/>
</div>
</li>
</ul>
</template>
<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 class="c-inspect-properties__header">Table Column Visibility</div>
<ul class="c-inspect-properties__section">
<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">
<label :for="key + 'ColumnControl'">{{ title }}</label>
</div>
<div class="c-inspect-properties__value">
<input
:id="key + 'ColumnControl'"
type="checkbox"
v-if="isEditing"
:checked="configuration.hiddenColumns[key] !== true"
@change="toggleColumn(key)"
/>
<span v-if="!isEditing && configuration.hiddenColumns[key] !== true">Visible</span>
</div>
</li>
</ul>
</div>
</template>

View File

@ -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) {

View File

@ -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) {

View File

@ -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;

View File

@ -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>

View File

@ -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;
}

View File

@ -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) {

View File

@ -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) {

View File

@ -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

View File

@ -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) {

View File

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

View File

@ -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) {