Skip to content

Commit

Permalink
Refactor progress bars out of invocation summary.
Browse files Browse the repository at this point in the history
  • Loading branch information
jmchilton committed Mar 12, 2024
1 parent 8ffed84 commit a1bb722
Show file tree
Hide file tree
Showing 3 changed files with 143 additions and 94 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
<script setup lang="ts">
import { computed } from "vue";
import { InvocationJobsSummary } from "@/api/invocations";
import ProgressBar from "@/components/ProgressBar.vue";
import {
errorCount as jobStatesSummaryErrorCount,
jobCount as jobStatesSummaryJobCount,
numTerminal,
okCount as jobStatesSummaryOkCount,
runningCount as jobStatesSummaryRunningCount,
} from "./util";
interface Props {
jobStatesSummary: InvocationJobsSummary;
invocationSchedulingTerminal: boolean;
invocationAndJobTerminal: boolean;
}
const props = defineProps<Props>();
const jobCount = computed<number>(() => {
return jobStatesSummaryJobCount(props.jobStatesSummary);
});
const okCount = computed<number>(() => {
return jobStatesSummaryOkCount(props.jobStatesSummary);
});
const runningCount = computed<number>(() => {
return jobStatesSummaryRunningCount(props.jobStatesSummary);
});
const errorCount = computed<number>(() => {
return jobStatesSummaryErrorCount(props.jobStatesSummary);
});
const newCount = computed<number>(() => {
return jobCount.value - okCount.value - runningCount.value - errorCount.value;
});
const jobStatesStr = computed(() => {
let jobStr = `${numTerminal(props.jobStatesSummary) || 0} of ${jobCount.value} jobs complete`;
if (!props.invocationSchedulingTerminal) {
jobStr += " (total number of jobs will change until all steps fully scheduled)";
}
return `${jobStr}.`;
});
</script>

<template>
<ProgressBar
:note="jobStatesStr"
:total="jobCount"
:ok-count="okCount"
:running-count="runningCount"
:new-count="newCount"
:error-count="errorCount"
:loading="!invocationAndJobTerminal"
class="jobs-progress" />
</template>
Original file line number Diff line number Diff line change
@@ -0,0 +1,68 @@
<script setup lang="ts">
import { computed } from "vue";
import { InvocationStep, WorkflowInvocationElementView } from "@/api/invocations";
import ProgressBar from "@/components/ProgressBar.vue";
interface Props {
invocation?: WorkflowInvocationElementView;
invocationState: string;
invocationSchedulingTerminal: boolean;
}
const props = defineProps<Props>();
const stepCount = computed<number>(() => {
return props.invocation?.steps.length || 0;
});
type StepStateType = { [state: string]: number };
const stepStates = computed<StepStateType>(() => {
const stepStates: StepStateType = {};
if (!props.invocation) {
return {};
}
const steps: InvocationStep[] = props.invocation?.steps || [];
for (const step of steps) {
if (!step) {
continue;
}
// the API defined state here allowing null and undefined is odd...
const stepState: string = step.state || "unknown";
if (!stepStates[stepState]) {
stepStates[stepState] = 1;
} else {
stepStates[stepState] += 1;
}
}
return stepStates;
});
const stepStatesStr = computed<string>(() => {
return `${stepStates.value?.scheduled || 0} of ${stepCount.value} steps successfully scheduled.`;
});
</script>

<template>
<span>
<ProgressBar v-if="!stepCount" note="Loading step state summary..." :loading="true" class="steps-progress" />
<ProgressBar
v-if="invocationState == 'cancelled'"
note="Invocation scheduling cancelled - expected jobs and outputs may not be generated."
:error-count="1"
class="steps-progress" />
<ProgressBar
v-else-if="invocationState == 'failed'"
note="Invocation scheduling failed - Galaxy administrator may have additional details in logs."
:error-count="1"
class="steps-progress" />
<ProgressBar
v-else
:note="stepStatesStr"
:total="stepCount"
:ok-count="stepStates.scheduled"
:loading="!invocationSchedulingTerminal"
class="steps-progress" />
</span>
</template>
Original file line number Diff line number Diff line change
@@ -1,26 +1,17 @@
<script setup lang="ts">
import { computed } from "vue";
import { InvocationJobsSummary, InvocationStep, WorkflowInvocationElementView } from "@/api/invocations";
import { getRootFromIndexLink } from "@/onload";
import { InvocationJobsSummary, WorkflowInvocationElementView } from "@/api/invocations";
import {
errorCount as jobStatesSummaryErrorCount,
jobCount as jobStatesSummaryJobCount,
numTerminal,
okCount as jobStatesSummaryOkCount,
runningCount as jobStatesSummaryRunningCount,
} from "./util";
import { runningCount as jobStatesSummaryRunningCount } from "./util";
import LoadingSpan from "@/components/LoadingSpan.vue";
import ProgressBar from "@/components/ProgressBar.vue";
import InvocationMessage from "./InvocationMessage.vue";
import InvocationSummaryActionButtons from "./InvocationSummaryActionButtons.vue";
function getUrl(path: string): string {
return getRootFromIndexLink() + path;
}
import InvocationJobsProgressBar from "./InvocationJobsProgressBar.vue";
import InvocationStepsProgressBar from "./InvocationStepsProgressBar.vue";
interface Props {
invocation?: WorkflowInvocationElementView;
Expand Down Expand Up @@ -50,65 +41,10 @@ const invocationStateSuccess = computed(() => {
return invocationState.value == "scheduled" && runningCount.value === 0 && props.invocationAndJobTerminal;
});
const stepCount = computed<number>(() => {
return props.invocation?.steps.length || 0;
});
type StepStateType = { [state: string]: number };
const stepStates = computed<StepStateType>(() => {
const stepStates: StepStateType = {};
if (!props.invocation) {
return {};
}
const steps: InvocationStep[] = props.invocation?.steps || [];
for (const step of steps) {
if (!step) {
continue;
}
// the API defined state here allowing null and undefined is odd...
const stepState: string = step.state || "unknown";
if (!stepStates[stepState]) {
stepStates[stepState] = 1;
} else {
stepStates[stepState] += 1;
}
}
return stepStates;
});
const stepStatesStr = computed<string>(() => {
return `${stepStates.value?.scheduled || 0} of ${stepCount.value} steps successfully scheduled.`;
});
const okCount = computed<number>(() => {
return jobStatesSummaryOkCount(props.jobStatesSummary);
});
const runningCount = computed<number>(() => {
return jobStatesSummaryRunningCount(props.jobStatesSummary);
});
const jobCount = computed<number>(() => {
return jobStatesSummaryJobCount(props.jobStatesSummary);
});
const errorCount = computed<number>(() => {
return jobStatesSummaryErrorCount(props.jobStatesSummary);
});
const newCount = computed<number>(() => {
return jobCount.value - okCount.value - runningCount.value - errorCount.value;
});
const jobStatesStr = computed(() => {
let jobStr = `${numTerminal(props.jobStatesSummary) || 0} of ${jobCount.value} jobs complete`;
if (!props.invocationSchedulingTerminal) {
jobStr += " (total number of jobs will change until all steps fully scheduled)";
}
return `${jobStr}.`;
});
const emit = defineEmits<{
(e: "invocation-cancelled"): void;
}>();
Expand Down Expand Up @@ -136,7 +72,6 @@ function onCancel() {
title="Cancel scheduling of workflow invocation"
@click="onCancel"></span>
</div>
<ProgressBar v-if="!stepCount" note="Loading step state summary..." :loading="true" class="steps-progress" />
<template v-if="invocation.messages?.length">
<InvocationMessage
v-for="message in invocation.messages"
Expand All @@ -146,31 +81,14 @@ function onCancel() {
:invocation="invocation">
</InvocationMessage>
</template>
<ProgressBar
v-else-if="invocationState == 'cancelled'"
note="Invocation scheduling cancelled - expected jobs and outputs may not be generated."
:error-count="1"
class="steps-progress" />
<ProgressBar
v-else-if="invocationState == 'failed'"
note="Invocation scheduling failed - Galaxy administrator may have additional details in logs."
:error-count="1"
class="steps-progress" />
<ProgressBar
<InvocationStepsProgressBar
v-else
:note="stepStatesStr"
:total="stepCount"
:ok-count="stepStates.scheduled"
:loading="!invocationSchedulingTerminal"
class="steps-progress" />
<ProgressBar
:note="jobStatesStr"
:total="jobCount"
:ok-count="okCount"
:running-count="runningCount"
:new-count="newCount"
:error-count="errorCount"
:loading="!invocationAndJobTerminal"
class="jobs-progress" />
:invocation="invocation"
:invocation-state="invocationState"
:invocation-scheduling-terminal="invocationSchedulingTerminal" />
<InvocationJobsProgressBar
:job-states-summary="jobStatesSummary"
:invocation-scheduling-terminal="invocationSchedulingTerminal"
:invocation-and-job-terminal="invocationAndJobTerminal" />
</div>
</template>

0 comments on commit a1bb722

Please sign in to comment.