refactor: separate queries for loyalty and mypages

This commit is contained in:
Matilda Landström
2024-05-29 09:06:42 +02:00
parent 2dcf31e851
commit b74c904b63
7 changed files with 236 additions and 140 deletions

View File

@@ -12,9 +12,12 @@ import { BreadcrumbsProps } from "@/types/components/myPages/breadcrumbs"
export default async function Breadcrumbs({ export default async function Breadcrumbs({
pageType = PageTypes.Account, pageType = PageTypes.Account,
}: BreadcrumbsProps) { }: BreadcrumbsProps) {
const breadcrumbs = await serverClient().contentstack.breadcrumbs.get({ let breadcrumbs
pageType, if (pageType == PageTypes.Account) {
}) breadcrumbs = await serverClient().contentstack.breadcrumbs.getMyPages()
} else {
breadcrumbs = await serverClient().contentstack.breadcrumbs.getLoyaltyPage()
}
return ( return (
<nav className={styles.breadcrumbs}> <nav className={styles.breadcrumbs}>
<ul className={styles.list}> <ul className={styles.list}>

View File

@@ -2,7 +2,7 @@
#import "../Fragments/Refs/LoyaltyPage/Breadcrumbs.graphql" #import "../Fragments/Refs/LoyaltyPage/Breadcrumbs.graphql"
query GetLoyaltyPageBreadcrumbs($locale: String!, $url: String!) { query GetLoyaltyPageBreadcrumbs($locale: String!, $url: String!) {
all_page: all_loyalty_page(locale: $locale, where: { url: $url }) { all_loyalty_page(locale: $locale, where: { url: $url }) {
items { items {
...LoyaltyPageBreadcrumbs ...LoyaltyPageBreadcrumbs
system { system {
@@ -13,7 +13,7 @@ query GetLoyaltyPageBreadcrumbs($locale: String!, $url: String!) {
} }
query GetLoyaltyPageBreadcrumbsRefs($locale: String!, $url: String!) { query GetLoyaltyPageBreadcrumbsRefs($locale: String!, $url: String!) {
all_page: all_loyalty_page(locale: $locale, where: { url: $url }) { all_loyalty_page(locale: $locale, where: { url: $url }) {
items { items {
...LoyaltyPageBreadcrumbsRefs ...LoyaltyPageBreadcrumbsRefs
} }

View File

@@ -2,7 +2,7 @@
#import "../Fragments/Refs/MyPages/Breadcrumbs.graphql" #import "../Fragments/Refs/MyPages/Breadcrumbs.graphql"
query GetMyPagesBreadcrumbs($locale: String!, $url: String!) { query GetMyPagesBreadcrumbs($locale: String!, $url: String!) {
all_page: all_account_page(locale: $locale, where: { url: $url }) { all_account_page(locale: $locale, where: { url: $url }) {
items { items {
...MyPagesBreadcrumbs ...MyPagesBreadcrumbs
system { system {
@@ -13,7 +13,7 @@ query GetMyPagesBreadcrumbs($locale: String!, $url: String!) {
} }
query GetMyPagesBreadcrumbsRefs($locale: String!, $url: String!) { query GetMyPagesBreadcrumbsRefs($locale: String!, $url: String!) {
all_page: all_account_page(locale: $locale, where: { url: $url }) { all_account_page(locale: $locale, where: { url: $url }) {
items { items {
...MyPagesBreadcrumbsRefs ...MyPagesBreadcrumbsRefs
} }

View File

@@ -10,64 +10,76 @@ export const getBreadcrumbsSchema = z.array(
}) })
) )
export const validateBreadcrumbsRefsContentstackSchema = z.object({ const breadCrumbsRefsItems = z.object({
all_page: z.object({ items: z.array(
items: z.array( z.object({
z.object({ web: z.object({
web: z.object({ breadcrumbs: z.object({
breadcrumbs: z.object({ parentsConnection: z.object({
parentsConnection: z.object({ edges: z.array(
edges: z.array( z.object({
z.object({ node: z.object({
node: z.object({ system: z.object({
system: z.object({ content_type_uid: z.string(),
content_type_uid: z.string(), uid: z.string(),
uid: z.string(),
}),
}), }),
}) }),
), })
}), ),
}), }),
}), }),
system: z.object({ }),
content_type_uid: z.string(), system: z.object({
uid: z.string(), content_type_uid: z.string(),
}), uid: z.string(),
}) }),
), })
}), ),
}) })
export const validateBreadcrumbsContentstackSchema = z.object({ export const validateMyPagesBreadcrumbsRefsContentstackSchema = z.object({
all_page: z.object({ all_account_page: breadCrumbsRefsItems,
items: z.array( })
z.object({
web: z.object({ export const validateLoyaltyPageBreadcrumbsRefsContentstackSchema = z.object({
breadcrumbs: z.object({ all_loyalty_page: breadCrumbsRefsItems,
title: z.string(), })
parentsConnection: z.object({
edges: z.array( const breadCrumbsItems = z.object({
z.object({ items: z.array(
node: z.object({ z.object({
breadcrumbs: z.object({ web: z.object({
title: z.string(), breadcrumbs: z.object({
}), title: z.string(),
system: z.object({ parentsConnection: z.object({
locale: z.nativeEnum(Lang), edges: z.array(
uid: z.string(), z.object({
}), node: z.object({
url: z.string(), breadcrumbs: z.object({
title: z.string(),
}), }),
}) system: z.object({
), locale: z.nativeEnum(Lang),
}), uid: z.string(),
}),
url: z.string(),
}),
})
),
}), }),
}), }),
system: z.object({ }),
uid: z.string(), system: z.object({
}), uid: z.string(),
}) }),
), })
}), ),
})
export const validateMyPagesBreadcrumbsContentstackSchema = z.object({
all_account_page: breadCrumbsItems,
})
export const validateLoyaltyPageBreadcrumbsContentstackSchema = z.object({
all_loyalty_page: breadCrumbsItems,
}) })

View File

@@ -17,107 +17,176 @@ import {
} from "@/utils/generateTag" } from "@/utils/generateTag"
import { removeMultipleSlashes } from "@/utils/url" import { removeMultipleSlashes } from "@/utils/url"
import { PageTypeEnum, PageTypes } from "./input"
import { import {
getBreadcrumbsSchema, getBreadcrumbsSchema,
validateBreadcrumbsContentstackSchema, validateLoyaltyPageBreadcrumbsContentstackSchema,
validateBreadcrumbsRefsContentstackSchema, validateLoyaltyPageBreadcrumbsRefsContentstackSchema,
validateMyPagesBreadcrumbsContentstackSchema,
validateMyPagesBreadcrumbsRefsContentstackSchema,
} from "./output" } from "./output"
import { affix, getConnections, homeBreadcrumbs } from "./utils" import { affix, getConnections, homeBreadcrumbs } from "./utils"
import type { import type {
GetLoyaltyPageBreadcrumbsData,
GetLoyaltyPageBreadcrumbsRefsData,
GetMyPagesBreadcrumbsData, GetMyPagesBreadcrumbsData,
GetMyPagesBreadcrumbsRefsData, GetMyPagesBreadcrumbsRefsData,
} from "@/types/requests/myPages/breadcrumbs" } from "@/types/requests/myPages/breadcrumbs"
export const breadcrumbsQueryRouter = router({ export const breadcrumbsQueryRouter = router({
get: contentstackProcedure getMyPages: contentstackProcedure.query(async ({ ctx }) => {
.input(PageTypeEnum) const refsResponse = await request<GetMyPagesBreadcrumbsRefsData>(
.query(async ({ ctx, input }) => { GetMyPagesBreadcrumbsRefs,
let refsResponse, GetPageBreadcrumbs, GetPageBreadcrumbRefs { locale: ctx.lang, url: ctx.pathname },
{
if (input.pageType == PageTypes.Account) { next: {
GetPageBreadcrumbs = GetMyPagesBreadcrumbs tags: [generateRefsResponseTag(ctx.lang, ctx.pathname, affix)],
GetPageBreadcrumbRefs = GetMyPagesBreadcrumbsRefs },
} else if (input.pageType == PageTypes.Loyalty) {
GetPageBreadcrumbs = GetLoyaltyPageBreadcrumbs
GetPageBreadcrumbRefs = GetLoyaltyPageBreadcrumbsRefs
} else {
return []
} }
refsResponse = await request<GetMyPagesBreadcrumbsRefsData>( )
GetPageBreadcrumbRefs, if (!refsResponse.data) {
{ locale: ctx.lang, url: ctx.pathname }, throw notFound(refsResponse)
{ }
next: {
tags: [generateRefsResponseTag(ctx.lang, ctx.pathname, affix)], const validatedRefsData =
}, validateMyPagesBreadcrumbsRefsContentstackSchema.safeParse(
} refsResponse.data
) )
if (!refsResponse.data) { if (!validatedRefsData.success) {
throw notFound(refsResponse) throw internalServerError(validatedRefsData.error)
} }
const validatedRefsData = const connections = getConnections(validatedRefsData.data.all_account_page)
validateBreadcrumbsRefsContentstackSchema.safeParse(refsResponse.data) const tags = generateTags(ctx.lang, connections)
if (!validatedRefsData.success) { const page = validatedRefsData.data.all_account_page.items[0]
throw internalServerError(validatedRefsData.error) tags.push(generateTag(ctx.lang, page.system.uid, affix))
}
const connections = getConnections(validatedRefsData.data) const response = await request<GetMyPagesBreadcrumbsData>(
const tags = generateTags(ctx.lang, connections) GetMyPagesBreadcrumbs,
const page = validatedRefsData.data.all_page.items[0] { locale: ctx.lang, url: ctx.pathname },
tags.push(generateTag(ctx.lang, page.system.uid, affix)) { next: { tags } }
)
if (!response.data) {
throw notFound(response)
}
const response = await request<GetMyPagesBreadcrumbsData>( const validatedBreadcrumbsData =
GetPageBreadcrumbs, validateMyPagesBreadcrumbsContentstackSchema.safeParse(response.data)
{ locale: ctx.lang, url: ctx.pathname },
{ next: { tags } }
)
if (!response.data) {
throw notFound(response)
}
const validatedBreadcrumbsData = if (!validatedBreadcrumbsData.success) {
validateBreadcrumbsContentstackSchema.safeParse(response.data) throw internalServerError(validatedBreadcrumbsData.error)
}
if (!validatedBreadcrumbsData.success) { const parentBreadcrumbs =
throw internalServerError(validatedBreadcrumbsData.error) validatedBreadcrumbsData.data.all_account_page.items[0].web.breadcrumbs.parentsConnection.edges.map(
}
const parentBreadcrumbs =
validatedBreadcrumbsData.data.all_page.items[0].web.breadcrumbs.parentsConnection.edges.map(
(breadcrumb) => {
return {
href: removeMultipleSlashes(
`/${breadcrumb.node.system.locale}/${breadcrumb.node.url}`
),
title: breadcrumb.node.breadcrumbs.title,
uid: breadcrumb.node.system.uid,
}
}
)
const pageBreadcrumb = validatedBreadcrumbsData.data.all_page.items.map(
(breadcrumb) => { (breadcrumb) => {
return { return {
title: breadcrumb.web.breadcrumbs.title, href: removeMultipleSlashes(
uid: breadcrumb.system.uid, `/${breadcrumb.node.system.locale}/${breadcrumb.node.url}`
),
title: breadcrumb.node.breadcrumbs.title,
uid: breadcrumb.node.system.uid,
} }
} }
) )
const breadcrumbs = [ const pageBreadcrumb =
homeBreadcrumbs[ctx.lang], validatedBreadcrumbsData.data.all_account_page.items.map((breadcrumb) => {
parentBreadcrumbs, return {
pageBreadcrumb, title: breadcrumb.web.breadcrumbs.title,
].flat() uid: breadcrumb.system.uid,
}
})
const validatedBreadcrumbs = getBreadcrumbsSchema.safeParse(breadcrumbs) const breadcrumbs = [
if (!validatedBreadcrumbs.success) { homeBreadcrumbs[ctx.lang],
throw internalServerError(validatedBreadcrumbs.error) parentBreadcrumbs,
pageBreadcrumb,
].flat()
const validatedBreadcrumbs = getBreadcrumbsSchema.safeParse(breadcrumbs)
if (!validatedBreadcrumbs.success) {
throw internalServerError(validatedBreadcrumbs.error)
}
return validatedBreadcrumbs.data
}),
getLoyaltyPage: contentstackProcedure.query(async ({ ctx }) => {
const refsResponse = await request<GetLoyaltyPageBreadcrumbsRefsData>(
GetLoyaltyPageBreadcrumbsRefs,
{ locale: ctx.lang, url: ctx.pathname },
{
next: {
tags: [generateRefsResponseTag(ctx.lang, ctx.pathname, affix)],
},
} }
)
if (!refsResponse.data) {
throw notFound(refsResponse)
}
return validatedBreadcrumbs.data const validatedRefsData =
}), validateLoyaltyPageBreadcrumbsRefsContentstackSchema.safeParse(
refsResponse.data
)
if (!validatedRefsData.success) {
throw internalServerError(validatedRefsData.error)
}
const connections = getConnections(validatedRefsData.data.all_loyalty_page)
const tags = generateTags(ctx.lang, connections)
const page = validatedRefsData.data.all_loyalty_page.items[0]
tags.push(generateTag(ctx.lang, page.system.uid, affix))
const response = await request<GetLoyaltyPageBreadcrumbsData>(
GetLoyaltyPageBreadcrumbs,
{ locale: ctx.lang, url: ctx.pathname },
{ next: { tags } }
)
if (!response.data) {
throw notFound(response)
}
const validatedBreadcrumbsData =
validateLoyaltyPageBreadcrumbsContentstackSchema.safeParse(response.data)
if (!validatedBreadcrumbsData.success) {
throw internalServerError(validatedBreadcrumbsData.error)
}
const parentBreadcrumbs =
validatedBreadcrumbsData.data.all_loyalty_page.items[0].web.breadcrumbs.parentsConnection.edges.map(
(breadcrumb) => {
return {
href: removeMultipleSlashes(
`/${breadcrumb.node.system.locale}/${breadcrumb.node.url}`
),
title: breadcrumb.node.breadcrumbs.title,
uid: breadcrumb.node.system.uid,
}
}
)
const pageBreadcrumb =
validatedBreadcrumbsData.data.all_loyalty_page.items.map((breadcrumb) => {
return {
title: breadcrumb.web.breadcrumbs.title,
uid: breadcrumb.system.uid,
}
})
const breadcrumbs = [
homeBreadcrumbs[ctx.lang],
parentBreadcrumbs,
pageBreadcrumb,
].flat()
const validatedBreadcrumbs = getBreadcrumbsSchema.safeParse(breadcrumbs)
if (!validatedBreadcrumbs.success) {
throw internalServerError(validatedBreadcrumbs.error)
}
return validatedBreadcrumbs.data
}),
}) })

View File

@@ -1,12 +1,12 @@
import { Lang } from "@/constants/languages" import { Lang } from "@/constants/languages"
import type { GetMyPagesBreadcrumbsRefsData } from "@/types/requests/myPages/breadcrumbs" import type { GetBreadcrumbsItems } from "@/types/requests/myPages/breadcrumbs"
import type { Edges } from "@/types/requests/utils/edges" import type { Edges } from "@/types/requests/utils/edges"
import type { NodeRefs } from "@/types/requests/utils/refs" import type { NodeRefs } from "@/types/requests/utils/refs"
export function getConnections(refs: GetMyPagesBreadcrumbsRefsData) { export function getConnections(refs: GetBreadcrumbsItems) {
const connections: Edges<NodeRefs>[] = [] const connections: Edges<NodeRefs>[] = []
refs.all_page.items.forEach((ref) => { refs.items.forEach((ref) => {
connections.push(ref.web.breadcrumbs.parentsConnection) connections.push(ref.web.breadcrumbs.parentsConnection)
}) })
return connections return connections

View File

@@ -28,7 +28,15 @@ interface MyPagesBreadcrumbs {
interface AllPageResponse extends AllRequestResponse<MyPagesBreadcrumbs> {} interface AllPageResponse extends AllRequestResponse<MyPagesBreadcrumbs> {}
export interface GetMyPagesBreadcrumbsData { export interface GetMyPagesBreadcrumbsData {
all_page: AllPageResponse all_account_page: AllPageResponse
}
export interface GetLoyaltyPageBreadcrumbsData {
all_loyalty_page: AllPageResponse
}
export interface GetBreadcrumbsItems {
items: MyPagesBreadcrumbRefs[]
} }
interface MyPagesBreadcrumbRefs extends System { interface MyPagesBreadcrumbRefs extends System {
@@ -43,5 +51,9 @@ interface AllPageRefsResponse
extends AllRequestResponse<MyPagesBreadcrumbRefs> {} extends AllRequestResponse<MyPagesBreadcrumbRefs> {}
export interface GetMyPagesBreadcrumbsRefsData { export interface GetMyPagesBreadcrumbsRefsData {
all_page: AllPageRefsResponse all_account_page: AllPageRefsResponse
}
export interface GetLoyaltyPageBreadcrumbsRefsData {
all_loyalty_page: AllPageRefsResponse
} }