From ed92b5f1607f436d3d98ccbee583845fea73b73f Mon Sep 17 00:00:00 2001 From: tinuola Date: Wed, 13 Nov 2024 12:45:08 -0800 Subject: [PATCH 1/6] create computed tagLabels from typeFilters, formatFilters for event slug --- pages/events/[slug].vue | 15 ++++++--------- 1 file changed, 6 insertions(+), 9 deletions(-) diff --git a/pages/events/[slug].vue b/pages/events/[slug].vue index 77c896f..509c839 100644 --- a/pages/events/[slug].vue +++ b/pages/events/[slug].vue @@ -56,6 +56,10 @@ if (data.value.ftvaEvent && import.meta.prerender) { const page = ref(_get(data.value, 'ftvaEvent', {})) const series = ref(_get(data.value, 'ftvaEventSeries', {})) +// console.log('data: ', data.value) +// console.log('page data: ', page.value) +// console.log('series data: ', series.value) + watch(data, (newVal, oldVal) => { // console.log('In watch preview enabled, newVal, oldVal', newVal, oldVal) page.value = _get(newVal, 'ftvaEvent', {}) @@ -134,16 +138,9 @@ const parsedTagLabels = computed(() => { } const parsedLabels = [] - const typeFilters = page.value.ftvaEventTypeFilters - const formatFilters = page.value.ftvaScreeningFormatFilters - - if (typeFilters.length) { - typeFilters.forEach(obj => parsedLabels.push({ title: obj.title })) - } - if (formatFilters.length) { - formatFilters.forEach(obj => parsedLabels.push({ title: obj.title })) - } + page.value.ftvaEventTypeFilters.forEach(obj => parsedLabels.push(obj.title)) + page.value.ftvaScreeningFormatFilters.forEach(obj => parsedLabels.push(obj.title)) return parsedLabels }) From 8964c8543c68c25ec8a18b41fc0e39914ee5769e Mon Sep 17 00:00:00 2001 From: tinuola Date: Wed, 13 Nov 2024 13:43:41 -0800 Subject: [PATCH 2/6] update event slug parsedTagLabels logic --- pages/events/[slug].vue | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/pages/events/[slug].vue b/pages/events/[slug].vue index 509c839..3527b05 100644 --- a/pages/events/[slug].vue +++ b/pages/events/[slug].vue @@ -56,10 +56,6 @@ if (data.value.ftvaEvent && import.meta.prerender) { const page = ref(_get(data.value, 'ftvaEvent', {})) const series = ref(_get(data.value, 'ftvaEventSeries', {})) -// console.log('data: ', data.value) -// console.log('page data: ', page.value) -// console.log('series data: ', series.value) - watch(data, (newVal, oldVal) => { // console.log('In watch preview enabled, newVal, oldVal', newVal, oldVal) page.value = _get(newVal, 'ftvaEvent', {}) @@ -138,9 +134,16 @@ const parsedTagLabels = computed(() => { } const parsedLabels = [] + const typeFilters = page.value.ftvaEventTypeFilters + const formatFilters = page.value.ftvaScreeningFormatFilters + + if (typeFilters.length) { + typeFilters.forEach(obj => parsedLabels.push(obj.title)) + } - page.value.ftvaEventTypeFilters.forEach(obj => parsedLabels.push(obj.title)) - page.value.ftvaScreeningFormatFilters.forEach(obj => parsedLabels.push(obj.title)) + if (formatFilters.length) { + formatFilters.forEach(obj => parsedLabels.push(obj.title)) + } return parsedLabels }) From cccf5db71ca5230ac5f1512a75b030d7e680ce22 Mon Sep 17 00:00:00 2001 From: tinuola Date: Wed, 13 Nov 2024 15:11:47 -0800 Subject: [PATCH 3/6] fix data structure for computed parsed labels --- pages/events/[slug].vue | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/pages/events/[slug].vue b/pages/events/[slug].vue index 3527b05..77c896f 100644 --- a/pages/events/[slug].vue +++ b/pages/events/[slug].vue @@ -138,11 +138,11 @@ const parsedTagLabels = computed(() => { const formatFilters = page.value.ftvaScreeningFormatFilters if (typeFilters.length) { - typeFilters.forEach(obj => parsedLabels.push(obj.title)) + typeFilters.forEach(obj => parsedLabels.push({ title: obj.title })) } if (formatFilters.length) { - formatFilters.forEach(obj => parsedLabels.push(obj.title)) + formatFilters.forEach(obj => parsedLabels.push({ title: obj.title })) } return parsedLabels From 69f5b3fc32e06c24d5b403056d7b50a2cd4a7bca Mon Sep 17 00:00:00 2001 From: tinuola Date: Wed, 13 Nov 2024 15:45:22 -0800 Subject: [PATCH 4/6] update series slug computed events to return parsed tagLabels --- pages/series/[slug].vue | 1 + 1 file changed, 1 insertion(+) diff --git a/pages/series/[slug].vue b/pages/series/[slug].vue index 75b00d6..de988f2 100644 --- a/pages/series/[slug].vue +++ b/pages/series/[slug].vue @@ -51,6 +51,7 @@ if (data.value.ftvaEventSeries && import.meta.prerender) { } } +// console.log('data: ', data.value) const page = ref(_get(data.value, 'ftvaEventSeries', {})) const upcomingEvents = ref(_get(data.value, 'upcomingEvents', {})) const pastEvents = ref(_get(data.value, 'pastEvents', {})) From e46d051e8c63afa91358972de45caa838161ddbd Mon Sep 17 00:00:00 2001 From: tinuola Date: Wed, 13 Nov 2024 15:47:38 -0800 Subject: [PATCH 5/6] remove console statement --- pages/series/[slug].vue | 1 - 1 file changed, 1 deletion(-) diff --git a/pages/series/[slug].vue b/pages/series/[slug].vue index de988f2..75b00d6 100644 --- a/pages/series/[slug].vue +++ b/pages/series/[slug].vue @@ -51,7 +51,6 @@ if (data.value.ftvaEventSeries && import.meta.prerender) { } } -// console.log('data: ', data.value) const page = ref(_get(data.value, 'ftvaEventSeries', {})) const upcomingEvents = ref(_get(data.value, 'upcomingEvents', {})) const pastEvents = ref(_get(data.value, 'pastEvents', {})) From a4b2a1fe9af2fc2c41ad17fc6b0365aae93ab76c Mon Sep 17 00:00:00 2001 From: tinuola Date: Wed, 13 Nov 2024 16:58:46 -0800 Subject: [PATCH 6/6] refactor tagLabels logic into a util function --- pages/events/[slug].vue | 22 +++++----------------- pages/series/[slug].vue | 27 +++++---------------------- utils/getEventFilterLabels.js | 28 ++++++++++++++++++++++++++++ 3 files changed, 38 insertions(+), 39 deletions(-) create mode 100644 utils/getEventFilterLabels.js diff --git a/pages/events/[slug].vue b/pages/events/[slug].vue index 77c896f..dfa9239 100644 --- a/pages/events/[slug].vue +++ b/pages/events/[slug].vue @@ -15,6 +15,7 @@ import removeTags from '../utils/removeTags' import { useContentIndexer } from '~/composables/useContentIndexer' // UTILS +import { getEventFilterLabels } from '~/utils/getEventFilterLabels' const { $graphql } = useNuxtApp() @@ -128,24 +129,11 @@ const parsedFTVAEventScreeningDetails = computed(() => { }) }) +// Extract tag labels from event filters const parsedTagLabels = computed(() => { - if (!page.value.ftvaEventTypeFilters && !page.value.ftvaScreeningFormatFilters) { - return [] - } - - const parsedLabels = [] - const typeFilters = page.value.ftvaEventTypeFilters - const formatFilters = page.value.ftvaScreeningFormatFilters - - if (typeFilters.length) { - typeFilters.forEach(obj => parsedLabels.push({ title: obj.title })) - } - - if (formatFilters.length) { - formatFilters.forEach(obj => parsedLabels.push({ title: obj.title })) - } - - return parsedLabels + const eventObj = page.value + const parsedTagLabels = getEventFilterLabels(eventObj) + return parsedTagLabels }) useHead({ diff --git a/pages/series/[slug].vue b/pages/series/[slug].vue index 75b00d6..cf9f8a6 100644 --- a/pages/series/[slug].vue +++ b/pages/series/[slug].vue @@ -10,6 +10,9 @@ import _get from 'lodash/get' // GQL import FTVAEventSeriesDetail from '../gql/queries/FTVAEventSeriesDetail.gql' +// UTIL +import { getEventFilterLabels } from '~/utils/getEventFilterLabels' + // COMPOSABLE import { useContentIndexer } from '~/composables/useContentIndexer' import removeTags from '~/utils/removeTags' @@ -98,7 +101,7 @@ const parsedUpcomingEvents = computed(() => { // Transform data return upcomingEvents.value.map((item, index) => { - const parsedTagLabels = getParsedTagLabels(item) + const parsedTagLabels = getEventFilterLabels(item) return { ...item, @@ -116,7 +119,7 @@ const parsedPastEvents = computed(() => { // Transform data return pastEvents.value.map((item, index) => { - const parsedTagLabels = getParsedTagLabels(item) + const parsedTagLabels = getEventFilterLabels(item) return { ...item, @@ -127,26 +130,6 @@ const parsedPastEvents = computed(() => { }) }) -function getParsedTagLabels(obj) { - if (!obj.ftvaEventTypeFilters && !obj.ftvaScreeningFormatFilters) { - return [] - } - - const parsedLabels = [] - const typeFilters = obj.ftvaEventTypeFilters - const formatFilters = obj.ftvaScreeningFormatFilters - - if (typeFilters.length) { - typeFilters.forEach(obj => parsedLabels.push({ title: obj.title })) - } - - if (formatFilters.length) { - formatFilters.forEach(obj => parsedLabels.push({ title: obj.title })) - } - - return parsedLabels -} - // If no Upcoming Events, set starting tab to Past Events const parsedInitialTabIndex = computed(() => { if (parsedUpcomingEvents.value.length === 0) { diff --git a/utils/getEventFilterLabels.js b/utils/getEventFilterLabels.js new file mode 100644 index 0000000..0659407 --- /dev/null +++ b/utils/getEventFilterLabels.js @@ -0,0 +1,28 @@ +/** + * Extract tag labels from FTVA filters (ftvaScreeningFormatFilters, +ftvaEventTypeFilters) and return as a single array + + * @param {Object} + * @returns {Array} + */ + +export function getEventFilterLabels(obj) { + if (!obj.ftvaEventTypeFilters && !obj.ftvaScreeningFormatFilters) { + return [] + } + + const parsedTagLabels = [] + + const eventTypeFilters = obj.ftvaEventTypeFilters + const screeningFormatFilters = obj.ftvaScreeningFormatFilters + + if (eventTypeFilters.length) { + eventTypeFilters.forEach(obj => parsedTagLabels.push({ title: obj.title })) + } + + if (screeningFormatFilters.length) { + screeningFormatFilters.forEach(obj => parsedTagLabels.push({ title: obj.title })) + } + + return parsedTagLabels +}