ui works kinda

src/plugins/comps/CompsManager.js

@@ -26,7 +26,7 @@ export default class CompsManager extends EventEmitter {
       valueToUse: 'sin',
       testValue: 0
     });
-    this.persist();
+    this.persist(this.#domainObject);
   }
 
   getParameters() {
@@ -65,15 +65,15 @@ export default class CompsManager extends EventEmitter {
     this.persist();
   }
 
-  persist() {
+  persist(passedDomainObject) {
     this.#openmct.objects.mutate(
       this.#domainObject,
       'configuration.comps',
-      this.#domainObject.configuration.comps
+      passedDomainObject.configuration.comps
     );
     console.debug(
       `📦 CompsManager: persisted domain object`,
-      this.#domainObject.configuration.comps
+      passedDomainObject.configuration.comps
     );
   }
 
@@ -133,9 +133,9 @@ export default class CompsManager extends EventEmitter {
     return dataFrame;
   }
 
-  #removeTelemetryObject = (telemetryObject) => {
+  #removeTelemetryObject = (telemetryObjectIdentifier) => {
-    console.debug('❌ CompsManager: removeTelemetryObject', telemetryObject);
+    console.debug('❌ CompsManager: removeTelemetryObject', telemetryObjectIdentifier);
-    const keyString = this.#openmct.objects.makeKeyString(telemetryObject.identifier);
+    const keyString = this.#openmct.objects.makeKeyString(telemetryObjectIdentifier);
     delete this.#telemetryObjects[keyString];
     this.#telemetryCollections[keyString]?.destroy();
     delete this.#telemetryCollections[keyString];

src/plugins/comps/CompsMathWorker.js

@@ -7,24 +7,28 @@ onconnect = function (e) {
 
   port.onmessage = function (event) {
     console.debug('🧮 Comps Math Worker message:', event);
+    const { type, callbackID, telemetryForComps, expression, parameters } = event.data;
+    let responseType = 'unknown';
+    let error = null;
+    let result = [];
     try {
-      const { type, callbackID, telemetryForComps, expression, parameters } = event.data;
       if (type === 'calculateRequest') {
-        const result = calculateRequest(telemetryForComps, parameters, expression);
+        responseType = 'calculationRequestResult';
-        port.postMessage({ type: 'calculationRequestResult', callbackID, result });
+        result = calculateRequest(telemetryForComps, parameters, expression);
       } else if (type === 'calculateSubscription') {
-        const result = calculateSubscription(telemetryForComps, parameters, expression);
+        responseType = 'calculationSubscriptionResult';
-        if (result.length) {
+        result = calculateSubscription(telemetryForComps, parameters, expression);
-          port.postMessage({ type: 'calculationSubscriptionResult', callbackID, result });
-        }
       } else if (type === 'init') {
         port.postMessage({ type: 'ready' });
+        return;
       } else {
         throw new Error('Invalid message type');
       }
-    } catch (error) {
+    } catch (errorInCalculation) {
-      port.postMessage({ type: 'error', error });
+      error = errorInCalculation;
+      console.error('🧮 Comps Math Worker error:', errorInCalculation);
     }
+    port.postMessage({ type: responseType, callbackID, result, error });
   };
 };
 

src/plugins/comps/CompsTelemetryProvider.js

@@ -32,7 +32,7 @@ export default class CompsTelemetryProvider {
   constructor(openmct, compsManagerPool) {
     this.#openmct = openmct;
     this.#compsManagerPool = compsManagerPool;
-    this.#startSharedWorker();
+    this.#openmct.on('start', this.#startSharedWorker.bind(this));
   }
 
   isTelemetryObject(domainObject) {
@@ -124,16 +124,18 @@ export default class CompsTelemetryProvider {
   }
 
   onSharedWorkerMessage(event) {
-    const { type, result, callbackID } = event.data;
+    const { type, result, callbackID, error } = event.data;
     if (type === 'calculationSubscriptionResult' && this.#subscriptionCallbacks[callbackID]) {
       console.debug('📝 Shared worker subscription message:', event.data);
       this.#subscriptionCallbacks[callbackID](result);
     } else if (type === 'calculationRequestResult' && this.#requestPromises[callbackID]) {
       console.debug('📝 Shared worker request message:', event.data);
-      this.#requestPromises[callbackID].resolve(result);
+      if (error) {
+        this.#requestPromises[callbackID].reject(error);
+      } else {
+        this.#requestPromises[callbackID].resolve(result);
+      }
       delete this.#requestPromises[callbackID];
-    } else if (type === 'error') {
-      console.error('❌ Shared worker error:', event.data);
     }
   }
 

src/plugins/comps/components/CompsView.vue

@@ -54,28 +54,26 @@
           class="hint"
           :class="{ 's-status-icon-warning-lo': !domainObject.configuration.comps.parameters }"
         >
-          <div v-for="parameter in parameters" :key="parameter.name">
+          <div v-for="parameter in parameters" :key="parameter.name" class="telemery-reference">
-            <div>
+            Reference
-              Reference
+            <input v-model="parameter.name" @change="persistParameters" />
-              <input v-model="parameter.name" @change="compsManager.persist" />
+            <ObjectPath
-              <ObjectPath
+              :domain-object="compsManager.getTelemetryObjectForParameter(parameter.keyString)"
-                :domain-object="compsManager.getTelemetryObjectForParameter(parameter.keyString)"
+            />
-              />
+            {{ compsManager.getTelemetryObjectForParameter(parameter.keyString).name }}
-              {{ compsManager.getTelemetryObjectForParameter(parameter.keyString).name }}
+            <!-- drop down to select value from telemetry -->
-              <!-- drop down to select value from telemetry -->
+            <select v-model="parameter.valueToUse" @change="persistParameters">
-              <select v-model="parameter.valueToUse" @change="persistParameters">
+              <option
-                <option
+                v-for="parameterValueOption in compsManager.getMetaDataValuesForParameter(
-                  v-for="parameterValueOption in compsManager.getMetaDataValuesForParameter(
+                  parameter.keyString
-                    parameter.keyString
+                )"
-                  )"
+                :key="parameterValueOption.key"
-                  :key="parameterValueOption.key"
+                :value="parameterValueOption.key"
-                  :value="parameterValueOption.key"
+              >
-                >
+                {{ parameterValueOption.name }}
-                  {{ parameterValueOption.name }}
+              </option>
-                </option>
+            </select>
-              </select>
+            <input v-model="parameter.testValue" @change="persistParameters" />
-              <input v-model="parameter.testValue" @change="compsManager.persist" />
-            </div>
           </div>
           <template v-if="!domainObject.configuration.comps.parameters"
             >Drag telemetry into Telemetry References to add variables for an expression</template
@@ -129,20 +127,20 @@ onBeforeMount(async () => {
     telemetryProcessor(data);
   });
   outputTelemetryCollection.on('clear', clearData);
-  await outputTelemetryCollection.load();
   await compsManager.load();
   parameters.value = compsManager.getParameters();
   expression.value = compsManager.getExpression();
+  outputTelemetryCollection.load();
 });
 
 function persistParameters() {
   domainObject.configuration.comps.parameters = parameters.value;
-  compsManager.persist();
+  compsManager.persist(domainObject);
 }
 
 function persistExpression() {
   domainObject.configuration.comps.expression = expression.value;
-  compsManager.persist();
+  compsManager.persist(domainObject);
 }
 
 function applyTestData() {}

src/styles/vue-styles.scss

@@ -2,6 +2,7 @@
 @import '../api/overlays/components/overlay-component.scss';
 @import '../api/tooltips/components/tooltip-component.scss';
 @import '../plugins/condition/components/conditionals.scss';
+@import '../plugins/comps/components/comps.scss';
 @import '../plugins/conditionWidget/components/condition-widget.scss';
 @import '../plugins/condition/components/inspector/conditional-styles.scss';
 @import '../plugins/displayLayout/components/box-and-line-views';