From 417297683973b1c145f926450f477b1b2bca1488 Mon Sep 17 00:00:00 2001
From: Stephanie Smith <stephiescastle@users.noreply.github.com>
Date: Tue, 27 Aug 2024 17:48:22 -0700
Subject: [PATCH] fixing jump menu links in mobile menu, adding readtime to
 teachable moments, fixing about the author heading spacing (#575)

---
 packages/vue/src/components/AboutTheAuthor/AboutTheAuthor.vue  | 2 +-
 packages/vue/src/interfaces.ts                                 | 1 +
 .../edu/PageEduCollectionsDetail/PageEduCollectionsDetail.vue  | 2 +-
 .../edu/PageEduExplainerArticle/PageEduExplainerArticle.vue    | 2 +-
 packages/vue/src/templates/edu/PageEduLesson/PageEduLesson.vue | 1 -
 .../src/templates/edu/PageEduNewsDetail/PageEduNewsDetail.vue  | 2 +-
 .../PageEduTeachableMoment/PageEduTeachableMoment.stories.js   | 1 +
 .../edu/PageEduTeachableMoment/PageEduTeachableMoment.vue      | 3 ++-
 8 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/packages/vue/src/components/AboutTheAuthor/AboutTheAuthor.vue b/packages/vue/src/components/AboutTheAuthor/AboutTheAuthor.vue
index 721bd548..c053bca3 100644
--- a/packages/vue/src/components/AboutTheAuthor/AboutTheAuthor.vue
+++ b/packages/vue/src/components/AboutTheAuthor/AboutTheAuthor.vue
@@ -28,7 +28,7 @@ const headingString = computed(() => {
 </script>
 <template>
   <div class="AboutTheAuthor">
-    <h3 class="text-h4 sm:ml-[130px] pl-10 mb-6">
+    <h3 class="text-h4 sm:ml-[130px] sm:pl-10 mb-6">
       {{ headingString }}
     </h3>
     <template
diff --git a/packages/vue/src/interfaces.ts b/packages/vue/src/interfaces.ts
index 1d7843ae..8a6df494 100644
--- a/packages/vue/src/interfaces.ts
+++ b/packages/vue/src/interfaces.ts
@@ -223,6 +223,7 @@ export interface PageObject {
   slug: string
   url: string
   title: string
+  readTime?: string
   getTopicsForDisplay?: Topic[]
   showJumpMenu?: boolean
   label?: string
diff --git a/packages/vue/src/templates/edu/PageEduCollectionsDetail/PageEduCollectionsDetail.vue b/packages/vue/src/templates/edu/PageEduCollectionsDetail/PageEduCollectionsDetail.vue
index 7cc3ce81..bd291b82 100644
--- a/packages/vue/src/templates/edu/PageEduCollectionsDetail/PageEduCollectionsDetail.vue
+++ b/packages/vue/src/templates/edu/PageEduCollectionsDetail/PageEduCollectionsDetail.vue
@@ -63,10 +63,10 @@ const computedClass = computed((): string => {
     />
 
     <NavJumpMenu
+      v-if="data.showJumpMenu"
       ref="PageEduCollectionsDetailJumpMenu"
       :title="data.title"
       :blocks="data.body"
-      :enabled="data.showJumpMenu"
       dropdown-text="In this collection"
     />
 
diff --git a/packages/vue/src/templates/edu/PageEduExplainerArticle/PageEduExplainerArticle.vue b/packages/vue/src/templates/edu/PageEduExplainerArticle/PageEduExplainerArticle.vue
index 92c8ae12..e46964d2 100644
--- a/packages/vue/src/templates/edu/PageEduExplainerArticle/PageEduExplainerArticle.vue
+++ b/packages/vue/src/templates/edu/PageEduExplainerArticle/PageEduExplainerArticle.vue
@@ -120,9 +120,9 @@ export default defineComponent({
     </LayoutHelper>
 
     <NavJumpMenu
+      v-if="data.showJumpMenu"
       :title="data.title"
       :blocks="data.body"
-      :enabled="data.showJumpMenu"
       dropdown-text="In this article"
     />
     <!-- inline hero content -->
diff --git a/packages/vue/src/templates/edu/PageEduLesson/PageEduLesson.vue b/packages/vue/src/templates/edu/PageEduLesson/PageEduLesson.vue
index a881a628..c04eb69a 100644
--- a/packages/vue/src/templates/edu/PageEduLesson/PageEduLesson.vue
+++ b/packages/vue/src/templates/edu/PageEduLesson/PageEduLesson.vue
@@ -326,7 +326,6 @@ const consolidatedSections = computed((): EduLessonSectionObject[] => {
       ref="PageEduLessonJumpMenu"
       :title="data.title"
       :blocks="consolidatedBlocks"
-      :enabled="true"
       dropdown-text="In this lesson"
     />
 
diff --git a/packages/vue/src/templates/edu/PageEduNewsDetail/PageEduNewsDetail.vue b/packages/vue/src/templates/edu/PageEduNewsDetail/PageEduNewsDetail.vue
index b3e11405..dfffc7f4 100644
--- a/packages/vue/src/templates/edu/PageEduNewsDetail/PageEduNewsDetail.vue
+++ b/packages/vue/src/templates/edu/PageEduNewsDetail/PageEduNewsDetail.vue
@@ -69,10 +69,10 @@ defineExpose({
     itemtype="http://schema.org/Article"
   >
     <NavJumpMenu
+      v-if="data.showJumpMenu"
       ref="PageEduNewsDetailJumpMenu"
       :title="data.title"
       :blocks="data.body"
-      :enabled="data.showJumpMenu"
       dropdown-text="In this news article"
     />
 
diff --git a/packages/vue/src/templates/edu/PageEduTeachableMoment/PageEduTeachableMoment.stories.js b/packages/vue/src/templates/edu/PageEduTeachableMoment/PageEduTeachableMoment.stories.js
index 0ee53ec6..bb0ecfe6 100644
--- a/packages/vue/src/templates/edu/PageEduTeachableMoment/PageEduTeachableMoment.stories.js
+++ b/packages/vue/src/templates/edu/PageEduTeachableMoment/PageEduTeachableMoment.stories.js
@@ -42,6 +42,7 @@ export const BaseStory = {
       url: 'http://localhost:3000/edu/resources/teachable-moment',
       pageType: 'EDUTeachableMomentPage',
       contentType: 'edu_resources.EDUTeachableMomentPage',
+      readTime: '5 min read',
       showJumpMenu: true,
       thumbnailImage: {
         __typename: 'CustomImage',
diff --git a/packages/vue/src/templates/edu/PageEduTeachableMoment/PageEduTeachableMoment.vue b/packages/vue/src/templates/edu/PageEduTeachableMoment/PageEduTeachableMoment.vue
index f560f171..5567b19e 100644
--- a/packages/vue/src/templates/edu/PageEduTeachableMoment/PageEduTeachableMoment.vue
+++ b/packages/vue/src/templates/edu/PageEduTeachableMoment/PageEduTeachableMoment.vue
@@ -67,10 +67,10 @@ const computedClass = computed((): string => {
     :class="computedClass"
   >
     <NavJumpMenu
+      v-if="data.showJumpMenu"
       ref="PageEduTeachableMomentJumpMenu"
       :title="data.title"
       :blocks="data.body"
-      :enabled="data.showJumpMenu"
       dropdown-text="In this Teachable Moment"
     />
 
@@ -97,6 +97,7 @@ const computedClass = computed((): string => {
     >
       <DetailHeadline
         :title="data.title"
+        :read-time="data.readTime"
         label="Teachable Moment"
         pill
       />