From 92a30a34852b97cf211f78d9c1e8eded1e8bffcc Mon Sep 17 00:00:00 2001
From: Shefali <simplyrender@gmail.com>
Date: Tue, 9 Jan 2024 23:16:12 -0800
Subject: [PATCH] Add activity state inspector option

---
 src/api/objects/ObjectAPI.js                  |   8 +-
 src/plugins/plan/components/PlanView.vue      |   1 +
 .../components/PlanActivitiesView.vue         | 114 +++++++++++++-----
 .../components/PlanActivityPropertiesView.vue |  83 +++++++++++++
 .../components/PlanActivityStatusView.vue     | 114 ++++++++++++++++++
 ...ivityView.vue => PlanActivityTimeView.vue} |  30 ++---
 6 files changed, 305 insertions(+), 45 deletions(-)
 create mode 100644 src/plugins/plan/inspector/components/PlanActivityPropertiesView.vue
 create mode 100644 src/plugins/plan/inspector/components/PlanActivityStatusView.vue
 rename src/plugins/plan/inspector/components/{PlanActivityView.vue => PlanActivityTimeView.vue} (72%)

diff --git a/src/api/objects/ObjectAPI.js b/src/api/objects/ObjectAPI.js
index e58480efee..fea90b164c 100644
--- a/src/api/objects/ObjectAPI.js
+++ b/src/api/objects/ObjectAPI.js
@@ -99,7 +99,13 @@ export default class ObjectAPI {
     this.cache = {};
     this.interceptorRegistry = new InterceptorRegistry();
 
-    this.SYNCHRONIZED_OBJECT_TYPES = ['notebook', 'restricted-notebook', 'plan', 'annotation'];
+    this.SYNCHRONIZED_OBJECT_TYPES = [
+      'notebook',
+      'restricted-notebook',
+      'plan',
+      'annotation',
+      'activity-states'
+    ];
 
     this.errors = {
       Conflict: ConflictError
diff --git a/src/plugins/plan/components/PlanView.vue b/src/plugins/plan/components/PlanView.vue
index 2596bcb6bc..a5d3afd073 100644
--- a/src/plugins/plan/components/PlanView.vue
+++ b/src/plugins/plan/components/PlanView.vue
@@ -488,6 +488,7 @@ export default {
             },
             start: rawActivity.start,
             end: rawActivity.end,
+            description: rawActivity.description,
             row: currentRow,
             textLines: textLines,
             textStart: textStart,
diff --git a/src/plugins/plan/inspector/components/PlanActivitiesView.vue b/src/plugins/plan/inspector/components/PlanActivitiesView.vue
index e2d80be38a..dcc3ba0da2 100644
--- a/src/plugins/plan/inspector/components/PlanActivitiesView.vue
+++ b/src/plugins/plan/inspector/components/PlanActivitiesView.vue
@@ -20,21 +20,39 @@
  at runtime from the About dialog for additional information.
 -->
 <template>
-  <div class="c-inspector__properties c-inspect-properties">
-    <plan-activity-view
+  <div>
+    <plan-activity-time-view
       v-for="activity in activities"
-      :key="activity.id"
+      :key="activity.uuid"
+      class="c-inspector__properties c-inspect-properties"
       :activity="activity"
       :heading="heading"
     />
+    <plan-activity-properties-view
+      v-for="activity in activities"
+      :key="activity.uuid"
+      :heading="'Properties'"
+      class="c-inspector__properties c-inspect-properties"
+      :activity="activity"
+    ></plan-activity-properties-view>
+    <plan-activity-status-view
+      v-if="activities.length === 1"
+      :key="activities[0].uuid"
+      class="c-inspector__properties c-inspect-properties"
+      :activity="activities[0]"
+      :execution-state="persistedActivityStates[activities[0].uuid]"
+      :heading="'Activity Status'"
+      @updateActivityState="persistedActivityState"
+    />
   </div>
 </template>
 
 <script>
 import { getPreciseDuration } from 'utils/duration';
-import { v4 as uuid } from 'uuid';
 
-import PlanActivityView from './PlanActivityView.vue';
+import PlanActivityPropertiesView from './PlanActivityPropertiesView.vue';
+import PlanActivityStatusView from './PlanActivityStatusView.vue';
+import PlanActivityTimeView from './PlanActivityTimeView.vue';
 
 const propertyLabels = {
   start: 'Start DateTime',
@@ -44,23 +62,28 @@ const propertyLabels = {
   latestEnd: 'Latest End',
   gap: 'Gap',
   overlap: 'Overlap',
-  totalTime: 'Total Time'
+  totalTime: 'Total Time',
+  description: 'Description'
 };
 export default {
   components: {
-    PlanActivityView
+    PlanActivityTimeView,
+    PlanActivityPropertiesView,
+    PlanActivityStatusView
   },
   inject: ['openmct', 'selection'],
   data() {
     return {
       name: '',
       activities: [],
+      persistedActivityStates: {},
       heading: ''
     };
   },
   mounted() {
     this.setFormatters();
     this.getPlanData(this.selection);
+    this.getActivityStates();
     this.getActivities();
     this.openmct.selection.on('change', this.updateSelection);
     this.openmct.time.on('timeSystem', this.setFormatters);
@@ -68,8 +91,23 @@ export default {
   beforeUnmount() {
     this.openmct.selection.off('change', this.updateSelection);
     this.openmct.time.off('timeSystem', this.setFormatters);
+    if (this.stopObservingActivityStatesObject) {
+      this.stopObservingActivityStatesObject();
+    }
   },
   methods: {
+    async getActivityStates() {
+      this.activityStatesObject = await this.openmct.objects.get('activity-states');
+      this.setActivityStates();
+      this.stopObservingActivityStatesObject = this.openmct.objects.observe(
+        this.activityStatesObject,
+        '*',
+        this.setActivityStates
+      );
+    },
+    setActivityStates() {
+      this.persistedActivityStates = { ...this.activityStatesObject.activities };
+    },
     setFormatters() {
       let timeSystem = this.openmct.time.timeSystem();
       this.timeFormatter = this.openmct.telemetry.getValueFormatter({
@@ -104,20 +142,30 @@ export default {
       this.activities.splice(0);
       this.selectedActivities.forEach((selectedActivity, index) => {
         const activity = {
-          id: uuid(),
-          start: {
-            label: propertyLabels.start,
-            value: this.formatTime(selectedActivity.start)
-          },
-          end: {
-            label: propertyLabels.end,
-            value: this.formatTime(selectedActivity.end)
-          },
-          duration: {
-            label: propertyLabels.duration,
-            value: this.formatDuration(selectedActivity.end - selectedActivity.start)
+          uuid: selectedActivity.uuid ?? selectedActivity.name,
+          timeProperties: {
+            start: {
+              label: propertyLabels.start,
+              value: this.formatTime(selectedActivity.start)
+            },
+            end: {
+              label: propertyLabels.end,
+              value: this.formatTime(selectedActivity.end)
+            },
+            duration: {
+              label: propertyLabels.duration,
+              value: this.formatDuration(selectedActivity.end - selectedActivity.start)
+            }
           }
         };
+        if (selectedActivity.description) {
+          activity.metadata = {
+            description: {
+              label: propertyLabels.description,
+              value: selectedActivity.description
+            }
+          };
+        }
         this.activities[index] = activity;
       });
     },
@@ -166,30 +214,31 @@ export default {
       let totalTime = latestEnd - earliestStart;
 
       const activity = {
-        id: uuid(),
-        earliestStart: {
-          label: propertyLabels.earliestStart,
-          value: this.formatTime(earliestStart)
-        },
-        latestEnd: {
-          label: propertyLabels.latestEnd,
-          value: this.formatTime(latestEnd)
+        timeProperties: {
+          earliestStart: {
+            label: propertyLabels.earliestStart,
+            value: this.formatTime(earliestStart)
+          },
+          latestEnd: {
+            label: propertyLabels.latestEnd,
+            value: this.formatTime(latestEnd)
+          }
         }
       };
 
       if (gap) {
-        activity.gap = {
+        activity.timeProperties.gap = {
           label: propertyLabels.gap,
           value: this.formatDuration(gap)
         };
       } else if (overlap) {
-        activity.overlap = {
+        activity.timeProperties.overlap = {
           label: propertyLabels.overlap,
           value: this.formatDuration(overlap)
         };
       }
 
-      activity.totalTime = {
+      activity.timeProperties.totalTime = {
         label: propertyLabels.totalTime,
         value: this.formatDuration(totalTime)
       };
@@ -201,6 +250,11 @@ export default {
     },
     formatTime(time) {
       return this.timeFormatter.format(time);
+    },
+    persistedActivityState(data) {
+      const { key, executionState } = data;
+      const activitiesPath = `activities.${key}`;
+      this.openmct.objects.mutate(this.activityStatesObject, activitiesPath, executionState);
     }
   }
 };
diff --git a/src/plugins/plan/inspector/components/PlanActivityPropertiesView.vue b/src/plugins/plan/inspector/components/PlanActivityPropertiesView.vue
new file mode 100644
index 0000000000..b0fa628729
--- /dev/null
+++ b/src/plugins/plan/inspector/components/PlanActivityPropertiesView.vue
@@ -0,0 +1,83 @@
+<!--
+ Open MCT, Copyright (c) 2014-2023, 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.
+-->
+
+<template>
+  <div>
+    <div v-if="properties.length" class="u-contents">
+      <div class="c-inspect-properties__header">{{ heading }}</div>
+      <ul v-for="property in properties" :key="property.id" class="c-inspect-properties__section">
+        <activity-property :label="property.label" :value="property.value" />
+      </ul>
+    </div>
+  </div>
+</template>
+
+<script>
+import { v4 as uuid } from 'uuid';
+
+import ActivityProperty from './ActivityProperty.vue';
+
+export default {
+  components: {
+    ActivityProperty
+  },
+  props: {
+    activity: {
+      type: Object,
+      required: true
+    },
+    heading: {
+      type: String,
+      required: true
+    }
+  },
+  data() {
+    return {
+      properties: []
+    };
+  },
+  mounted() {
+    this.setProperties();
+  },
+  methods: {
+    setProperties() {
+      if (!this.activity.metadata) {
+        return;
+      }
+
+      Object.keys(this.activity.metadata).forEach((key) => {
+        if (this.activity.metadata[key].label) {
+          const label = this.activity.metadata[key].label;
+          const value = String(this.activity.metadata[key].value);
+
+          this.properties[this.properties.length] = {
+            id: uuid(),
+            label,
+            value
+          };
+        }
+      });
+      console.log(this.activity.metadata, this.properties);
+    }
+  }
+};
+</script>
diff --git a/src/plugins/plan/inspector/components/PlanActivityStatusView.vue b/src/plugins/plan/inspector/components/PlanActivityStatusView.vue
new file mode 100644
index 0000000000..b7e4a53420
--- /dev/null
+++ b/src/plugins/plan/inspector/components/PlanActivityStatusView.vue
@@ -0,0 +1,114 @@
+<!--
+ Open MCT, Copyright (c) 2014-2023, 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.
+-->
+
+<template>
+  <div>
+    <div class="u-contents">
+      <div class="c-inspect-properties__header">{{ heading }}</div>
+      <form name="activityStatus">
+        <select v-model="currentStatusKey" name="setActivityStatus" @change="changeActivityStatus">
+          <option v-for="status in activityStates" :key="status.key" :value="status.label">
+            {{ status.label }}
+          </option>
+        </select>
+      </form>
+    </div>
+  </div>
+</template>
+
+<script>
+const activityStates = [
+  {
+    key: '',
+    label: '- Select Activity Status -'
+  },
+  {
+    key: 'active',
+    label: 'In progress'
+  },
+  {
+    key: 'completed',
+    label: 'Completed'
+  },
+  {
+    key: 'aborted',
+    label: 'Aborted'
+  },
+  {
+    key: 'cancelled',
+    label: 'Cancelled'
+  },
+  {
+    key: 'notStarted',
+    label: 'Not started'
+  }
+];
+
+export default {
+  props: {
+    activity: {
+      type: Object,
+      required: true
+    },
+    executionState: {
+      type: String,
+      default() {
+        return '';
+      }
+    },
+    heading: {
+      type: String,
+      required: true
+    }
+  },
+  emits: ['updateActivityState'],
+  data() {
+    return {
+      activityStates: activityStates,
+      currentStatusKey: activityStates[0].key
+    };
+  },
+  watch: {
+    executionState() {
+      this.setActivityStatus();
+    }
+  },
+  mounted() {
+    this.setActivityStatus();
+  },
+  methods: {
+    setActivityStatus() {
+      this.currentStatusKey = this.executionState;
+    },
+    changeActivityStatus() {
+      if (this.currentStatusKey === '') {
+        return;
+      }
+      this.activity.executionState = this.currentStatusKey;
+      this.$emit('updateActivityState', {
+        key: this.activity.uuid,
+        executionState: this.currentStatusKey
+      });
+    }
+  }
+};
+</script>
diff --git a/src/plugins/plan/inspector/components/PlanActivityView.vue b/src/plugins/plan/inspector/components/PlanActivityTimeView.vue
similarity index 72%
rename from src/plugins/plan/inspector/components/PlanActivityView.vue
rename to src/plugins/plan/inspector/components/PlanActivityTimeView.vue
index 4860e1f9e7..89884115e3 100644
--- a/src/plugins/plan/inspector/components/PlanActivityView.vue
+++ b/src/plugins/plan/inspector/components/PlanActivityTimeView.vue
@@ -21,17 +21,19 @@
 -->
 
 <template>
-  <div v-if="timeProperties.length" class="u-contents">
-    <div class="c-inspect-properties__header">
-      {{ heading }}
+  <div>
+    <div v-if="timeProperties.length" class="u-contents">
+      <div class="c-inspect-properties__header">
+        {{ heading }}
+      </div>
+      <ul
+        v-for="timeProperty in timeProperties"
+        :key="timeProperty.id"
+        class="c-inspect-properties__section"
+      >
+        <activity-property :label="timeProperty.label" :value="timeProperty.value" />
+      </ul>
     </div>
-    <ul
-      v-for="timeProperty in timeProperties"
-      :key="timeProperty.id"
-      class="c-inspect-properties__section"
-    >
-      <activity-property :label="timeProperty.label" :value="timeProperty.value" />
-    </ul>
   </div>
 </template>
 
@@ -64,10 +66,10 @@ export default {
   },
   methods: {
     setProperties() {
-      Object.keys(this.activity).forEach((key) => {
-        if (this.activity[key].label) {
-          const label = this.activity[key].label;
-          const value = String(this.activity[key].value);
+      Object.keys(this.activity.timeProperties).forEach((key) => {
+        if (this.activity.timeProperties[key].label) {
+          const label = this.activity.timeProperties[key].label;
+          const value = String(this.activity.timeProperties[key].value);
 
           this.timeProperties[this.timeProperties.length] = {
             id: uuid(),