diff --git a/examples/multipass/app/routes/api.predictive-search.tsx b/examples/multipass/app/routes/api.predictive-search.tsx index c9d1478788..ac37616216 100644 --- a/examples/multipass/app/routes/api.predictive-search.tsx +++ b/examples/multipass/app/routes/api.predictive-search.tsx @@ -234,7 +234,7 @@ export function normalizePredictiveSearchResults( id: article.id, image: article.image, title: article.title, - url: `${localePrefix}/blog/${article.handle}${trackingParams}`, + url: `${localePrefix}/blogs/${article.blog.handle}/${article.handle}/${trackingParams}`, }; }, ), @@ -250,6 +250,9 @@ const PREDICTIVE_SEARCH_QUERY = `#graphql id title handle + blog { + handle + } image { url altText diff --git a/examples/multipass/storefrontapi.generated.d.ts b/examples/multipass/storefrontapi.generated.d.ts index f3a92fe1d7..ab613fba75 100644 --- a/examples/multipass/storefrontapi.generated.d.ts +++ b/examples/multipass/storefrontapi.generated.d.ts @@ -958,6 +958,7 @@ export type PredictiveArticleFragment = {__typename: 'Article'} & Pick< StorefrontAPI.Article, 'id' | 'title' | 'handle' | 'trackingParameters' > & { + blog: Pick; image?: StorefrontAPI.Maybe< Pick >; @@ -1019,6 +1020,7 @@ export type PredictiveSearchQuery = { StorefrontAPI.Article, 'id' | 'title' | 'handle' | 'trackingParameters' > & { + blog: Pick; image?: StorefrontAPI.Maybe< Pick >; @@ -1844,7 +1846,7 @@ interface GeneratedQueryTypes { return: CustomerInfoQuery; variables: CustomerInfoQueryVariables; }; - '#graphql\n fragment PredictiveArticle on Article {\n __typename\n id\n title\n handle\n image {\n url\n altText\n width\n height\n }\n trackingParameters\n }\n fragment PredictiveCollection on Collection {\n __typename\n id\n title\n handle\n image {\n url\n altText\n width\n height\n }\n trackingParameters\n }\n fragment PredictivePage on Page {\n __typename\n id\n title\n handle\n trackingParameters\n }\n fragment PredictiveProduct on Product {\n __typename\n id\n title\n handle\n trackingParameters\n variants(first: 1) {\n nodes {\n id\n image {\n url\n altText\n width\n height\n }\n price {\n amount\n currencyCode\n }\n }\n }\n }\n fragment PredictiveQuery on SearchQuerySuggestion {\n __typename\n text\n styledText\n trackingParameters\n }\n query predictiveSearch(\n $country: CountryCode\n $language: LanguageCode\n $limit: Int!\n $limitScope: PredictiveSearchLimitScope!\n $searchTerm: String!\n $types: [PredictiveSearchType!]\n ) @inContext(country: $country, language: $language) {\n predictiveSearch(\n limit: $limit,\n limitScope: $limitScope,\n query: $searchTerm,\n types: $types,\n ) {\n articles {\n ...PredictiveArticle\n }\n collections {\n ...PredictiveCollection\n }\n pages {\n ...PredictivePage\n }\n products {\n ...PredictiveProduct\n }\n queries {\n ...PredictiveQuery\n }\n }\n }\n': { + '#graphql\n fragment PredictiveArticle on Article {\n __typename\n id\n title\n handle\n blog {\n handle\n }\n image {\n url\n altText\n width\n height\n }\n trackingParameters\n }\n fragment PredictiveCollection on Collection {\n __typename\n id\n title\n handle\n image {\n url\n altText\n width\n height\n }\n trackingParameters\n }\n fragment PredictivePage on Page {\n __typename\n id\n title\n handle\n trackingParameters\n }\n fragment PredictiveProduct on Product {\n __typename\n id\n title\n handle\n trackingParameters\n variants(first: 1) {\n nodes {\n id\n image {\n url\n altText\n width\n height\n }\n price {\n amount\n currencyCode\n }\n }\n }\n }\n fragment PredictiveQuery on SearchQuerySuggestion {\n __typename\n text\n styledText\n trackingParameters\n }\n query predictiveSearch(\n $country: CountryCode\n $language: LanguageCode\n $limit: Int!\n $limitScope: PredictiveSearchLimitScope!\n $searchTerm: String!\n $types: [PredictiveSearchType!]\n ) @inContext(country: $country, language: $language) {\n predictiveSearch(\n limit: $limit,\n limitScope: $limitScope,\n query: $searchTerm,\n types: $types,\n ) {\n articles {\n ...PredictiveArticle\n }\n collections {\n ...PredictiveCollection\n }\n pages {\n ...PredictivePage\n }\n products {\n ...PredictiveProduct\n }\n queries {\n ...PredictiveQuery\n }\n }\n }\n': { return: PredictiveSearchQuery; variables: PredictiveSearchQueryVariables; }; diff --git a/templates/skeleton/app/routes/api.predictive-search.tsx b/templates/skeleton/app/routes/api.predictive-search.tsx index 680f8e7af6..1be0e509d6 100644 --- a/templates/skeleton/app/routes/api.predictive-search.tsx +++ b/templates/skeleton/app/routes/api.predictive-search.tsx @@ -209,7 +209,7 @@ export function normalizePredictiveSearchResults( id: article.id, image: article.image, title: article.title, - url: `${localePrefix}/blog/${article.handle}${trackingParams}`, + url: `${localePrefix}/blogs/${article.blog.handle}/${article.handle}/${trackingParams}`, }; }, ), @@ -225,6 +225,9 @@ const PREDICTIVE_SEARCH_QUERY = `#graphql id title handle + blog { + handle + } image { url altText diff --git a/templates/skeleton/app/routes/blogs.$blogHandle.$articleHandle.tsx b/templates/skeleton/app/routes/blogs.$blogHandle.$articleHandle.tsx index d7cac79e77..701555e55e 100644 --- a/templates/skeleton/app/routes/blogs.$blogHandle.$articleHandle.tsx +++ b/templates/skeleton/app/routes/blogs.$blogHandle.$articleHandle.tsx @@ -40,6 +40,7 @@ export default function Article() {

{title} +
{publishedDate} · {author?.name} diff --git a/templates/skeleton/storefrontapi.generated.d.ts b/templates/skeleton/storefrontapi.generated.d.ts index f5d882a443..6c6f54c4bb 100644 --- a/templates/skeleton/storefrontapi.generated.d.ts +++ b/templates/skeleton/storefrontapi.generated.d.ts @@ -330,6 +330,7 @@ export type PredictiveArticleFragment = {__typename: 'Article'} & Pick< StorefrontAPI.Article, 'id' | 'title' | 'handle' | 'trackingParameters' > & { + blog: Pick; image?: StorefrontAPI.Maybe< Pick >; @@ -391,6 +392,7 @@ export type PredictiveSearchQuery = { StorefrontAPI.Article, 'id' | 'title' | 'handle' | 'trackingParameters' > & { + blog: Pick; image?: StorefrontAPI.Maybe< Pick >; @@ -1147,7 +1149,7 @@ interface GeneratedQueryTypes { return: RecommendedProductsQuery; variables: RecommendedProductsQueryVariables; }; - '#graphql\n fragment PredictiveArticle on Article {\n __typename\n id\n title\n handle\n image {\n url\n altText\n width\n height\n }\n trackingParameters\n }\n fragment PredictiveCollection on Collection {\n __typename\n id\n title\n handle\n image {\n url\n altText\n width\n height\n }\n trackingParameters\n }\n fragment PredictivePage on Page {\n __typename\n id\n title\n handle\n trackingParameters\n }\n fragment PredictiveProduct on Product {\n __typename\n id\n title\n handle\n trackingParameters\n variants(first: 1) {\n nodes {\n id\n image {\n url\n altText\n width\n height\n }\n price {\n amount\n currencyCode\n }\n }\n }\n }\n fragment PredictiveQuery on SearchQuerySuggestion {\n __typename\n text\n styledText\n trackingParameters\n }\n query predictiveSearch(\n $country: CountryCode\n $language: LanguageCode\n $limit: Int!\n $limitScope: PredictiveSearchLimitScope!\n $searchTerm: String!\n $types: [PredictiveSearchType!]\n ) @inContext(country: $country, language: $language) {\n predictiveSearch(\n limit: $limit,\n limitScope: $limitScope,\n query: $searchTerm,\n types: $types,\n ) {\n articles {\n ...PredictiveArticle\n }\n collections {\n ...PredictiveCollection\n }\n pages {\n ...PredictivePage\n }\n products {\n ...PredictiveProduct\n }\n queries {\n ...PredictiveQuery\n }\n }\n }\n': { + '#graphql\n fragment PredictiveArticle on Article {\n __typename\n id\n title\n handle\n blog {\n handle\n }\n image {\n url\n altText\n width\n height\n }\n trackingParameters\n }\n fragment PredictiveCollection on Collection {\n __typename\n id\n title\n handle\n image {\n url\n altText\n width\n height\n }\n trackingParameters\n }\n fragment PredictivePage on Page {\n __typename\n id\n title\n handle\n trackingParameters\n }\n fragment PredictiveProduct on Product {\n __typename\n id\n title\n handle\n trackingParameters\n variants(first: 1) {\n nodes {\n id\n image {\n url\n altText\n width\n height\n }\n price {\n amount\n currencyCode\n }\n }\n }\n }\n fragment PredictiveQuery on SearchQuerySuggestion {\n __typename\n text\n styledText\n trackingParameters\n }\n query predictiveSearch(\n $country: CountryCode\n $language: LanguageCode\n $limit: Int!\n $limitScope: PredictiveSearchLimitScope!\n $searchTerm: String!\n $types: [PredictiveSearchType!]\n ) @inContext(country: $country, language: $language) {\n predictiveSearch(\n limit: $limit,\n limitScope: $limitScope,\n query: $searchTerm,\n types: $types,\n ) {\n articles {\n ...PredictiveArticle\n }\n collections {\n ...PredictiveCollection\n }\n pages {\n ...PredictivePage\n }\n products {\n ...PredictiveProduct\n }\n queries {\n ...PredictiveQuery\n }\n }\n }\n': { return: PredictiveSearchQuery; variables: PredictiveSearchQueryVariables; };