Optimize spinner progress (#4745)

packages/client/hmi-client/src/components/workflow/ops/optimize-ciemss/optimize-ciemss-operation.ts

@@ -72,6 +72,8 @@ export interface OptimizeCiemssOperationState extends BaseState {
  optimizedInterventionPolicyId: string;
  optimizeErrorMessage: { name: string; value: string; traceback: string };
  simulateErrorMessage: { name: string; value: string; traceback: string };
+ // Intermediate:
+ currentProgress: number; // optimization run's 2 digit %
 }
 
 // This is used as a map between dropdown labels and the inner values used by pyciemss-service.
@@ -150,7 +152,8 @@ export const OptimizeCiemssOperation: Operation = {
  optimizationRunId: '',
  optimizedInterventionPolicyId: '',
  optimizeErrorMessage: { name: '', value: '', traceback: '' },
- simulateErrorMessage: { name: '', value: '', traceback: '' }
+ simulateErrorMessage: { name: '', value: '', traceback: '' },
+ currentProgress: 0
  };
  return init;
  }

packages/client/hmi-client/src/components/workflow/ops/optimize-ciemss/tera-optimize-ciemss-drilldown.vue

@@ -239,7 +239,6 @@
  <template #preview>
  <tera-drilldown-section
  class="ml-3 mr-3"
- :is-loading="showSpinner"
  :class="{ 'failed-run': optimizationResult.success === 'False' ?? 'successful-run' }"
  >
  <template #header-controls-left v-if="optimizedInterventionPolicy?.name">
@@ -254,10 +253,18 @@
  @click="showSaveInterventionPolicy = true"
  />
  </template>
-
+ <tera-progress-spinner v-if="showSpinner" :font-size="2" is-centered style="height: 100%">
+ <div v-if="node.state.inProgressOptimizeId !== ''">
+ {{ props.node.state.currentProgress }}% of maximum iterations complete
+ </div>
+ <div v-else>Optimize complete. Running simulations</div>
+ </tera-progress-spinner>
  <tera-operator-output-summary v-if="node.state.summaryId && !showSpinner" :summary-id="node.state.summaryId" />
  <!-- Optimize result.json display: -->
- <div v-if="optimizationResult && displayOptimizationResultMessage" class="result-message-grid mt-2 mb-2">
+ <div
+ v-if="optimizationResult && displayOptimizationResultMessage && !showSpinner"
+ class="result-message-grid mt-2 mb-2"
+ >
  <span class="flex flex-row">
  <p class="mt-2">For debugging</p>
  <Button
@@ -275,6 +282,7 @@
  </div>
  </div>
  <SelectButton
+ v-if="!showSpinner"
  :model-value="outputViewSelection"
  @change="if ($event.value) outputViewSelection = $event.value;"
  :options="outputViewOptions"
@@ -288,7 +296,7 @@
  </SelectButton>
  <tera-notebook-error v-bind="node.state.optimizeErrorMessage" />
  <tera-notebook-error v-bind="node.state.simulateErrorMessage" />
- <template v-if="runResults[knobs.postForecastRunId] && runResults[knobs.preForecastRunId]">
+ <template v-if="runResults[knobs.postForecastRunId] && runResults[knobs.preForecastRunId] && !showSpinner">
  <section v-if="outputViewSelection === OutputView.Charts" ref="outputPanel">
  <Accordion multiple :active-index="[0, 1, 2]">
  <AccordionTab header="Success criteria">
@@ -379,6 +387,7 @@ import TeraDrilldownSection from '@/components/drilldown/tera-drilldown-section.
 import TeraSaveDatasetFromSimulation from '@/components/dataset/tera-save-dataset-from-simulation.vue';
 import TeraPyciemssCancelButton from '@/components/pyciemss/tera-pyciemss-cancel-button.vue';
 import TeraOperatorOutputSummary from '@/components/operator/tera-operator-output-summary.vue';
+import TeraProgressSpinner from '@/components/widgets/tera-progress-spinner.vue';
 import { getUnitsFromModelParts, getModelByModelConfigurationId } from '@/services/model';
 import { createModelConfiguration, getModelConfigurationById } from '@/services/model-configurations';
 import {
@@ -1119,6 +1128,17 @@ watch(
  padding: var(--gap-1) var(--gap);
  gap: var(--gap-2);
 }
+
+.spinner-message {
+ align-items: center;
+ align-self: center;
+ display: flex;
+ flex-direction: column;
+ gap: var(--gap-2);
+ margin-top: 15rem;
+ text-align: center;
+}
+
 .info-circle {
  color: var(--text-color-secondary);
  font-size: var(--font-caption);

packages/client/hmi-client/src/components/workflow/ops/optimize-ciemss/tera-optimize-ciemss-node.vue

@@ -4,7 +4,14 @@
  <template v-if="!node.inputs[0].value"> Attach a model configuration </template>
  </tera-operator-placeholder>
  <template v-if="node.inputs[0].value">
- <tera-progress-spinner v-if="showSpinner" :font-size="2" is-centered style="height: 100%" />
+ <div v-if="showSpinner">
+ <div v-if="node.state.inProgressOptimizeId !== ''">
+ {{ props.node.state.currentProgress }}% of maximum iterations complete
+ </div>
+ <div v-else>Optimize complete. Running simulations</div>
+ <tera-progress-spinner :font-size="2" is-centered style="height: 100%" />
+ </div>
+
  <div v-if="!showSpinner && runResults">
  <template v-for="(_, index) of node.state.selectedSimulationVariables" :key="index">
  <vega-chart :visualization-spec="preparedCharts[index]" :are-embed-actions-visible="false" />
@@ -33,7 +40,7 @@ import {
  parsePyCiemssMap
 } from '@/services/models/simulation-service';
 import { nodeMetadata, nodeOutputLabel } from '@/components/workflow/util';
-import { SimulationRequest, InterventionPolicy } from '@/types/Types';
+import { SimulationRequest, InterventionPolicy, Simulation, CiemssOptimizeStatusUpdate } from '@/types/Types';
 import { createLLMSummary } from '@/services/summary-service';
 import VegaChart from '@/components/widgets/VegaChart.vue';
 import { createForecastChart } from '@/services/charts';
@@ -74,7 +81,19 @@ const pollResult = async (runId: string) => {
  poller
  .setInterval(5000)
  .setThreshold(100)
- .setPollAction(async () => pollAction(runId));
+ .setPollAction(async () => pollAction(runId))
+ .setProgressAction((data: Simulation) => {
+ if (runId === props.node.state.inProgressOptimizeId && data.updates.length > 0) {
+ const checkpointData = _.first(data.updates)?.data as CiemssOptimizeStatusUpdate;
+ if (checkpointData) {
+ const state = _.cloneDeep(props.node.state);
+ state.currentProgress = +((100 * checkpointData.progress) / checkpointData.totalPossibleIterations).toFixed(
+ 2
+ );
+ emit('update-state', state);
+ }
+ }
+ });
 
  const pollerResults = await poller.start();
 
@@ -234,6 +253,7 @@ Provide a consis summary in 100 words or less.
  state.preForecastRunId = preSimId;
  state.inProgressPostForecastId = '';
  state.postForecastRunId = postSimId;
+ state.currentProgress = 0;
  emit('update-state', state);
 
  const datasetName = `Forecast run ${state.postForecastRunId}`;
@@ -281,6 +301,7 @@ Provide a consis summary in 100 words or less.
  state.inProgressOptimizeId = '';
  state.inProgressPreForecastId = '';
  state.inProgressPostForecastId = '';
+ state.currentProgress = 0;
  emit('update-state', state);
  }
  },

packages/client/hmi-client/src/types/Types.ts

@@ -553,12 +553,6 @@ export interface CalibrationRequestCiemss {
  engine: string;
 }
 
-export interface CiemssStatusUpdate {
- loss: number;
- progress: number;
- jobId: string;
-}
-
 export interface EnsembleCalibrationCiemssRequest {
  modelConfigs: EnsembleModelConfigs[];
  dataset: DatasetLocation;
@@ -672,6 +666,21 @@ export interface TimeSpan {
  end: number;
 }
 
+export interface CiemssCalibrateStatusUpdate extends CiemssStatusUpdate {
+ loss: number;
+}
+
+export interface CiemssOptimizeStatusUpdate extends CiemssStatusUpdate {
+ currentResults: number[];
+ totalPossibleIterations: number;
+}
+
+export interface CiemssStatusUpdate {
+ jobId: string;
+ progress: number;
+ type: CiemssStatusType;
+}
+
 export interface TaskResponse {
  id: string;
  script: string;
@@ -1026,6 +1035,11 @@ export enum EvaluationScenarioStatus {
  Stopped = "STOPPED",
 }
 
+export enum CiemssStatusType {
+ Optimize = "optimize",
+ Calibrate = "calibrate",
+}
+
 export enum TaskStatus {
  Queued = "QUEUED",
  Running = "RUNNING",

packages/server/src/main/java/software/uncharted/terarium/hmiserver/models/simulationservice/statusupdates/CiemssCalibrateStatusUpdate.java

@@ -0,0 +1,11 @@
+package software.uncharted.terarium.hmiserver.models.simulationservice.statusupdates;
+
+import lombok.Data;
+import software.uncharted.terarium.hmiserver.annotations.TSModel;
+
+@Data
+@TSModel
+public class CiemssCalibrateStatusUpdate extends CiemssStatusUpdate {
+
+ private Number loss;
+}

packages/server/src/main/java/software/uncharted/terarium/hmiserver/models/simulationservice/statusupdates/CiemssOptimizeStatusUpdate.java

@@ -0,0 +1,26 @@
+package software.uncharted.terarium.hmiserver.models.simulationservice.statusupdates;
+
+import com.fasterxml.jackson.annotation.JsonAlias;
+import com.fasterxml.jackson.annotation.JsonIgnore;
+import com.fasterxml.jackson.databind.JsonNode;
+import com.fasterxml.jackson.databind.ObjectMapper;
+import java.util.List;
+import lombok.Data;
+import software.uncharted.terarium.hmiserver.annotations.TSModel;
+
+@Data
+@TSModel
+public class CiemssOptimizeStatusUpdate extends CiemssStatusUpdate {
+
+ @JsonAlias("current_results")
+ private List<Number> currentResults;
+
+ @JsonAlias("total_possible_iterations")
+ private Number totalPossibleIterations;
+
+ @JsonIgnore
+ public JsonNode getDataToPersist() {
+ final ObjectMapper mapper = new ObjectMapper();
+ return mapper.valueToTree(this);
+ }
+}

packages/server/src/main/java/software/uncharted/terarium/hmiserver/models/simulationservice/statusupdates/CiemssStatusType.java

@@ -0,0 +1,22 @@
+package software.uncharted.terarium.hmiserver.models.simulationservice.statusupdates;
+
+import com.fasterxml.jackson.annotation.JsonValue;
+import software.uncharted.terarium.hmiserver.annotations.TSModel;
+
+@TSModel
+public enum CiemssStatusType {
+ OPTIMIZE("optimize"),
+ CALIBRATE("calibrate");
+
+ public final String type;
+
+ CiemssStatusType(final String type) {
+ this.type = type;
+ }
+
+ @Override
+ @JsonValue
+ public String toString() {
+ return type;
+ }
+}

packages/server/src/main/java/software/uncharted/terarium/hmiserver/models/simulationservice/CiemssStatusUpdate.java → packages/server/src/main/java/software/uncharted/terarium/hmiserver/models/simulationservice/statusupdates/CiemssStatusUpdate.java

@@ -1,4 +1,4 @@
-package software.uncharted.terarium.hmiserver.models.simulationservice;
+package software.uncharted.terarium.hmiserver.models.simulationservice.statusupdates;
 
 import com.fasterxml.jackson.annotation.JsonAlias;
 import com.fasterxml.jackson.annotation.JsonIgnore;
@@ -9,14 +9,14 @@
 
 @Data
 @TSModel
-public class CiemssStatusUpdate {
+public abstract class CiemssStatusUpdate {
 
- private Number loss;
+ @JsonAlias("job_id")
+ private String jobId;
 
  private Number progress;
 
- @JsonAlias("job_id")
- private String jobId;
+ private CiemssStatusType type;
 
  @JsonIgnore
  public JsonNode getDataToPersist() {