Merge latest 24.2 into dev.

client/package.json

@@ -66,6 +66,7 @@
     "elkjs": "^0.8.2",
     "file-saver": "^2.0.5",
     "flush-promises": "^1.0.2",
+    "font-awesome-6": "npm:@fortawesome/free-solid-svg-icons@6",
     "glob": "^10.3.10",
     "handsontable": "^4.0.0",
     "hsluv": "^1.0.1",

client/src/api/schema/schema.ts

@@ -18464,6 +18464,8 @@ export interface components {
          *     }
          */
         WorkflowJobMetric: {
+            /** Job Id */
+            job_id: string;
             /**
              * Name
              * @description The name of the metric variable.

client/src/components/ActivityBar/ActivityBar.vue

@@ -189,6 +189,10 @@ function setActiveSideBar(key: string) {
     activityStore.toggledSideBar = key;
 }
 
+const canDrag = computed(() => {
+    return isActiveSideBar("settings");
+});
+
 defineExpose({
     isActiveSideBar,
     setActiveSideBar,
@@ -209,14 +213,18 @@ defineExpose({
                 <draggable
                     :list="activities"
                     :class="{ 'activity-popper-disabled': isDragging }"
+                    :disabled="!canDrag"
                     :force-fallback="true"
                     chosen-class="activity-chosen-class"
                     :delay="DRAG_DELAY"
                     drag-class="activity-drag-class"
                     ghost-class="activity-chosen-class"
                     @start="isDragging = true"
                     @end="isDragging = false">
-                    <div v-for="(activity, activityIndex) in activities" :key="activityIndex">
+                    <div
+                        v-for="(activity, activityIndex) in activities"
+                        :key="activityIndex"
+                        :class="{ 'can-drag': canDrag }">
                         <div v-if="activity.visible && (activity.anonymous || !isAnonymous)">
                             <UploadItem
                                 v-if="activity.id === 'upload'"
@@ -380,4 +388,11 @@ defineExpose({
     overflow-y: auto;
     overflow-x: hidden;
 }
+
+.can-drag {
+    border-radius: 12px;
+    border: 1px;
+    outline: dashed darkgray;
+    outline-offset: -3px;
+}
 </style>

client/src/components/Collections/CollectionCreatorModal.vue

@@ -113,22 +113,25 @@ watch(
     }
 );
 
+const extensionInTitle = computed<string>(() => {
+    const extensions = props.extensions;
+    if (!extensions || extensions.length == 0 || extensions.indexOf("data") >= 0) {
+        return "";
+    } else {
+        return orList(extensions);
+    }
+});
+
 const modalTitle = computed(() => {
     if (props.collectionType === "list") {
-        return localize(
-            `Create a collection from a list of ${fromSelection.value ? "selected" : ""} ${
-                props.extensions?.length ? orList(props.extensions) : ""
-            } datasets`
-        );
+        return localize(`Create a list of ${fromSelection.value ? "selected" : ""} ${extensionInTitle.value} datasets`);
     } else if (props.collectionType === "list:paired") {
         return localize(
-            `Create a collection of ${fromSelection.value ? "selected" : ""} ${
-                props.extensions?.length ? orList(props.extensions) : ""
-            } dataset pairs`
+            `Create a list of ${fromSelection.value ? "selected" : ""} ${extensionInTitle.value} paired datasets`
         );
     } else if (props.collectionType === "paired") {
         return localize(
-            `Create a ${props.extensions?.length ? orList(props.extensions) : ""} dataset pair collection ${
+            `Create a ${extensionInTitle.value} paired dataset collection ${
                 fromSelection.value ? "from selected items" : ""
             }`
         );

client/src/components/Collections/ListCollectionCreator.vue

@@ -412,28 +412,38 @@ function renameElement(element: any, name: string) {
                 :history-id="props.historyId"
                 :hide-source-items="hideSourceItems"
                 :extensions="extensions"
+                collection-type="list"
                 :no-items="props.initialElements.length == 0 && !props.fromSelection"
                 @add-uploaded-files="addUploadedFiles"
                 @on-update-datatype-toggle="changeDatatypeFilter"
                 @onUpdateHideSourceItems="onUpdateHideSourceItems"
                 @clicked-create="clickedCreate">
                 <template v-slot:help-content>
-                    <!-- TODO: Update help content for case where `fromSelection` is false -->
                     <p>
                         {{
                             localize(
                                 [
-                                    "Collections of datasets are permanent, ordered lists of datasets that can be passed to tools ",
+                                    "This interface allows you to build a new Galaxy list of datasets. ",
+                                    "A list is a type of Galaxy dataset collection that is a permanent, ordered list of datasets that can be passed to tools ",
                                     "and workflows in order to have analyses done on each member of the entire group. This interface allows ",
-                                    "you to create a collection and re-order the final collection.",
+                                    "you to create and re-order a list of datasets. The datasets in a Galaxy collection have an identifier that is preserved accross ",
+                                    "tool executions and serves as a form of sample tracking - setting the name in this form will pick the identifier for that element ",
+                                    "of the list but will not change the dataset's actual name in Galaxy.",
                                 ].join("")
                             )
                         }}
                     </p>
 
                     <ul>
+                        <li v-if="!fromSelection">
+                            Move datsets from the "Unselected" column to the "Selected" column below to compose the list
+                            in the intended order and with the intended datasets.
+                        </li>
+                        <li v-if="!fromSelection">
+                            The filter textbox can be used to rapidly find the datasets of interest by name.
+                        </li>
                         <li>
-                            {{ localize("Rename elements in the list by clicking on") }}
+                            {{ localize("Change the identifier of elements in the list by clicking on") }}
                             <i data-target=".collection-element .name">
                                 {{ localize("the existing name") }}
                             </i>
@@ -442,13 +452,16 @@ function renameElement(element: any, name: string) {
 
                         <li>
                             {{ localize("Discard elements from the final created list by clicking on the ") }}
-                            <i data-target=".collection-element .discard">
-                                {{ localize("Discard") }}
+                            <i v-if="fromSelection" data-target=".collection-element .discard">
+                                {{ localize("Remove") }}
+                            </i>
+                            <i v-else data-target=".collection-element .discard">
+                                {{ localize("discard") }}
                             </i>
                             {{ localize("button.") }}
                         </li>
 
-                        <li>
+                        <li v-if="fromSelection">
                             {{
                                 localize(
                                     "Reorder the list by clicking and dragging elements. Select multiple elements by clicking on"
@@ -468,15 +481,15 @@ function renameElement(element: any, name: string) {
                             {{ localize("link.") }}
                         </li>
 
-                        <li>
+                        <li v-if="fromSelection">
                             {{ localize("Click ") }}
                             <i data-target=".reset">
                                 <FontAwesomeIcon :icon="faUndo" />
                             </i>
                             {{ localize("to begin again as if you had just opened the interface.") }}
                         </li>
 
-                        <li>
+                        <li v-if="fromSelection">
                             {{ localize("Click ") }}
                             <i data-target=".sort-items">
                                 <FontAwesomeIcon :icon="faSortAlphaDown" />

client/src/components/Collections/PairCollectionCreator.vue

@@ -374,6 +374,7 @@ function _naiveStartingAndEndingLCS(s1: string, s2: string) {
                 :suggested-name="initialSuggestedName"
                 :extensions="props.extensions"
                 :extensions-toggle="removeExtensions"
+                collection-type="paired"
                 :no-items="props.initialElements.length == 0 && !props.fromSelection"
                 @add-uploaded-files="addUploadedFiles"
                 @onUpdateHideSourceItems="onUpdateHideSourceItems"
@@ -423,7 +424,7 @@ function _naiveStartingAndEndingLCS(s1: string, s2: string) {
                         <i data-target=".collection-name"> {{ localize("name") }}</i>
                         {{ localize("and click ") }}
                         <i data-target=".create-collection">
-                            {{ localize("Create list") }}
+                            {{ localize("Create dataset pair") }}
                         </i>
                         {{ localize(".") }}
                     </p>

client/src/components/Collections/PairedListCollectionCreator.vue

@@ -93,6 +93,14 @@ const hasFilter = computed(() => forwardFilter.value || reverseFilter.value);
 const strategy = ref(autoPairLCS);
 const duplicatePairNames = ref<string[]>([]);
 
+const canClearFilters = computed(() => {
+    return forwardFilter.value || reverseFilter.value;
+});
+
+const canAutoPair = computed(() => {
+    return forwardFilter.value && reverseFilter.value && pairableElements.value.length > 0;
+});
+
 const forwardElements = computed<HDASummary[]>(() => {
     return filterElements(workingElements.value, forwardFilter.value);
 });
@@ -117,7 +125,11 @@ const autoPairButton = computed(() => {
     let variant;
     let icon;
     let text;
-    if (!firstAutoPairDone.value && pairableElements.value.length > 0) {
+    if (!canAutoPair.value) {
+        variant = "secondary";
+        icon = faLink;
+        text = localize("Specify simple filters to divide datasets into forward and reverse reads for pairing.");
+    } else if (!firstAutoPairDone.value && pairableElements.value.length > 0) {
         variant = "primary";
         icon = faExclamationCircle;
         text = localize("Click to auto-pair datasets based on the current filters");
@@ -235,8 +247,11 @@ function initialFiltersSet() {
             illumina++;
         }
     });
-
-    if (illumina > dot12s && illumina > Rs) {
+    // if we cannot filter don't set an initial filter and hide all the data
+    if (illumina == 0 && dot12s == 0 && Rs == 0) {
+        forwardFilter.value = "";
+        reverseFilter.value = "";
+    } else if (illumina > dot12s && illumina > Rs) {
         changeFilters("illumina");
     } else if (dot12s > illumina && dot12s > Rs) {
         changeFilters("dot12s");
@@ -864,6 +879,7 @@ function _naiveStartingAndEndingLCS(s1: string, s2: string) {
                 render-extensions-toggle
                 :extensions-toggle="removeExtensions"
                 :extensions="extensions"
+                collection-type="list:paired"
                 :no-items="props.initialElements.length == 0 && !props.fromSelection"
                 @add-uploaded-files="addUploadedFiles"
                 @onUpdateHideSourceItems="hideSourceItems = $event"
@@ -875,9 +891,10 @@ function _naiveStartingAndEndingLCS(s1: string, s2: string) {
                         {{
                             localize(
                                 [
-                                    "Collections of paired datasets are ordered lists of dataset pairs (often forward and reverse reads). ",
-                                    "These collections can be passed to tools and workflows in order to have analyses done on each member of ",
-                                    "the entire group. This interface allows you to create a collection, choose which datasets are paired, ",
+                                    "This interface allows you to build a new Galaxy list of pairs. List of pairs are an ordered list of ",
+                                    "individual dataset paired together in their own paired collection (often forward and reverse reads). ",
+                                    "These lists can be passed to tools and workflows in order to have analyses done on each member of ",
+                                    "the entire group. This interface allows you to create such a list of paired datasets, choose which datasets are paired, ",
                                     "and re-order the final collection.",
                                 ].join("")
                             )
@@ -994,7 +1011,7 @@ function _naiveStartingAndEndingLCS(s1: string, s2: string) {
                         </i>
                         {{ localize("and click ") }}
                         <i data-target=".create-collection">
-                            {{ localize("Create list") }}
+                            {{ localize("Create list or pairs") }}
                         </i>
                         {{ localize(". (Note: you do not have to pair all unpaired datasets to finish.)") }}
                     </p>
@@ -1133,6 +1150,7 @@ function _naiveStartingAndEndingLCS(s1: string, s2: string) {
                                         <BButtonGroup vertical>
                                             <BButton
                                                 class="clear-filters-link"
+                                                :disabled="!canClearFilters"
                                                 size="sm"
                                                 :variant="hasFilter ? 'danger' : 'secondary'"
                                                 @click="clickClearFilters">
@@ -1141,6 +1159,7 @@ function _naiveStartingAndEndingLCS(s1: string, s2: string) {
                                             </BButton>
                                             <BButton
                                                 class="autopair-link"
+                                                :disabled="!canAutoPair"
                                                 size="sm"
                                                 :title="autoPairButton.text"
                                                 :variant="autoPairButton.variant"
@@ -1309,6 +1328,8 @@ $fa-font-path: "../../../node_modules/@fortawesome/fontawesome-free/webfonts/";
 @import "~@fortawesome/fontawesome-free/scss/solid";
 @import "~@fortawesome/fontawesome-free/scss/fontawesome";
 @import "~@fortawesome/fontawesome-free/scss/brands";
+@import "~bootstrap/scss/_functions.scss";
+@import "theme/blue.scss";
 .paired-column {
     text-align: center;
     // mess with these two to make center more/scss priority
@@ -1355,7 +1376,7 @@ li.dataset.paired {
             white-space: nowrap;
             overflow: hidden;
             border: 2px solid grey;
-            background: #aff1af;
+            background: $state-success-bg;
             text-align: center;
             span {
                 display: inline-block;

client/src/components/Collections/common/CollectionCreator.vue

@@ -39,6 +39,7 @@
     extensions?: string[];
     extensionsToggle?: boolean;
     noItems?: boolean;
+    collectionType?: string;
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -102,6 +103,19 @@
     }
 });
 
+const shortWhatIsBeingCreated = computed<string>(() => {
+    // plain language for what is being created
+    if (props.collectionType === "list") {
+        return "list";
+    } else if (props.collectionType === "list:paired") {
+        return "list of pairs";
+    } else if (props.collectionType == "paired") {
+        return "dataset pair";
+    } else {
+        return "collection";
+    }
+});
+
 function addUploadedFiles(value: HDASummary[]) {
     // TODO: We really need to wait for each of these items to get `state = 'ok'`
     //       before we can add them to the collection.
@@ -222,7 +236,7 @@
                                     id="collection-name"
                                     v-model="collectionName"
                                     class="collection-name"
-                                    :placeholder="localize('Enter a name for your new collection')"
+                                    :placeholder="localize('Enter a name for your new ' + shortWhatIsBeingCreated)"
                                     size="sm"
                                     required
                                     :state="!collectionName ? false : null" />
@@ -240,7 +254,7 @@
                             variant="primary"
                             :disabled="!validInput"
                             @click="emit('clicked-create', collectionName)">
-                            {{ localize("Create collection") }}
+                            {{ localize("Create " + shortWhatIsBeingCreated) }}
                         </BButton>
                     </div>
                 </div>

client/src/components/Form/Elements/FormData/FormData.vue

@@ -607,10 +607,20 @@ watch(
 const formatsVisible = ref(false);
 const formatsButtonId = useUid("form-data-formats-");
 
+function collectionTypeToText(collectionType: string): string {
+    if (collectionType == "list:paired") {
+        return "list of pairs";
+    } else {
+        return collectionType;
+    }
+}
+
 const warningListAmount = 4;
 const noOptionsWarningMessage = computed(() => {
     const itemType = props.type === "data" ? "datasets" : "dataset collections";
-    const collectionTypeLabel = props.collectionTypes?.length ? `${orList(props.collectionTypes)} ` : "";
+    const collectionTypeLabel = props.collectionTypes?.length
+        ? `${orList(props.collectionTypes.map(collectionTypeToText))} `
+        : "";
     if (!props.extensions || props.extensions.length === 0 || props.extensions.includes("data")) {
         return `No ${collectionTypeLabel}${itemType} available`;
     } else if (props.extensions.length <= warningListAmount) {

client/src/components/Help/HelpText.vue

@@ -4,9 +4,12 @@ import HelpPopover from "./HelpPopover.vue";
 interface Props {
     uri: string;
     text: string;
+    forTitle?: boolean;
 }
 
-defineProps<Props>();
+withDefaults(defineProps<Props>(), {
+    forTitle: false,
+});
 </script>
 
 <template>
@@ -18,7 +21,7 @@ defineProps<Props>();
                 }
             "
             :term="uri" />
-        <span ref="helpTarget" class="help-text">{{ text }}</span>
+        <span ref="helpTarget" class="help-text" :class="{ 'title-help-text': forTitle }">{{ text }}</span>
     </span>
 </template>
 
@@ -28,4 +31,7 @@ defineProps<Props>();
     text-decoration-line: underline;
     text-decoration-style: dashed;
 }
+.title-help-text {
+    text-decoration-thickness: 1px;
+}
 </style>