From fd29743b477faea1e60af69d0255b953e7977035 Mon Sep 17 00:00:00 2001
From: John Chilton <jmchilton@gmail.com>
Date: Fri, 17 Jun 2022 14:28:57 -0400
Subject: [PATCH] Force SingleQueryProvider to convert arguments to CamelCase.

Fixes showing invocations for a particular workflow.
---
 .../DatasetInformation/DatasetDetails.vue      |  2 +-
 .../DatasetInformation/DatasetError.vue        |  4 ++--
 .../JobInformation/JobInformation.vue          |  2 +-
 client/src/components/providers/JobProvider.js |  8 ++++----
 .../providers/SingleQueryProvider.js           |  4 +++-
 .../src/components/providers/storeProviders.js | 13 ++-----------
 client/src/components/providers/utils.js       | 18 ++++++++++++++++++
 7 files changed, 31 insertions(+), 20 deletions(-)

diff --git a/client/src/components/DatasetInformation/DatasetDetails.vue b/client/src/components/DatasetInformation/DatasetDetails.vue
index afa96fcfc9b1..ebd75ea4315f 100644
--- a/client/src/components/DatasetInformation/DatasetDetails.vue
+++ b/client/src/components/DatasetInformation/DatasetDetails.vue
@@ -10,7 +10,7 @@
                     <JobDetailsProvider
                         v-if="!isDatasetLoading && dataset.creating_job !== null"
                         v-slot="{ result: job, loading: isJobLoading }"
-                        :jobid="dataset.creating_job"
+                        :jobId="dataset.creating_job"
                         auto-refresh>
                         <div v-if="!isJobLoading">
                             <dataset-information class="detail" :hda_id="datasetId" />
diff --git a/client/src/components/DatasetInformation/DatasetError.vue b/client/src/components/DatasetInformation/DatasetError.vue
index b154b36b5dcd..7fe62ff9c271 100644
--- a/client/src/components/DatasetInformation/DatasetError.vue
+++ b/client/src/components/DatasetInformation/DatasetError.vue
@@ -8,7 +8,7 @@
             <JobDetailsProvider
                 v-if="!datasetLoading"
                 v-slot="{ result: jobDetails, loading }"
-                :jobid="dataset.creating_job"
+                :jobId="dataset.creating_job"
                 @error="onError">
                 <div v-if="!loading">
                     <div class="page-container edit-attr">
@@ -24,7 +24,7 @@
                         :tool-stderr="jobDetails.tool_stderr"
                         :job-stderr="jobDetails.job_stderr"
                         :job-messages="jobDetails.job_messages" />
-                    <JobProblemProvider v-slot="{ result: jobProblems }" :jobid="dataset.creating_job" @error="onError">
+                    <JobProblemProvider v-slot="{ result: jobProblems }" :jobId="dataset.creating_job" @error="onError">
                         <div v-if="jobProblems && (jobProblems.has_duplicate_inputs || jobProblems.has_empty_inputs)">
                             <h3 class="common_problems mt-3">Detected Common Potential Problems</h3>
                             <p v-if="jobProblems.has_empty_inputs" id="dataset-error-has-empty-inputs">
diff --git a/client/src/components/JobInformation/JobInformation.vue b/client/src/components/JobInformation/JobInformation.vue
index 213e0b58c7cf..3e2c9bc94f7a 100644
--- a/client/src/components/JobInformation/JobInformation.vue
+++ b/client/src/components/JobInformation/JobInformation.vue
@@ -1,6 +1,6 @@
 <template>
     <div>
-        <job-details-provider auto-refresh :jobid="job_id" @update:result="updateJob" />
+        <job-details-provider auto-refresh :jobId="job_id" @update:result="updateJob" />
         <h3>Job Information</h3>
         <table id="job-information" class="tabletip info_data_table">
             <tbody>
diff --git a/client/src/components/providers/JobProvider.js b/client/src/components/providers/JobProvider.js
index 7090bf963f05..5dcb18a19aea 100644
--- a/client/src/components/providers/JobProvider.js
+++ b/client/src/components/providers/JobProvider.js
@@ -5,8 +5,8 @@ import { rethrowSimple } from "utils/simple-error";
 import { stateIsTerminal } from "./utils";
 import { cleanPaginationParameters } from "./utils";
 
-async function jobDetails({ jobid }) {
-    const url = `${getAppRoot()}api/jobs/${jobid}?full=True`;
+async function jobDetails({ jobId }) {
+    const url = `${getAppRoot()}api/jobs/${jobId}?full=True`;
     try {
         const { data } = await axios.get(url);
         return data;
@@ -15,8 +15,8 @@ async function jobDetails({ jobid }) {
     }
 }
 
-async function jobProblems({ jobid }) {
-    const url = `${getAppRoot()}api/jobs/${jobid}/common_problems`;
+async function jobProblems({ jobId }) {
+    const url = `${getAppRoot()}api/jobs/${jobId}/common_problems`;
     try {
         const { data } = await axios.get(url);
         return data;
diff --git a/client/src/components/providers/SingleQueryProvider.js b/client/src/components/providers/SingleQueryProvider.js
index 8cdc310e5e67..29e56e36bbd2 100644
--- a/client/src/components/providers/SingleQueryProvider.js
+++ b/client/src/components/providers/SingleQueryProvider.js
@@ -1,5 +1,6 @@
 import hash from "object-hash";
 import { LastQueue } from "utils/promise-queue";
+import { HasAttributesMixin } from "./utils";
 
 /**
  * Builds a provider that gets its result from a single promise-based query function and
@@ -14,6 +15,7 @@ import { LastQueue } from "utils/promise-queue";
 export const SingleQueryProvider = (lookup, stopRefresh = (result) => false) => {
     const promiseCache = new Map();
     return {
+        mixins: [HasAttributesMixin],
         props: {
             useCache: {
                 type: Boolean,
@@ -74,7 +76,7 @@ export const SingleQueryProvider = (lookup, stopRefresh = (result) => false) =>
                         promiseCache.set(this.cacheKey, lookupPromise);
                     }
                 } else {
-                    lookupPromise = this.queue.enqueue(lookup, this.$attrs);
+                    lookupPromise = this.queue.enqueue(lookup, this.attributes);
                 }
                 lookupPromise.then(
                     (result) => {
diff --git a/client/src/components/providers/storeProviders.js b/client/src/components/providers/storeProviders.js
index 15cf7a4bdd38..d21aa3d28518 100644
--- a/client/src/components/providers/storeProviders.js
+++ b/client/src/components/providers/storeProviders.js
@@ -3,6 +3,7 @@ import axios from "axios";
 import { prependPath } from "utils/redirect";
 import { mapActions, mapGetters } from "vuex";
 import { mapCacheActions } from "vuex-cache";
+import { HasAttributesMixin } from "./utils";
 
 export const SimpleProviderMixin = {
     props: {
@@ -135,6 +136,7 @@ export const JobProvider = {
  */
 export const StoreProvider = (storeAction, storeGetter, storeCountGetter = undefined) => {
     return {
+        mixins: [HasAttributesMixin],
         watch: {
             $attrs(newVal, oldVal) {
                 if (JSON.stringify(newVal) != JSON.stringify(oldVal)) {
@@ -153,9 +155,6 @@ export const StoreProvider = (storeAction, storeGetter, storeCountGetter = undef
         },
         computed: {
             ...mapGetters([storeGetter, storeCountGetter]),
-            attributes() {
-                return this.toCamelCase(this.$attrs);
-            },
             result() {
                 return this[storeGetter](this.attributes);
             },
@@ -184,14 +183,6 @@ export const StoreProvider = (storeAction, storeGetter, storeCountGetter = undef
                     this.loading = false;
                 }
             },
-            toCamelCase(attributes) {
-                const result = {};
-                for (const key in attributes) {
-                    const newKey = key.replace(/-./g, (x) => x[1].toUpperCase());
-                    result[newKey] = attributes[key];
-                }
-                return result;
-            },
         },
     };
 };
diff --git a/client/src/components/providers/utils.js b/client/src/components/providers/utils.js
index 913de890b9c7..56d3bf6bd9c3 100644
--- a/client/src/components/providers/utils.js
+++ b/client/src/components/providers/utils.js
@@ -5,6 +5,24 @@ export function stateIsTerminal(result) {
     return !JOB_STATES_MODEL.NON_TERMINAL_STATES.includes(result.state);
 }
 
+export const HasAttributesMixin = {
+    computed: {
+        attributes() {
+            return this.toCamelCase(this.$attrs);
+        },
+    },
+    methods: {
+        toCamelCase(attributes) {
+            const result = {};
+            for (const key in attributes) {
+                const newKey = key.replace(/-./g, (x) => x[1].toUpperCase());
+                result[newKey] = attributes[key];
+            }
+            return result;
+        },
+    },
+};
+
 // Adapt bootstrap parameters to Galaxy API. Galaxy consumes snake case parameters
 // and generally uses limit instead of perPage/per_page as a name for this concept.
 export function cleanPaginationParameters(requestParams) {