From 06bdff1976dbfaf2b27ab763a545f9788d837b33 Mon Sep 17 00:00:00 2001
From: Dannon Baker <dannon.baker@gmail.com>
Date: Mon, 28 Nov 2022 15:19:58 -0500
Subject: [PATCH 1/4] Update navigation for collection info

---
 client/src/components/History/Content/ContentItem.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/components/History/Content/ContentItem.vue b/client/src/components/History/Content/ContentItem.vue
index cea253c0df4..ef11920be19 100644
--- a/client/src/components/History/Content/ContentItem.vue
+++ b/client/src/components/History/Content/ContentItem.vue
@@ -219,7 +219,7 @@ export default {
             this.$router.push(this.itemUrls.edit);
         },
         onShowCollectionInfo() {
-            backboneRoute(this.itemUrls.showDetails);
+            this.$router.push(this.itemUrls.showDetails);
         },
         onTags(newTags) {
             this.$emit("tag-change", this.item, newTags);

From 4830c894332fcc437293bb3e74ff1bed1a24e37f Mon Sep 17 00:00:00 2001
From: Dannon Baker <dannon.baker@gmail.com>
Date: Mon, 28 Nov 2022 15:22:06 -0500
Subject: [PATCH 2/4] Use absolute route for jobs display component.

---
 client/src/components/History/Content/ContentItem.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/components/History/Content/ContentItem.vue b/client/src/components/History/Content/ContentItem.vue
index ef11920be19..f0ac87f8d67 100644
--- a/client/src/components/History/Content/ContentItem.vue
+++ b/client/src/components/History/Content/ContentItem.vue
@@ -185,7 +185,7 @@ export default {
                     edit: `/collection/${id}/edit`,
                     showDetails:
                         this.item.job_source_id && this.item.job_source_type === "Job"
-                            ? `jobs/${this.item.job_source_id}/view`
+                            ? `/jobs/${this.item.job_source_id}/view`
                             : null,
                 };
             }

From 9ded4a7ff32879c471ac003f9fae558b06bb465f Mon Sep 17 00:00:00 2001
From: Dannon Baker <dannon.baker@gmail.com>
Date: Mon, 28 Nov 2022 15:59:42 -0500
Subject: [PATCH 3/4] Add keypress handlers alongside click handlers for
 contentItem expansion/contraction

---
 .../components/History/Content/ContentItem.vue    | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/client/src/components/History/Content/ContentItem.vue b/client/src/components/History/Content/ContentItem.vue
index f0ac87f8d67..c53d9423b88 100644
--- a/client/src/components/History/Content/ContentItem.vue
+++ b/client/src/components/History/Content/ContentItem.vue
@@ -4,7 +4,7 @@
         :class="['content-item m-1 p-0 rounded btn-transparent-background', contentCls]"
         :data-hid="id"
         :data-state="state">
-        <div class="p-1 cursor-pointer" draggable @dragstart="onDragStart" @click.stop="onClick">
+        <div class="p-1 cursor-pointer" draggable @dragstart="onDragStart" @click.stop="onClick" @keypress="onClick">
             <div class="d-flex justify-content-between">
                 <span class="p-1 font-weight-bold">
                     <span v-if="selectable" class="selector">
@@ -21,21 +21,28 @@
                             :icon="['far', 'square']"
                             @click.stop="$emit('update:selected', true)" />
                     </span>
-                    <span v-if="highlight == 'input'" v-b-tooltip.hover title="Input" @click.stop="toggleHighlights">
+                    <span
+                        v-if="highlight == 'input'"
+                        v-b-tooltip.hover
+                        title="Input"
+                        @click.stop="toggleHighlights"
+                        @keypress="toggleHighlights">
                         <font-awesome-icon class="text-info" icon="arrow-circle-up" />
                     </span>
                     <span
                         v-else-if="highlight == 'noInputs'"
                         v-b-tooltip.hover
                         title="No Inputs for this item"
-                        @click.stop="toggleHighlights">
+                        @click.stop="toggleHighlights"
+                        @keypress="toggleHighlights">
                         <font-awesome-icon icon="minus-circle" />
                     </span>
                     <span
                         v-else-if="highlight == 'output'"
                         v-b-tooltip.hover
                         title="Inputs highlighted for this item"
-                        @click.stop="toggleHighlights">
+                        @click.stop="toggleHighlights"
+                        @keypress="toggleHighlights">
                         <font-awesome-icon icon="check-circle" />
                     </span>
                     <span v-if="hasStateIcon" class="state-icon">

From 42487222757c89a689c53fc8f90c8bdbb979616a Mon Sep 17 00:00:00 2001
From: Dannon Baker <dannon.baker@gmail.com>
Date: Mon, 28 Nov 2022 16:04:17 -0500
Subject: [PATCH 4/4] Make contentItem containers tabbable, so you can
 expand/contract with keyboard at the toplevel.

---
 client/src/components/History/Content/ContentItem.vue | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/client/src/components/History/Content/ContentItem.vue b/client/src/components/History/Content/ContentItem.vue
index c53d9423b88..bda15748c7e 100644
--- a/client/src/components/History/Content/ContentItem.vue
+++ b/client/src/components/History/Content/ContentItem.vue
@@ -4,7 +4,13 @@
         :class="['content-item m-1 p-0 rounded btn-transparent-background', contentCls]"
         :data-hid="id"
         :data-state="state">
-        <div class="p-1 cursor-pointer" draggable @dragstart="onDragStart" @click.stop="onClick" @keypress="onClick">
+        <div
+            class="p-1 cursor-pointer"
+            draggable
+            tabindex="0"
+            @dragstart="onDragStart"
+            @click.stop="onClick"
+            @keypress="onClick">
             <div class="d-flex justify-content-between">
                 <span class="p-1 font-weight-bold">
                     <span v-if="selectable" class="selector">
@@ -25,6 +31,7 @@
                         v-if="highlight == 'input'"
                         v-b-tooltip.hover
                         title="Input"
+                        tabindex="0"
                         @click.stop="toggleHighlights"
                         @keypress="toggleHighlights">
                         <font-awesome-icon class="text-info" icon="arrow-circle-up" />
@@ -33,6 +40,7 @@
                         v-else-if="highlight == 'noInputs'"
                         v-b-tooltip.hover
                         title="No Inputs for this item"
+                        tabindex="0"
                         @click.stop="toggleHighlights"
                         @keypress="toggleHighlights">
                         <font-awesome-icon icon="minus-circle" />
@@ -41,6 +49,7 @@
                         v-else-if="highlight == 'output'"
                         v-b-tooltip.hover
                         title="Inputs highlighted for this item"
+                        tabindex="0"
                         @click.stop="toggleHighlights"
                         @keypress="toggleHighlights">
                         <font-awesome-icon icon="check-circle" />