ProgressBar null not undefined (#6953)

* ProgressBar null not undefined

* notification banner null

* update progress dialog

* docs: update type

---------

Co-authored-by: Jesse Mazzella <ozyx@users.noreply.github.com>
Co-authored-by: Jesse Mazzella <jesse.d.mazzella@nasa.gov>

src/api/notifications/NotificationAPI.js

@@ -165,7 +165,7 @@ export default class NotificationAPI extends EventEmitter {
   /**
    * Create a new progress notification. These notifications will contain a progress bar.
    * @param {string} message
-   * @param {number | 'unknown'} progressPerc A value between 0 and 100, or the string 'unknown'.
+   * @param {number | null} progressPerc A value between 0 and 100, or null.
    * @param {string} [progressText] Text description of progress (eg. "10 of 20 objects copied").
    */
   progress(message, progressPerc, progressText) {

src/api/overlays/OverlayAPI.js

@@ -141,7 +141,7 @@ class OverlayAPI {
    * @see NotificationService
    *
    * @typedef options
-   * @property {number} progressPerc the initial progress value (0-100) or {string} 'unknown' for anonymous progress
+   * @property {number | null} progressPerc the initial progress value (0-100) or null for anonymous progress
    * @property {string} progressText the initial text to be shown under the progress bar
    * @property {buttons[]} buttons a list of buttons with title and callback properties that will
    * be added to the dialog.

src/plugins/formActions/CreateAction.js

@@ -70,7 +70,7 @@ export default class CreateAction extends PropertiesAction {
 
     // Show saving progress dialog
     let dialog = this.openmct.overlays.progressDialog({
-      progressPerc: 'unknown',
+      progressPerc: null,
       message:
         'Do not navigate away from this page or close this browser tab while this message is displayed.',
       iconClass: 'info',

src/plugins/notebook/components/Notebook.vue

@@ -105,7 +105,7 @@
         <progress-bar
           v-if="savingTransaction"
           class="c-telemetry-table__progress-bar"
-          :model="{ progressPerc: undefined }"
+          :model="{ progressPerc: null }"
         />
         <div v-if="selectedPage && selectedPage.isLocked" class="c-notebook__page-locked">
           <div class="icon-lock"></div>

src/plugins/plot/Plot.vue

@@ -29,7 +29,7 @@
       <progress-bar
         v-show="!!loading"
         class="c-telemetry-table__progress-bar"
-        :model="{ progressPerc: undefined }"
+        :model="{ progressPerc: null }"
       />
       <mct-plot
         :class="[plotLegendExpandedStateClass, plotLegendPositionClass]"

src/plugins/telemetryTable/components/table.vue

@@ -135,7 +135,7 @@
       <progress-bar
         v-if="loading"
         class="c-telemetry-table__progress-bar"
-        :model="{ progressPerc: undefined }"
+        :model="{ progressPerc: null }"
       />
 
       <!-- Headers table -->

src/ui/components/ProgressBar.vue

@@ -23,7 +23,7 @@
   <div class="c-progress-bar">
     <div
       class="c-progress-bar__bar"
-      :class="{ '--indeterminate': model.progressPerc === undefined }"
+      :class="{ '--indeterminate': model.progressPerc === null }"
       :style="styleBarWidth"
     ></div>
     <div v-if="model.progressText !== undefined" class="c-progress-bar__text">
@@ -43,7 +43,7 @@ export default {
   },
   computed: {
     styleBarWidth() {
-      return this.model.progressPerc !== undefined ? `width: ${this.model.progressPerc}%;` : '';
+      return this.model.progressPerc !== null ? `width: ${this.model.progressPerc}%;` : '';
     }
   }
 };

src/ui/layout/BrowseBar.vue

@@ -359,7 +359,7 @@ export default {
     },
     saveAndFinishEditing() {
       let dialog = this.openmct.overlays.progressDialog({
-        progressPerc: 'unknown',
+        progressPerc: null,
         message:
           'Do not navigate away from this page or close this browser tab while this message is displayed.',
         iconClass: 'info',

src/ui/layout/search/SearchResultsDropDown.vue

@@ -50,7 +50,7 @@
         </div>
         <div v-if="searchLoading" class="c-gsearch__result-pane-msg">
           <div class="hint">Searching...</div>
-          <progress-bar :model="{ progressPerc: undefined }" />
+          <progress-bar :model="{ progressPerc: null }" />
         </div>
         <div
           v-if="

src/ui/layout/status-bar/NotificationBanner.vue

@@ -40,7 +40,7 @@
     >
 
     <progress-bar
-      v-if="activeModel.progressPerc !== undefined"
+      v-if="activeModel.progressPerc !== null"
       class="c-message-banner__progress-bar"
       :model="activeModel"
     />
@@ -88,7 +88,7 @@ export default {
     return {
       activeModel: {
         message: undefined,
-        progressPerc: undefined,
+        progressPerc: null,
         progressText: undefined,
         minimized: undefined,
         options: undefined
@@ -178,7 +178,7 @@ export default {
         return;
       }
 
-      if (this.activeModel.progressPerc !== undefined) {
+      if (this.activeModel.progressPerc !== null) {
         maximizedDialog = this.openmct.overlays.progressDialog({
           buttons: [minimizeButton],
           ...this.activeModel