diff --git a/client/src/components/History/Content/ContentItem.vue b/client/src/components/History/Content/ContentItem.vue index c57dbd2f7dd0..5bf380cd2cb0 100644 --- a/client/src/components/History/Content/ContentItem.vue +++ b/client/src/components/History/Content/ContentItem.vue @@ -24,21 +24,21 @@ @click.stop="$emit('update:selected', true)" /> - + - + - + @@ -96,6 +96,11 @@ import ContentOptions from "./ContentOptions"; import DatasetDetails from "./Dataset/DatasetDetails"; import { updateContentFields } from "components/History/model/queries"; import { JobStateSummary } from "./Collection/JobStateSummary"; +import { library } from "@fortawesome/fontawesome-svg-core"; +import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"; +import { faArrowCircleUp, faMinusCircle, faCheckCircle } from "@fortawesome/free-solid-svg-icons"; + +library.add(faArrowCircleUp, faMinusCircle, faCheckCircle); export default { components: { @@ -103,6 +108,7 @@ export default { ContentOptions, DatasetDetails, StatelessTags, + FontAwesomeIcon, }, props: { expandDataset: { type: Boolean, required: true }, diff --git a/client/src/components/History/Content/model/highlights.js b/client/src/components/History/Content/model/highlights.js index 1ec4d40a3a02..7ae21b5905a1 100644 --- a/client/src/components/History/Content/model/highlights.js +++ b/client/src/components/History/Content/model/highlights.js @@ -1,6 +1,8 @@ /** * Specifies highlighted items in the history listing. The `highlight` property is passed to * the content item component and can be used to modify its appearance. + * TO DO: Consider case where parameter history is different and hence inputs cannot be seen + * in the current panel. */ import axios from "axios"; import { prependPath } from "utils/redirect"; @@ -35,7 +37,7 @@ function getKey(details) { } /** Returns highlighting details */ -export async function getHighlights(item) { +export async function getHighlights(item, itemKey) { const highlights = {}; const { outputs, parameters } = await getDatasetParameters(item.id, item.job_source_id); deepeach(parameters, (details) => { @@ -47,8 +49,19 @@ export async function getHighlights(item) { deepeach(outputs, (details) => { const key = getKey(details); if (key) { - highlights[key] = "output"; + // some other item created this item (e.g.: inheritance) + if (key != itemKey) { + highlights[itemKey] = "output"; + highlights[key] = "input"; + } else { + highlights[key] = "output"; + } } }); + // highlights only has item itself as an output (i.e.: no inputs) + if (highlights[itemKey] === "output" && Object.keys(highlights).length == 1) { + highlights[itemKey] = "noInputs"; + } + // TO DO: Consider case where a job created multiple items (all highlights are outputs) return highlights; } diff --git a/client/src/components/History/CurrentHistory/HistoryPanel.vue b/client/src/components/History/CurrentHistory/HistoryPanel.vue index 2a285724f5a9..2e684ea687fa 100644 --- a/client/src/components/History/CurrentHistory/HistoryPanel.vue +++ b/client/src/components/History/CurrentHistory/HistoryPanel.vue @@ -212,26 +212,7 @@ export default { }, methods: { getHighlight(item) { - const key = this.getItemKey(item); - // the current item has one item in its parameters (i.e.: outputs) - if (Object.keys(this.highlights).length == 1) { - // parameters has itself as an output (i.e.: no inputs) - if (key == this.highlightsKey && this.highlights[key] == "output") { - return "noInputs"; - } - // parameters has another item as output but not current one - // (i.e.: the current one is an output) - else if (key == this.highlightsKey) { - return "output"; - } - // parameters has another item as output but not current one - // (i.e.: must be the item that created it/it was copied from) - else if (this.highlights[key] == "output") { - return "input"; - } - } else { - return this.highlights[key]; - } + return this.highlights[this.getItemKey(item)]; }, getItemKey(item) { return `${item.id}-${item.history_content_type}`; @@ -283,7 +264,7 @@ export default { const key = this.getItemKey(item); if (this.highlightsKey != key) { this.highlightsKey = key; - this.highlights = await getHighlights(item); + this.highlights = await getHighlights(item, key); } else { this.resetHighlights(); }