adding mapping for edu events and elastic search

packages/vue/src/components/BasePill/BasePill.vue

@@ -18,6 +18,7 @@ const sizeMap: Attributes = {
 }
 
 interface BasePillProps {
+  text?: string
   variant?: string
   size?: string
   contentType?: string
@@ -44,14 +45,16 @@ const metadataAttrs = computed(() => {
   }
   return { variant: undefined, label: undefined }
 })
+const theText = computed(() => {
+  return props.text || metadataAttrs.value.label
+})
 </script>
 <template>
   <p
     :class="`${variantMap[metadataAttrs.variant || props.variant]} ${sizeMap[props.size]}`"
     class="ThemeVariantLight text-contrast-none inline-block text-white font-bold edu:font-extrabold rounded-full leading-tight m-0 uppercase print:border-none print:px-0"
   >
-    <template v-if="metadataAttrs.label"> {{ metadataAttrs.label }} </template>
-    <template v-else> <slot /></template>
+    {{ theText }}
     <span class="sr-only">.</span>
   </p>
 </template>

packages/vue/src/components/BlockLinkCard/BlockLinkCard.vue

@@ -47,9 +47,8 @@
           :class="{ 'mb-2': !large, 'mb-4': large }"
           size="sm"
           :content-type="metadataType"
-        >
-          {{ (theItem as EventCardObject).eventType }}
-        </BasePill>
+          :text="(theItem as EventCardObject).eventType"
+        />
       </template>
       <template
         v-else-if="themeStore.isEdu && theItem.parent?.title && theItem.parent?.title !== 'EDU'"
@@ -117,7 +116,7 @@
         <MetadataEvent
           v-if="metadataType === 'EDUEventPage'"
           :event="theItem"
-          :show-time="false"
+          :show-time="large"
           :show-location="false"
           compact
         />

packages/vue/src/components/BlockLinkCardList/BlockLinkCardList.vue

@@ -20,6 +20,7 @@ const props = withDefaults(defineProps<BlockLinkCardListProps>(), {
       :class="{ 'pt-3': index !== 0 }"
       :data="item"
       size="lg"
+      show-calendar-chip
     />
   </div>
 </template>

packages/vue/src/components/DetailHeadline/DetailHeadline.vue

@@ -9,9 +9,8 @@
           :variant="pillColor"
           size="lg"
           class="mr-3"
-        >
-          {{ pillLabel }}
-        </BasePill>
+          :text="pillLabel"
+        />
       </template>
       <template v-else>
         <div

packages/vue/src/components/HeroLarge/HeroLarge.vue

@@ -40,9 +40,8 @@
                 size="lg"
                 class="mr-3"
                 :content-type="customPillType"
-              >
-                {{ customPill }}
-              </BasePill>
+                :text="customPill"
+              />
               <div
                 v-else-if="label"
                 class="font-secondary text-base font-semibold tracking-wider no-underline uppercase"

packages/vue/src/components/HeroMedium/HeroMedium.vue

@@ -61,9 +61,8 @@
               size="sm"
               class="mr-3"
               :content-type="customPillType"
-            >
-              {{ customPill }}
-            </BasePill>
+              :text="customPill"
+            />
             <p
               v-if="customLabel || feature.label"
               class="text-subtitle"

packages/vue/src/components/SearchResultCard/SearchResultCard.vue

@@ -20,10 +20,13 @@
           startDate,
           endTime,
           endDate,
+          customDate,
           location,
-          eventType: eventType
+          eventType: eventType,
+          ongoing
         }
       }"
+      show-calendar-chip
     />
     <EventCard
       v-else-if="isEvents"
@@ -320,6 +323,11 @@ export default defineComponent({
       required: false,
       default: undefined
     },
+    customDate: {
+      type: String,
+      required: false,
+      default: undefined
+    },
     location: {
       type: String,
       required: false,
@@ -328,6 +336,10 @@ export default defineComponent({
     pageContentType: {
       type: String,
       default: undefined
+    },
+    ongoing: {
+      type: Boolean,
+      default: false
     }
   },
   computed: {

packages/vue/src/components/SearchResultsList/SearchResultsList.vue

@@ -23,10 +23,13 @@
           :topic="page.topic"
           :image="page.image"
           :date="page.date"
+          :custom-date="page.customDate"
           :start-date="page.startDate"
           :end-date="page.endDate"
           :start-time="page.startTime"
           :end-time="page.endTime"
+          :event-type="page.eventType"
+          :ongoing="page.ongoing"
           :location="page.location"
           :title="page.title"
           :summary="page.summary"
@@ -57,6 +60,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue'
 import type { ElasticSearchPage } from '../../interfaces'
+
 // @ts-ignore
 import dayjs from 'dayjs'
 import SearchResultCard from './../SearchResultCard/SearchResultCard.vue'
@@ -131,6 +135,8 @@ export default defineComponent({
               const pageType = page._source[handle + '__label']
               if (handle === 'events_eventpage') {
                 date = 'Event date: ' + parseDate(page._source[handle + '__start_datetime'])
+              } else if (handle === 'edu_events_edueventpage') {
+                date = null
               } else if (handle === 'missions_mission') {
                 date = page._source.display_date_filter
                   ? 'Launch date: ' + page._source.display_date_filter
@@ -155,13 +161,37 @@ export default defineComponent({
               page.topic = topic
               // properties for event's page
               page.location =
-                handle === 'events_eventpage' ? page._source[handle + '__location'] : null
+                handle === 'events_eventpage' || handle === 'edu_events_edueventpage'
+                  ? page._source[handle + '__location'] | page._source[handle + '__location_name']
+                  : null
               page.startDate =
-                handle === 'events_eventpage' ? page._source[handle + '__start_datetime'] : null
+                handle === 'events_eventpage' || handle === 'edu_events_edueventpage'
+                  ? page._source[handle + '__start_datetime']
+                  : null
               page.endDate =
-                handle === 'events_eventpage' ? page._source[handle + '__end_datetime'] : null
+                handle === 'events_eventpage' || handle === 'edu_events_edueventpage'
+                  ? page._source[handle + '__end_datetime']
+                  : null
               page.startTime =
-                handle === 'events_eventpage' ? page._source[handle + '__start_time_string'] : null
+                handle === 'events_eventpage' || handle === 'edu_events_edueventpage'
+                  ? page._source[handle + '__start_time_string']
+                  : null
+              page.endTime =
+                handle === 'events_eventpage' || handle === 'edu_events_edueventpage'
+                  ? page._source[handle + '__end_time_string']
+                  : null
+              page.eventType =
+                handle === 'edu_events_edueventpage'
+                  ? page._source.edu_events_edueventpage__event_type_label_filter
+                  : undefined
+              page.customDate =
+                handle === 'edu_events_edueventpage'
+                  ? page._source.edu_events_edueventpage__custom_date
+                  : undefined
+              page.ongoing =
+                handle === 'edu_events_edueventpage'
+                  ? page._source.edu_events_edueventpage__ongoing
+                  : undefined
               // properties that are different for profiles page
               page.summary =
                 handle === 'profiles_profilepage'

packages/vue/src/constants.ts

@@ -2,6 +2,7 @@ import type { DictionaryInterface, PillDictionaryInterface } from './interfaces'
 
 export const eduMetadataDictionary: PillDictionaryInterface = {
   EDUEventPage: {
+    label: 'Event',
     variant: 'primary',
     icons: 'primary',
     type: 'event'
@@ -73,9 +74,9 @@ export const searchContentTypeToPageType: DictionaryInterface = {
   news_news: 'News',
   events_eventpage: 'EventPage',
   missions_mission: 'Mission',
-  eduevents_edueventpage: 'EDUEventPage',
-  eduresources_educollectionsdetailpage: 'EDUCollectionsDetailPage',
-  eduresources_eduexplainerarticlepage: 'EDUExplainerArticlePage',
-  eduresources_edulessonpage: 'EDULessonPage',
-  eduresources_eduteachablemomentpage: 'EDUTeachableMomentPage'
+  edu_events_edueventpage: 'EDUEventPage',
+  edu_resources_educollectionsdetailpage: 'EDUCollectionsDetailPage',
+  edu_resources_eduexplainerarticlepage: 'EDUExplainerArticlePage',
+  edu_resources_edulessonpage: 'EDULessonPage',
+  edu_resources_eduteachablemomentpage: 'EDUTeachableMomentPage'
 }

packages/vue/src/interfaces.ts

@@ -79,16 +79,19 @@ export interface ElasticSearchPage {
   content_type: string
   url: string
   type: string
-  topic: string
-  image: string | any
-  date: string
-  startDate: string
-  endDate: string
-  startTime: string
-  endTime: string
-  location: string
+  topic?: string
+  image?: string | any
+  date?: string
+  startDate?: string
+  endDate?: string
+  customDate?: string
+  startTime?: string
+  endTime?: string
+  location?: string
   title: string
-  summary: string
+  summary?: string
+  eventType?: string
+  ongoing?: boolean
 }
 
 export interface FormOption {

packages/vue/src/templates/edu/PageEduEventDetail/PageEduEventDetail.vue

@@ -36,9 +36,8 @@
         <BasePill
           variant="primary"
           size="lg"
-        >
-          {{ data.eventType }}
-        </BasePill>
+          :text="data.eventType"
+        />
       </div>
       <BaseHeading
         level="h1"