feat: APPS-2468 BannerText component (#424)

* fix: changes from rebase * feat: add BannerText comp, spec, stories * fix: use of index in v-for directive * feat: add BannerHeader comp, spec, stories, types * fix: rebase * fix: syntax update * fix: syntax update * fix: syntax updates * task: remove commented out code --------- Co-authored-by: tinuola <[email protected]>
UCLALibrary · Dec 15, 2023 · 54c5b76 · 54c5b76 · github-actions · Dec 15, 2023
1 parent 5e3bb75
commit 54c5b76
Show file tree

Hide file tree

Showing 13 changed files with 931 additions and 13 deletions.
diff --git a/src/lib-components/BannerFeatured.vue b/src/lib-components/BannerFeatured.vue
@@ -34,7 +34,7 @@ import getSectionName from '@/utils/getSectionName'
 const props = defineProps({
   image: {
     type: Object as PropType<ImageItemType>,
-    default: () => ({}),
+    default: () => {},
   },
   title: {
     type: String,

diff --git a/src/lib-components/BannerHeader.vue b/src/lib-components/BannerHeader.vue
@@ -17,7 +17,7 @@ import ResponsiveImage from '@/lib-components/ResponsiveImage.vue'
 // Enable BlockForm in template
 // import BlockForm from '@/lib-components/BlockForm.vue'
 
-import type { BylineItemType, ImageItemType, LocationItemType, SubjectAreaItemType } from '@/types/types'
+import type { ImageItemType, LocationItemType, SubjectAreaItemType } from '@/types/types'
 
 // Utility functions
 import formatEventTimes from '@/utils/formatEventTimes'
@@ -27,7 +27,7 @@ import getSectionName from '@/utils/getSectionName'
 const props = defineProps({
   image: {
     type: Object as PropType<ImageItemType>,
-    default: () => ({}),
+    default: () => {},
   },
   title: {
     type: String,
@@ -38,7 +38,7 @@ const props = defineProps({
     default: '',
   },
   byline: {
-    type: Array as PropType<BylineItemType>,
+    type: Array as PropType<string[]>,
     default: () => [],
   },
   contributors: {
@@ -291,15 +291,15 @@ const parsedLocations = computed(() => {
           <div v-if="byline.length" class="byline-item">
             <div
               v-for="(item, index) in byline"
-              :key="index"
+              :key="`${item}-${index}`"
               class="byline-item"
             >
               {{ item }}
             </div>
           </div>
 
           <div v-if="subjectAreas.length" class="subject-areas">
-            <div v-for="(item, index) in subjectAreas" :key="index">
+            <div v-for="(item, index) in subjectAreas" :key="`${item.title}-${index}`">
               {{ item.title }}
             </div>
           </div>