use reactive clock props

cleanup unused variables

src/plugins/timeConductor/ConductorClock.vue

@@ -48,16 +48,14 @@ export default {
       }
     }
   },
-  data() {
-    return {
-      clocks: this.getAllClockMetadata(this.configuration.menuOptions)
-    };
-  },
   computed: {
     selectedClock() {
       return this.getClockMetadata(this.clock);
     }
   },
+  mounted() {
+    this.clocks = this.getAllClockMetadata(this.configuration.menuOptions);
+  },
   methods: {
     showClocksMenu() {
       const elementBoundingClientRect = this.$refs.clockButton.getBoundingClientRect();

src/plugins/timeConductor/ConductorMode.vue

@@ -44,16 +44,7 @@
 
 <script>
 export default {
-  inject: [
+  inject: ['openmct', 'timeMode', 'getAllModeMetadata', 'getModeMetadata'],
-    'openmct',
-    'configuration',
-    'bounds',
-    'offsets',
-    'timeMode',
-    'isFixedTimeMode',
-    'getAllModeMetadata',
-    'getModeMetadata'
-  ],
   props: {
     readOnly: {
       type: Boolean,

src/plugins/timeConductor/ConductorPopUp.vue

@@ -5,8 +5,6 @@
         v-if="isIndependent"
         class="c-conductor__mode-select"
         title="Sets the Time Conductor's mode."
-        :mode="timeOptionMode"
-        @independent-mode-updated="saveIndependentMode"
       />
       <ConductorMode
         v-else
@@ -17,8 +15,6 @@
         v-if="isIndependent"
         class="c-conductor__mode-select"
         title="Sets the Time Conductor's clock."
-        :clock="timeOptionClock"
-        @independent-clock-updated="saveIndependentClock"
       />
       <ConductorClock
         v-else
@@ -37,25 +33,12 @@
         title="Select and apply previously entered time intervals."
       />
     </div>
-    <conductor-inputs-fixed
+    <ConductorInputsFixed v-if="isFixedTimeMode" @dismiss-inputs-fixed="dismiss" />
-      v-if="isFixedTimeMode"
+    <ConductorInputsRealtime v-else @dismiss-inputs-realtime="dismiss" />
-      :input-bounds="bounds"
-      :object-path="objectPath"
-      @bounds-updated="saveFixedBounds"
-      @dismiss-inputs-fixed="dismiss"
-    />
-    <conductor-inputs-realtime
-      v-else
-      :input-bounds="bounds"
-      :object-path="objectPath"
-      @offsets-updated="saveClockOffsets"
-      @dismiss-inputs-realtime="dismiss"
-    />
   </div>
 </template>
 
 <script>
-import { TIME_CONTEXT_EVENTS } from '../../api/time/constants.js';
 import ConductorClock from './ConductorClock.vue';
 import ConductorHistory from './ConductorHistory.vue';
 import ConductorInputsFixed from './ConductorInputsFixed.vue';
@@ -92,45 +75,14 @@ export default {
         return false;
       }
     },
-    timeOptions: {
-      type: Object,
-      default() {
-        return undefined;
-      }
-    },
     bottom: {
       type: Boolean,
       default() {
         return false;
       }
-    },
-    objectPath: {
-      type: Array,
-      default() {
-        return [];
-      }
     }
   },
-  emits: [
+  emits: ['popup-loaded', 'dismiss'],
-    'popup-loaded',
-    'dismiss',
-    'independent-clock-updated',
-    'fixed-bounds-updated',
-    'clock-offsets-updated',
-    'independent-mode-updated'
-  ],
-  data() {
-    const bounds = this.openmct.time.getBounds();
-    const timeSystem = this.openmct.time.getTimeSystem();
-
-    return {
-      timeSystem,
-      bounds: {
-        start: bounds.start,
-        end: bounds.end
-      }
-    };
-  },
   computed: {
     position() {
       const position = {
@@ -149,74 +101,12 @@ export default {
       const independentClass = this.isIndependent ? 'itc-popout ' : '';
 
       return `${independentClass}${value}c-tc-input-popup--${mode}`;
-    },
-    timeOptionMode() {
-      return this.timeOptions?.mode;
-    },
-    timeOptionClock() {
-      return this.timeOptions?.clock;
-    }
-  },
-  watch: {
-    objectPath: {
-      handler(newPath, oldPath) {
-        //domain object or view has probably changed
-        if (newPath === oldPath) {
-          return;
-        }
-
-        this.setTimeContext();
-      },
-      deep: true
     }
   },
   mounted() {
     this.$emit('popup-loaded');
-    this.setTimeContext();
-  },
-  beforeUnmount() {
-    this.stopFollowingTimeContext();
   },
   methods: {
-    setTimeContext() {
-      if (this.timeContext) {
-        this.stopFollowingTimeContext();
-      }
-
-      this.timeContext = this.openmct.time.getContextForView(this.objectPath);
-
-      this.timeContext.on(TIME_CONTEXT_EVENTS.clockChanged, this.setViewFromClock);
-      this.timeContext.on(TIME_CONTEXT_EVENTS.boundsChanged, this.setBounds);
-
-      this.setViewFromClock(this.timeContext.getClock());
-      this.setBounds(this.timeContext.getBounds());
-    },
-    stopFollowingTimeContext() {
-      this.timeContext.off(TIME_CONTEXT_EVENTS.clockChanged, this.setViewFromClock);
-      this.timeContext.off(TIME_CONTEXT_EVENTS.boundsChanged, this.setBounds);
-    },
-    setViewFromClock() {
-      this.bounds = this.isFixedTimeMode
-        ? this.timeContext.getBounds()
-        : this.openmct.time.getClockOffsets();
-    },
-    setBounds(bounds, isTick) {
-      if (this.isFixedTimeMode || !isTick) {
-        this.bounds = bounds;
-      }
-    },
-    saveFixedBounds(bounds) {
-      this.$emit('fixed-bounds-updated', bounds);
-    },
-    saveClockOffsets(offsets) {
-      this.$emit('clock-offsets-updated', offsets);
-    },
-    saveIndependentMode(mode) {
-      this.$emit('independent-mode-updated', mode);
-    },
-    saveIndependentClock(clockKey) {
-      this.$emit('independent-clock-updated', clockKey);
-    },
     dismiss() {
       this.$emit('dismiss');
     }

src/plugins/timeConductor/independent/IndependentClock.vue

@@ -36,20 +36,9 @@
 </template>
 
 <script>
-import { TIME_CONTEXT_EVENTS } from '../../../api/time/constants.js';
-import toggleMixin from '../../../ui/mixins/toggle-mixin.js';
-import clockMixin from '../clock-mixin.js';
-
 export default {
-  mixins: [toggleMixin, clockMixin],
+  inject: ['openmct', 'clock', 'getAllClockMetadata', 'getClockMetadata'],
-  inject: ['openmct'],
   props: {
-    clock: {
-      type: String,
-      default() {
-        return undefined;
-      }
-    },
     enabled: {
       type: Boolean,
       default() {
@@ -57,33 +46,20 @@ export default {
       }
     }
   },
-  emits: ['independent-clock-updated'],
+  computed: {
-  data() {
+    selectedClock() {
-    const activeClock = this.getActiveClock();
+      return this.getClockMetadata(this.clock);
-
+    }
-    return {
-      selectedClock: activeClock ? this.getClockMetadata(activeClock) : undefined,
-      clocks: []
-    };
   },
   watch: {
-    clock(newClock, oldClock) {
-      this.setViewFromClock(newClock);
-    },
     enabled(newValue, oldValue) {
       if (newValue !== undefined && newValue !== oldValue && newValue === true) {
         this.setViewFromClock(this.clock);
       }
     }
   },
-  beforeUnmount() {
+  mounted() {
-    this.openmct.time.off(TIME_CONTEXT_EVENTS.clockChanged, this.setViewFromClock);
+    this.clocks = this.getAllClockMetadata();
-  },
-  mounted: function () {
-    this.loadClocks();
-    this.setViewFromClock(this.clock);
-
-    this.openmct.time.on(TIME_CONTEXT_EVENTS.clockChanged, this.setViewFromClock);
   },
   methods: {
     showClocksMenu() {
@@ -95,27 +71,11 @@ export default {
         menuClass: 'c-conductor__clock-menu c-super-menu--sm',
         placement: this.openmct.menus.menuPlacement.BOTTOM_RIGHT
       };
+
       this.openmct.menus.showSuperMenu(x, y, this.clocks, menuOptions);
     },
-    getMenuOptions() {
-      let currentGlobalClock = this.getActiveClock();
-
-      //Create copy of active clock so the time API does not get reactified.
-      currentGlobalClock = Object.assign(
-        {},
-        {
-          name: currentGlobalClock.name,
-          clock: currentGlobalClock.key,
-          timeSystem: this.openmct.time.getTimeSystem().key
-        }
-      );
-
-      return [currentGlobalClock];
-    },
     setClock(clockKey) {
       this.setViewFromClock(clockKey);
-
-      this.$emit('independent-clock-updated', clockKey);
     },
     setViewFromClock(clockOrKey) {
       let clock = clockOrKey;

src/plugins/timeConductor/independent/IndependentMode.vue

@@ -46,7 +46,7 @@ export default {
       }
     }
   },
-  data: function () {
+  data() {
     return {
       selectedMode: this.getModeMetadata(this.timeMode)
     };

src/plugins/timeConductor/useClock.js

@@ -66,10 +66,8 @@ export function useClock(openmct, objectPath) {
       ? menuOptions
           .map((menuOption) => menuOption.clock)
           .filter((key, index, array) => key !== undefined && array.indexOf(key) === index)
-          .map((clockKey) =>
+          .map((clockKey) => openmct.time.getAllClocks().find((_clock) => _clock.key === clockKey))
-            timeContext.value.getAllClocks().find((_clock) => _clock.key === clockKey)
+      : openmct.time.getAllClocks();
-          )
-      : timeContext.value.getAllClocks();
 
     const clockMetadata = clocks.map(getClockMetadata);