feat(SW-66, SW-348): search functionality and ui
This commit is contained in:
Simon Emanuelsson
@@ -4,7 +4,7 @@ import { Lang } from "@/constants/languages"
|
||||
import {
|
||||
GetLoyaltyPage,
|
||||
GetLoyaltyPageRefs,
|
||||
} from "@/lib/graphql/Query/LoyaltyPage.graphql"
|
||||
} from "@/lib/graphql/Query/LoyaltyPage/LoyaltyPage.graphql"
|
||||
import { request } from "@/lib/graphql/request"
|
||||
import { notFound } from "@/server/errors/trpc"
|
||||
import { contentstackExtendedProcedureUID, router } from "@/server/trpc"
|
||||
@@ -12,28 +12,20 @@ import { contentstackExtendedProcedureUID, router } from "@/server/trpc"
|
||||
import {
|
||||
generateRefsResponseTag,
|
||||
generateTag,
|
||||
generateTags,
|
||||
generateTagsFromSystem,
|
||||
} from "@/utils/generateTag"
|
||||
import { makeImageVaultImage } from "@/utils/imageVault"
|
||||
import { removeMultipleSlashes } from "@/utils/url"
|
||||
|
||||
import { removeEmptyObjects } from "../../utils"
|
||||
import {
|
||||
type LoyaltyPageRefsDataRaw,
|
||||
validateLoyaltyPageRefsSchema,
|
||||
validateLoyaltyPageSchema,
|
||||
} from "./output"
|
||||
import { getConnections, makeButtonObject } from "./utils"
|
||||
import { loyaltyPageRefsSchema, loyaltyPageSchema } from "./output"
|
||||
import { getConnections } from "./utils"
|
||||
|
||||
import {
|
||||
LoyaltyBlocksTypenameEnum,
|
||||
LoyaltyCardsGridEnum,
|
||||
SidebarTypenameEnum,
|
||||
} from "@/types/components/loyalty/enums"
|
||||
import {
|
||||
TrackingChannelEnum,
|
||||
TrackingSDKPageData,
|
||||
} from "@/types/components/tracking"
|
||||
import type {
|
||||
GetLoyaltyPageRefsSchema,
|
||||
GetLoyaltyPageSchema,
|
||||
} from "@/types/trpc/routers/contentstack/loyaltyPage"
|
||||
|
||||
const meter = metrics.getMeter("trpc.loyaltyPage")
|
||||
// OpenTelemetry metrics: LoyaltyPage
|
||||
@@ -59,19 +51,18 @@ const getLoyaltyPageFailCounter = meter.createCounter(
|
||||
export const loyaltyPageQueryRouter = router({
|
||||
get: contentstackExtendedProcedureUID.query(async ({ ctx }) => {
|
||||
const { lang, uid } = ctx
|
||||
getLoyaltyPageRefsCounter.add(1, { lang, uid })
|
||||
const metricsVariables = { lang, uid }
|
||||
const variables = { locale: lang, uid }
|
||||
getLoyaltyPageRefsCounter.add(1, metricsVariables)
|
||||
console.info(
|
||||
"contentstack.loyaltyPage.refs start",
|
||||
JSON.stringify({
|
||||
query: { lang, uid },
|
||||
query: metricsVariables,
|
||||
})
|
||||
)
|
||||
const refsResponse = await request<LoyaltyPageRefsDataRaw>(
|
||||
const refsResponse = await request<GetLoyaltyPageRefsSchema>(
|
||||
GetLoyaltyPageRefs,
|
||||
{
|
||||
locale: lang,
|
||||
uid,
|
||||
},
|
||||
variables,
|
||||
{
|
||||
cache: "force-cache",
|
||||
next: {
|
||||
@@ -83,8 +74,7 @@ export const loyaltyPageQueryRouter = router({
|
||||
if (!refsResponse.data) {
|
||||
const notFoundError = notFound(refsResponse)
|
||||
getLoyaltyPageRefsFailCounter.add(1, {
|
||||
lang,
|
||||
uid,
|
||||
...metricsVariables,
|
||||
error_type: "http_error",
|
||||
error: JSON.stringify({
|
||||
code: notFoundError.code,
|
||||
@@ -93,222 +83,111 @@ export const loyaltyPageQueryRouter = router({
|
||||
console.error(
|
||||
"contentstack.loyaltyPage.refs not found error",
|
||||
JSON.stringify({
|
||||
query: {
|
||||
lang,
|
||||
uid,
|
||||
},
|
||||
query: metricsVariables,
|
||||
error: { code: notFoundError.code },
|
||||
})
|
||||
)
|
||||
throw notFoundError
|
||||
}
|
||||
|
||||
const cleanedData = removeEmptyObjects(refsResponse.data)
|
||||
|
||||
const validatedLoyaltyPageRefs =
|
||||
validateLoyaltyPageRefsSchema.safeParse(cleanedData)
|
||||
const validatedLoyaltyPageRefs = loyaltyPageRefsSchema.safeParse(
|
||||
refsResponse.data
|
||||
)
|
||||
if (!validatedLoyaltyPageRefs.success) {
|
||||
getLoyaltyPageRefsFailCounter.add(1, {
|
||||
lang,
|
||||
uid,
|
||||
...metricsVariables,
|
||||
error_type: "validation_error",
|
||||
error: JSON.stringify(validatedLoyaltyPageRefs.error),
|
||||
})
|
||||
console.error(
|
||||
"contentstack.loyaltyPage.refs validation error",
|
||||
JSON.stringify({
|
||||
query: { lang, uid },
|
||||
query: metricsVariables,
|
||||
error: validatedLoyaltyPageRefs.error,
|
||||
})
|
||||
)
|
||||
return null
|
||||
}
|
||||
getLoyaltyPageRefsSuccessCounter.add(1, { lang, uid })
|
||||
getLoyaltyPageRefsSuccessCounter.add(1, metricsVariables)
|
||||
console.info(
|
||||
"contentstack.loyaltyPage.refs success",
|
||||
JSON.stringify({
|
||||
query: { lang, uid },
|
||||
query: metricsVariables,
|
||||
})
|
||||
)
|
||||
|
||||
const connections = getConnections(validatedLoyaltyPageRefs.data)
|
||||
|
||||
const tags = [
|
||||
generateTags(lang, connections),
|
||||
generateTagsFromSystem(lang, connections),
|
||||
generateTag(lang, validatedLoyaltyPageRefs.data.loyalty_page.system.uid),
|
||||
].flat()
|
||||
getLoyaltyPageCounter.add(1, { lang, uid })
|
||||
getLoyaltyPageCounter.add(1, metricsVariables)
|
||||
console.info(
|
||||
"contentstack.loyaltyPage start",
|
||||
JSON.stringify({
|
||||
query: { lang, uid },
|
||||
query: metricsVariables,
|
||||
})
|
||||
)
|
||||
const response = await request<any>(
|
||||
const response = await request<GetLoyaltyPageSchema>(
|
||||
GetLoyaltyPage,
|
||||
{
|
||||
locale: lang,
|
||||
uid,
|
||||
},
|
||||
variables,
|
||||
{
|
||||
cache: "force-cache",
|
||||
next: {
|
||||
tags,
|
||||
},
|
||||
next: { tags },
|
||||
}
|
||||
)
|
||||
|
||||
if (!response.data) {
|
||||
const notFoundError = notFound(response)
|
||||
getLoyaltyPageFailCounter.add(1, {
|
||||
lang,
|
||||
uid,
|
||||
...metricsVariables,
|
||||
error_type: "http_error",
|
||||
error: JSON.stringify({ code: notFoundError.code }),
|
||||
})
|
||||
console.error(
|
||||
"contentstack.loyaltyPage not found error",
|
||||
JSON.stringify({
|
||||
query: { lang, uid },
|
||||
query: metricsVariables,
|
||||
error: { code: notFoundError.code },
|
||||
})
|
||||
)
|
||||
throw notFound(response)
|
||||
}
|
||||
|
||||
const blocks = response.data.loyalty_page.blocks
|
||||
? response.data.loyalty_page.blocks.map((block: any) => {
|
||||
switch (block.__typename) {
|
||||
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksDynamicContent:
|
||||
return {
|
||||
...block,
|
||||
dynamic_content: {
|
||||
...block.dynamic_content,
|
||||
link: block.dynamic_content.link.pageConnection.edges.length
|
||||
? {
|
||||
text: block.dynamic_content.link.text,
|
||||
href: removeMultipleSlashes(
|
||||
`/${block.dynamic_content.link.pageConnection.edges[0].node.system.locale}/${block.dynamic_content.link.pageConnection.edges[0].node.url}`
|
||||
),
|
||||
title:
|
||||
block.dynamic_content.link.pageConnection.edges[0]
|
||||
.node.title,
|
||||
}
|
||||
: undefined,
|
||||
},
|
||||
}
|
||||
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksShortcuts:
|
||||
return {
|
||||
...block,
|
||||
shortcuts: {
|
||||
...block.shortcuts,
|
||||
shortcuts: block.shortcuts.shortcuts.map((shortcut: any) => ({
|
||||
text: shortcut.text,
|
||||
openInNewTab: shortcut.open_in_new_tab,
|
||||
...shortcut.linkConnection.edges[0].node,
|
||||
url:
|
||||
shortcut.linkConnection.edges[0].node.web?.original_url ||
|
||||
removeMultipleSlashes(
|
||||
`/${shortcut.linkConnection.edges[0].node.system.locale}/${shortcut.linkConnection.edges[0].node.url}`
|
||||
),
|
||||
})),
|
||||
},
|
||||
}
|
||||
case LoyaltyBlocksTypenameEnum.LoyaltyPageBlocksCardsGrid:
|
||||
return {
|
||||
...block,
|
||||
cards_grid: {
|
||||
...block.cards_grid,
|
||||
cards: block.cards_grid.cardConnection.edges.map(
|
||||
({ node: card }: { node: any }) => {
|
||||
switch (card.__typename) {
|
||||
case LoyaltyCardsGridEnum.LoyaltyCard:
|
||||
return {
|
||||
...card,
|
||||
image: makeImageVaultImage(card.image),
|
||||
link: makeButtonObject(card.link),
|
||||
}
|
||||
case LoyaltyCardsGridEnum.Card:
|
||||
return {
|
||||
...card,
|
||||
backgroundImage: makeImageVaultImage(
|
||||
card.background_image
|
||||
),
|
||||
primaryButton: card.has_primary_button
|
||||
? makeButtonObject(card.primary_button)
|
||||
: undefined,
|
||||
secondaryButton: card.has_secondary_button
|
||||
? makeButtonObject(card.secondary_button)
|
||||
: undefined,
|
||||
}
|
||||
}
|
||||
}
|
||||
),
|
||||
},
|
||||
}
|
||||
default:
|
||||
return block
|
||||
}
|
||||
})
|
||||
: null
|
||||
|
||||
const sidebar = response.data.loyalty_page.sidebar
|
||||
? response.data.loyalty_page.sidebar.map((item: any) => {
|
||||
switch (item.__typename) {
|
||||
case SidebarTypenameEnum.LoyaltyPageSidebarJoinLoyaltyContact:
|
||||
return {
|
||||
...item,
|
||||
join_loyalty_contact: {
|
||||
...item.join_loyalty_contact,
|
||||
button: makeButtonObject(item.join_loyalty_contact.button),
|
||||
},
|
||||
}
|
||||
default:
|
||||
return item
|
||||
}
|
||||
})
|
||||
: null
|
||||
|
||||
const loyaltyPage = {
|
||||
heading: response.data.loyalty_page.heading,
|
||||
preamble: response.data.loyalty_page.preamble,
|
||||
heroImage: makeImageVaultImage(response.data.loyalty_page.hero_image),
|
||||
system: response.data.loyalty_page.system,
|
||||
blocks,
|
||||
sidebar,
|
||||
}
|
||||
|
||||
const validatedLoyaltyPage =
|
||||
validateLoyaltyPageSchema.safeParse(loyaltyPage)
|
||||
const validatedLoyaltyPage = loyaltyPageSchema.safeParse(response.data)
|
||||
if (!validatedLoyaltyPage.success) {
|
||||
getLoyaltyPageFailCounter.add(1, {
|
||||
lang,
|
||||
uid,
|
||||
...metricsVariables,
|
||||
error_type: "validation_error",
|
||||
error: JSON.stringify(validatedLoyaltyPage.error),
|
||||
})
|
||||
console.error(
|
||||
"contentstack.loyaltyPage validation error",
|
||||
JSON.stringify({
|
||||
query: { lang, uid },
|
||||
query: metricsVariables,
|
||||
error: validatedLoyaltyPage.error,
|
||||
})
|
||||
)
|
||||
return null
|
||||
}
|
||||
|
||||
const loyaltyPage = validatedLoyaltyPage.data.loyalty_page
|
||||
|
||||
const loyaltyTrackingData: TrackingSDKPageData = {
|
||||
pageId: response.data.loyalty_page.system.uid,
|
||||
lang: response.data.loyalty_page.system.locale as Lang,
|
||||
publishedDate: response.data.loyalty_page.system.updated_at,
|
||||
createdDate: response.data.loyalty_page.system.created_at,
|
||||
pageId: loyaltyPage.system.uid,
|
||||
lang: loyaltyPage.system.locale as Lang,
|
||||
publishedDate: loyaltyPage.system.updated_at,
|
||||
createdDate: loyaltyPage.system.created_at,
|
||||
channel: TrackingChannelEnum["scandic-friends"],
|
||||
pageType: "loyaltycontentpage",
|
||||
}
|
||||
getLoyaltyPageSuccessCounter.add(1, { lang, uid })
|
||||
getLoyaltyPageSuccessCounter.add(1, metricsVariables)
|
||||
console.info(
|
||||
"contentstack.loyaltyPage success",
|
||||
JSON.stringify({ query: { lang, uid } })
|
||||
JSON.stringify({ query: metricsVariables })
|
||||
)
|
||||
|
||||
// Assert LoyaltyPage type to get correct typings for RTE fields
|
||||
return {
|
||||
loyaltyPage,
|
||||
|
||||
Reference in New Issue
Block a user