Skip to content

Commit

Permalink
feat: APPS-3023 Create composable useContentIndexer to index craft da…
Browse files Browse the repository at this point in the history
…ta used on all routes for FTVA (#67)

* create composable and add it to all slug pages

* add the composable

* delete extraneous composable import in blog

* make FAILED TO INDEX console message easier to read in console

* linting

* delete console satement

* fix path to composable

* fix path to composable

* move gql and composable inside of blog/article

* add helpers after gql and composables in blog

* move comments in the useContentIndexer composable

* standardize imports

* standardize imports

* standardize imports

* standardize imports

* get rid of comment

* get rid of comment

* revert to NOT using $fetch

* remove $fetch

* linting
  • Loading branch information
jendiamond authored Nov 9, 2024
1 parent cb89674 commit e76144d
Show file tree
Hide file tree
Showing 9 changed files with 188 additions and 13 deletions.
85 changes: 85 additions & 0 deletions composables/useContentIndexer.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,85 @@
export function useContentIndexer() {
const esIndex = useRuntimeConfig().public.esTempIndex
const esURL = useRuntimeConfig().public.esURL
const esReadKey = useRuntimeConfig().public.esReadKey
const esWriteKey = useRuntimeConfig().esWriteKey

async function indexContent(data, slug) {
try {
if (data && slug && esIndex) {
/* console.log(
"this is the elasticsearch plugin: " + JSON.stringify(data)
) */
// console.log(`Requesting URL: ${esURL}/${esIndex}/_doc/${slug}`)
const docExists = await fetch(
`${esURL}/${esIndex}/_doc/${slug}`,
{
headers: {
Authorization: `ApiKey ${esReadKey}`,
},
}
)

const body = await docExists.text()
const docExistsResponseValue = JSON.parse(body)
// console.log('Existing data in ES', docExistsResponseValue)

if (docExistsResponseValue && docExistsResponseValue._source) {
// console.log('GET-RESPONSE: ' + slug)
const updateUrl = `${esURL}/${esIndex}/_update/${slug}`
// console.log('ES update url', updateUrl)
const postBody = {
doc: data
}
// console.log('postBody', JSON.stringify(postBody))
const updateResponse = await fetch(
`${esURL}/${esIndex}/_update/${slug}`,
{
headers: {
Authorization: `ApiKey ${esWriteKey}`,
'Content-Type': 'application/json',
},
method: 'POST',
body: JSON.stringify(postBody),
}
)
// console.log('Update document in ES', updateResponse)
const updateJson = await updateResponse.text()
console.log('Update in ES', updateJson)

Check warning on line 48 in composables/useContentIndexer.js

View workflow job for this annotation

GitHub Actions / eslint

Unexpected console statement
} else {
const response = await fetch(
`${esURL}/${esIndex}/_doc/${slug}`,
{
headers: {
Authorization: `ApiKey ${esWriteKey}`,
'Content-Type': 'application/json',
},
method: 'POST',
body: JSON.stringify(data),
}
)

// console.log('Create a new document in ES:', await response.text())
}
} else {
console.warn('not indexing anything')

Check warning on line 65 in composables/useContentIndexer.js

View workflow job for this annotation

GitHub Actions / eslint

Unexpected console statement
}
} catch (e) {
console.error('skip indexing if connection times out during builds in the mean time: ' + e.message)

Check warning on line 68 in composables/useContentIndexer.js

View workflow job for this annotation

GitHub Actions / eslint

Unexpected console statement
console.warn('skip indexing if connection times out during builds in the mean time: ' + e.message)

Check warning on line 69 in composables/useContentIndexer.js

View workflow job for this annotation

GitHub Actions / eslint

Unexpected console statement
throw new Error('Elastic Search Indexing failed ' + e) // TODO uncomment when cause is clear
}
}

return {
indexContent
}
}

// Checks the page slug
// Calls ES (Elastic Search)
// Checks if the document exists in ES
// if the document already exists
// it overwrites/replaces it in the index
// if the document doesn't exist
// it adds it to the index
1 change: 1 addition & 0 deletions gql/queries/FTVAArticleDetail.gql
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ query FTVAArticleDetail($slug: [String!]) {
ftvaArticle: entry(section: "ftvaArticle", slug: $slug) {
id
typeHandle
sectionHandle
postDate
slug
title
Expand Down
5 changes: 3 additions & 2 deletions gql/queries/FTVACollectionDetail.gql
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,9 @@

query FTVACollectionDetail($slug: [String!]) {
ftvaCollection: entry(section: "ftvaCollection", slug: $slug) {
id
typeHandle
id
sectionHandle
imageCarousel {
... on imageCarousel_imageCarousel_BlockType {
image {
Expand All @@ -15,7 +16,7 @@ query FTVACollectionDetail($slug: [String!]) {
title
sectionTitle
ftvaCollectionType
richText
richText
videoEmbed
viewAllSectionLink {
... on viewAllSectionLink_viewAllSection_BlockType {
Expand Down
1 change: 1 addition & 0 deletions gql/queries/FTVAEventDetail.gql
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ query FTVAEventDetail($slug: [String!]) {
ftvaEvent: entry(section: "ftvaEvent", slug: $slug) {
id
typeHandle
sectionHandle
slug
uri

Expand Down
3 changes: 3 additions & 0 deletions gql/queries/FTVAEventSeriesDetail.gql
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,9 @@ query FTVAEventSeriesDetail ($slug: [String!]) {
creditText
}
}
id
typeHandle
sectionHandle
title
guestSpeaker
ftvaEventIntroduction
Expand Down
27 changes: 24 additions & 3 deletions pages/blog/[slug].vue
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,15 @@ import {
// HELPERS
import _get from 'lodash/get'
import FTVAArticleDetail from '../gql/queries/FTVAArticleDetail.gql'
import removeTags from '~/utils/removeTags'
// GQL
import FTVAArticleDetail from '../gql/queries/FTVAArticleDetail.gql'
// COMPOSABLE
import { useContentIndexer } from '~/composables/useContentIndexer'
// UTILS
import removeTags from '~/utils/removeTags'
import socialList from '~/utils/socialList'
const { $graphql } = useNuxtApp()
Expand All @@ -37,6 +42,19 @@ if (!data.value.ftvaArticle) {
})
}
// This is creating an index of the main content (not related content)
if (data.value.ftvaArticle && import.meta.prerender) {
try {
// Call the composable to use the indexing function
const { indexContent } = useContentIndexer()
// Index the article data using the composable during static build
await indexContent(data.value.ftvaArticle, route.params.slug)
// console.log('Article indexed successfully during static build')
} catch (error) {
console.error('FAILED TO INDEX ARTICLE during static build:', error)
}
}
const page = ref(_get(data.value, 'ftvaArticle', {}))
const ftvaRecentPosts = ref(_get(data.value, 'ftvaRecentPosts', {}))
Expand Down Expand Up @@ -210,7 +228,10 @@ useHead({
</main>
</template>
<style lang="scss" scoped>
<style
lang="scss"
scoped
>
// PAGE STYLES
.page-article-detail {
position: relative;
Expand Down
28 changes: 25 additions & 3 deletions pages/collections/[slug].vue
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,15 @@ import { BlockCallToAction, CardMeta, DividerWayFinder, NavBreadcrumb, Responsiv
// HELPERS
import _get from 'lodash/get'
import FTVACollectionDetail from '../gql/queries/FTVACollectionDetail.gql'
import removeTags from '~/utils/removeTags'
// GQL
import FTVACollectionDetail from '../gql/queries/FTVACollectionDetail.gql'
// COMPOSABLE
import { useContentIndexer } from '~/composables/useContentIndexer'
// UTILS
import removeTags from '~/utils/removeTags'
import socialList from '~/utils/socialList'
const { $graphql } = useNuxtApp()
Expand All @@ -35,6 +40,19 @@ if (!data.value.ftvaCollection) {
})
}
// This is creating an index of the main content (not related content)
if (data.value.ftvaCollection && import.meta.prerender) {
try {
// Call the composable to use the indexing function
const { indexContent } = useContentIndexer()
// Index the collection data using the composable during static build
await indexContent(data.value.ftvaCollection, route.params.slug)
// console.log('Collection indexed successfully during static build')
} catch (error) {
console.error('FAILED TO INDEX COLLECTION during static build:', error)
}
}
const page = ref(_get(data.value, 'ftvaCollection', {}))
watch(data, (newVal, oldVal) => {
Expand Down Expand Up @@ -240,7 +258,11 @@ useHead({
</SectionWrapper>
</main>
</template>
<style lang="scss" scoped>
<style
lang="scss"
scoped
>
.page-collection-detail {
position: relative;
Expand Down
26 changes: 24 additions & 2 deletions pages/events/[slug].vue
Original file line number Diff line number Diff line change
Expand Up @@ -6,14 +6,20 @@ import { BlockEventDetail, BlockInfo, BlockTag, ButtonDropdown, CardMeta, Divide
// HELPERS
import _get from 'lodash/get'
import removeTags from '../utils/removeTags'
// GQL
import FTVAEventDetail from '../gql/queries/FTVAEventDetail.gql'
// COMPOSABLE
import removeTags from '../utils/removeTags'
import { useContentIndexer } from '~/composables/useContentIndexer'
// UTILS
const { $graphql } = useNuxtApp()
const route = useRoute()
// DATA
const { data, error } = await useAsyncData(`events-detail-${route.params.slug}`, async () => {
const data = await $graphql.default.request(FTVAEventDetail, { slug: route.params.slug })
Expand All @@ -33,6 +39,19 @@ if (!data.value.ftvaEvent) {
})
}
// This is creating an index of the main content (not related content)
if (data.value.ftvaEvent && import.meta.prerender) {
try {
// Call the composable to use the indexing function
const { indexContent } = useContentIndexer()
// Index the event data using the composable during static build
await indexContent(data.value.ftvaEvent, route.params.slug)
// console.log('Event indexed successfully during static build')
} catch (error) {
console.error('FAILED TO INDEX EVENT during static build:', error)
}
}
const page = ref(_get(data.value, 'ftvaEvent', {}))
const series = ref(_get(data.value, 'ftvaEventSeries', {}))
Expand Down Expand Up @@ -252,7 +271,10 @@ useHead({
</main>
</template>
<style lang="scss" scoped>
<style
lang="scss"
scoped
>
// PAGE STYLES
.page-event-detail {
position: relative;
Expand Down
25 changes: 22 additions & 3 deletions pages/series/[slug].vue
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,13 @@ import { BlockCardThreeColumn, BlockEventDetail, BlockInfo, BlockTag, CardMeta,
// HELPERS
import _get from 'lodash/get'
import FTVAEventSeriesDetail from '../gql/queries/FTVAEventSeriesDetail.gql'
import removeTags from '~/utils/removeTags'
// GQL
import FTVAEventSeriesDetail from '../gql/queries/FTVAEventSeriesDetail.gql'
// COMPOSABLE
import { useContentIndexer } from '~/composables/useContentIndexer'
import removeTags from '~/utils/removeTags'
const { $graphql } = useNuxtApp()
Expand All @@ -34,6 +37,19 @@ if (!data.value.ftvaEventSeries) {
})
}
// This is creating an index of the main content (not related content)
if (data.value.ftvaEventSeries && import.meta.prerender) {
try {
// Call the composable to use the indexing function
const { indexContent } = useContentIndexer()
// Index the event series data using the composable during static build
await indexContent(data.value.ftvaEventSeries, route.params.slug)
// console.log('Event series indexed successfully during static build')
} catch (error) {
console.error('FAILED TO INDEX EVENT SERIES during static build:', error)
}
}
const page = ref(_get(data.value, 'ftvaEventSeries', {}))
const upcomingEvents = ref(_get(data.value, 'upcomingEvents', {}))
const pastEvents = ref(_get(data.value, 'pastEvents', {}))
Expand Down Expand Up @@ -300,7 +316,10 @@ useHead({
</main>
</template>
<style lang="scss" scoped>
<style
lang="scss"
scoped
>
// GENERAL PAGE STYLES / DESKTOP
.page-event-series-detail {
position: relative;
Expand Down

1 comment on commit e76144d

@github-actions
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Please sign in to comment.