[DEV-1887] Add seo on all pages (#1119)

* Refactor guides codec files * Fix guides test * Add changeset * Fix guideList test * Fix guideListPages codec * Refactor ApiDataList and ApiDataListPages codecs * Fix file name * Refactor Solutions, SolutionListPage and CaseHistories codecs * Refactor caseHistories test using fixtures * Refactor Overviews codec * Refactor Homepage codec * Refactor QuickStartGuides codec * Move QuickStartGuidesCodec.ts in codecs folder * Refactor webinars codec * Add makeProps folder * Add changeset * Refactor SEO codec * Fix StrapiEnv file name * Refactor solution detail codec and SolutionTemplateProps * Add changeset * Rename StrapiApiData type to StrapiApiDataList * Rename const strapiSolutionsList to strapiSolutionListPage * Fix after merge with main branch * all codecs update * codec update * product codecc * overview * guides * guides list * case histories * api data list pages * api data * webinar seo * tutorials * solutions * linter * quick start * overviews * api list * api detail page * guides, overviews, case histories * Update apps/nextjs-website/src/lib/strapi/codecs/ProductCodec.ts Co-authored-by: Marco Ponchia <[email protected]> * Update apps/nextjs-website/src/lib/strapi/codecs/ProductCodec.ts Co-authored-by: Marco Ponchia <[email protected]> * Update apps/nextjs-website/src/lib/strapi/__tests__/fixtures/product.ts Co-authored-by: Marco Ponchia <[email protected]> * Update apps/nextjs-website/src/lib/strapi/__tests__/fixtures/solution.ts Co-authored-by: Marco Ponchia <[email protected]> * Update apps/nextjs-website/src/lib/strapi/__tests__/solutions.test.ts Co-authored-by: Marco Ponchia <[email protected]> * Fix build error * Fix codecs * update fetches fix populate for seo * Fix changesets --------- Co-authored-by: Marco Bottaro <[email protected]> Co-authored-by: t <[email protected]> Co-authored-by: Marco Ponchia <[email protected]> Co-authored-by: Marco Ponchia <[email protected]> Co-authored-by: marcobottaro <[email protected]>
pagopa · Sep 24, 2024 · fda6c3d · fda6c3d
1 parent c787b27
commit fda6c3d
Show file tree

Hide file tree

Showing 73 changed files with 339 additions and 117 deletions.
diff --git a/.changeset/cool-toes-hope.md b/.changeset/cool-toes-hope.md
@@ -0,0 +1,5 @@
+---
+"nextjs-website": minor
+---
+
+Add SEO to codecs and generate metadata in pages
diff --git a/apps/nextjs-website/src/_contents/makeDocs.ts b/apps/nextjs-website/src/_contents/makeDocs.ts
@@ -6,6 +6,7 @@ import { Product } from '@/lib/types/product';
 import { parseDoc } from 'gitbook-docs/parseDoc';
 import { BannerLinkProps } from '@/components/atoms/BannerLink/BannerLink';
 import { SolutionTemplateProps } from '@/components/templates/SolutionTemplate/SolutionTemplate';
+import { SEO } from '@/lib/types/seo';
 
 export type TutorialsDefinition = {
   readonly product: Product;
@@ -25,6 +26,7 @@ export type GuideDefinition = {
     readonly dirName: string;
   }>;
   readonly bannerLinks: readonly BannerLinkProps[];
+  readonly seo?: SEO;
 };
 
 const parseDocOrThrow = flow(

diff --git a/apps/nextjs-website/src/app/[productSlug]/api/[apiDataSlug]/page.tsx b/apps/nextjs-website/src/app/[productSlug]/api/[apiDataSlug]/page.tsx
@@ -5,9 +5,13 @@ import ProductLayout, {
 import { Product } from '@/lib/types/product';
 import ApiSection from '@/components/molecules/ApiSection/ApiSection';
 import { Metadata, ResolvingMetadata } from 'next';
-import { makeMetadata } from '@/helpers/metadata.helpers';
+import {
+  makeMetadata,
+  makeMetadataFromStrapi,
+} from '@/helpers/metadata.helpers';
 import { ApiDataParams } from '@/lib/types/apiDataParams';
 import PageNotFound from '@/app/not-found';
+import { SEO } from '@/lib/types/seo';
 
 export type ApiPageProps = {
   readonly product?: Product;
@@ -18,6 +22,7 @@ export type ApiPageProps = {
     url: string;
     hideTryIt?: boolean;
   }[];
+  readonly seo?: SEO;
 } & ProductLayoutProps;
 
 export async function generateStaticParams() {
@@ -31,6 +36,10 @@ export const generateMetadata = async (
   const resolvedParent = await parent;
   const ApiDataProps = await getApiData(params.apiDataSlug);
 
+  if (ApiDataProps?.seo) {
+    return makeMetadataFromStrapi(ApiDataProps.seo);
+  }
+
   return makeMetadata({
     title: ApiDataProps?.specURLsName,
     description: ApiDataProps?.product?.description,

diff --git a/apps/nextjs-website/src/app/[productSlug]/api/page.tsx b/apps/nextjs-website/src/app/[productSlug]/api/page.tsx
@@ -1,7 +1,10 @@
 import ProductLayout from '@/components/organisms/ProductLayout/ProductLayout';
 import ApiDataListTemplate from '@/components/templates/ApiDataListTemplate/ApiDataListTemplate';
 import { baseUrl } from '@/config';
-import { makeMetadata } from '@/helpers/metadata.helpers';
+import {
+  makeMetadata,
+  makeMetadataFromStrapi,
+} from '@/helpers/metadata.helpers';
 import { getApiDataListPages, getProduct, getProductsSlugs } from '@/lib/api';
 import { Metadata } from 'next';
 
@@ -22,6 +25,10 @@ export async function generateMetadata({
 }): Promise<Metadata> {
   const apiDataListPage = await getApiDataListPages(params?.productSlug);
 
+  if (apiDataListPage?.seo) {
+    return makeMetadataFromStrapi(apiDataListPage.seo);
+  }
+
   return makeMetadata({
     title: apiDataListPage?.hero.title,
     url: `${baseUrl}/${apiDataListPage?.product.slug}/api`,

diff --git a/apps/nextjs-website/src/app/[productSlug]/guides/[...productGuidePage]/page.tsx b/apps/nextjs-website/src/app/[productSlug]/guides/[...productGuidePage]/page.tsx
@@ -11,7 +11,10 @@ import {
 } from '@/_contents/products';
 import { ParseContentConfig } from 'gitbook-docs/parseContent';
 import { Metadata } from 'next';
-import { makeMetadata } from '@/helpers/metadata.helpers';
+import {
+  makeMetadata,
+  makeMetadataFromStrapi,
+} from '@/helpers/metadata.helpers';
 import GitBookTemplate from '@/components/templates/GitBookTemplate/GitBookTemplate';
 import { productPageToBreadcrumbs } from '@/helpers/breadcrumbs.helpers';
 import { getGuidesProps } from '@/lib/cmsApi';
@@ -54,8 +57,13 @@ export async function generateMetadata({
 }): Promise<Metadata> {
   const {
     page: { path, title },
+    seo,
   } = await getGuide(params?.productSlug, params?.productGuidePage ?? ['']);
 
+  if (seo) {
+    return makeMetadataFromStrapi(seo);
+  }
+
   return makeMetadata({
     title,
     url: path,

diff --git a/apps/nextjs-website/src/app/[productSlug]/guides/page.tsx b/apps/nextjs-website/src/app/[productSlug]/guides/page.tsx
@@ -11,9 +11,13 @@ import ProductLayout, {
 } from '@/components/organisms/ProductLayout/ProductLayout';
 import { ProductParams } from '@/lib/types/productParams';
 import { Metadata, ResolvingMetadata } from 'next';
-import { makeMetadata } from '@/helpers/metadata.helpers';
+import {
+  makeMetadata,
+  makeMetadataFromStrapi,
+} from '@/helpers/metadata.helpers';
 import { BannerLinkProps } from '@/components/atoms/BannerLink/BannerLink';
 import { getGuideListPagesProps } from '@/lib/cmsApi';
+import { SEO } from '@/lib/types/seo';
 
 export async function generateStaticParams() {
   return (await getGuideListPagesProps()).map(({ product }) => ({
@@ -29,14 +33,19 @@ export type GuidesPageProps = {
   };
   readonly guidesSections?: GuidesSectionProps[];
   readonly bannerLinks?: readonly BannerLinkProps[];
+  readonly seo?: SEO;
 } & ProductLayoutProps;
 
 export const generateMetadata = async (
   { params }: ProductParams,
   parent: ResolvingMetadata
 ): Promise<Metadata> => {
   const resolvedParent = await parent;
-  const { path, abstract } = await getGuideLists(params?.productSlug);
+  const { path, abstract, seo } = await getGuideLists(params?.productSlug);
+
+  if (seo) {
+    return makeMetadataFromStrapi(seo);
+  }
 
   return makeMetadata({
     title: abstract?.title,

diff --git a/apps/nextjs-website/src/app/[productSlug]/overview/page.tsx b/apps/nextjs-website/src/app/[productSlug]/overview/page.tsx
@@ -15,8 +15,12 @@ import { FeatureItem } from '@/editorialComponents/Feature/FeatureStackItem';
 import { GuideCardProps } from '@/components/molecules/GuideCard/GuideCard';
 import PostIntegration from '@/components/organisms/PostIntegration/PostIntegration';
 import { ProductParams } from '@/lib/types/productParams';
-import { makeMetadata } from '@/helpers/metadata.helpers';
+import {
+  makeMetadata,
+  makeMetadataFromStrapi,
+} from '@/helpers/metadata.helpers';
 import { getOverviewsProps } from '@/lib/cmsApi';
+import { SEO } from '@/lib/types/seo';
 
 const MAX_NUM_TUTORIALS_IN_OVERVIEW = 3;
 
@@ -87,14 +91,19 @@ export type OverviewPageProps = {
       href: string;
     }[];
   };
+  readonly seo?: SEO;
 } & ProductLayoutProps;
 
 export async function generateMetadata(
   { params }: ProductParams,
   parent: ResolvingMetadata
 ): Promise<Metadata> {
   const resolvedParent = await parent;
-  const { product, path } = await getOverview(params.productSlug);
+  const { product, path, seo } = await getOverview(params.productSlug);
+
+  if (seo) {
+    return makeMetadataFromStrapi(seo);
+  }
 
   return makeMetadata({
     parent: resolvedParent,

diff --git a/apps/nextjs-website/src/app/[productSlug]/quick-start/page.tsx b/apps/nextjs-website/src/app/[productSlug]/quick-start/page.tsx
@@ -9,8 +9,11 @@ import QuickStartGuideStepper from '@/components/molecules/QuickStartGuideSteppe
 import { Step } from '@/lib/types/step';
 import { ProductParams } from '@/lib/types/productParams';
 import { Metadata, ResolvingMetadata } from 'next';
-import { makeMetadata } from '@/helpers/metadata.helpers';
-import { Box, Divider } from '@mui/material';
+import {
+  makeMetadata,
+  makeMetadataFromStrapi,
+} from '@/helpers/metadata.helpers';
+import { SEO } from '@/lib/types/seo';
 
 export async function generateStaticParams() {
   return [...getProductsSlugs('quickStart')].map((productSlug) => ({
@@ -25,17 +28,22 @@ export type QuickStartGuidePageProps = {
   };
   readonly defaultStepAnchor?: string;
   readonly steps?: ReadonlyArray<Step>;
+  readonly seo?: SEO;
 } & ProductLayoutProps;
 
 export async function generateMetadata(
   { params }: ProductParams,
   parent: ResolvingMetadata
 ): Promise<Metadata> {
   const resolvedParent = await parent;
-  const { abstract, path, product } = await getQuickStartGuide(
+  const { abstract, path, product, seo } = await getQuickStartGuide(
     params?.productSlug
   );
 
+  if (seo) {
+    return makeMetadataFromStrapi(seo);
+  }
+
   return makeMetadata({
     parent: resolvedParent,
     title: abstract?.title,

diff --git a/apps/nextjs-website/src/app/[productSlug]/tutorials/[...productTutorialPage]/page.tsx b/apps/nextjs-website/src/app/[productSlug]/tutorials/[...productTutorialPage]/page.tsx
@@ -16,7 +16,10 @@ import {
 } from '@/_contents/products';
 import { ParseContentConfig } from 'gitbook-docs/parseContent';
 import { Metadata } from 'next';
-import { makeMetadata } from '@/helpers/metadata.helpers';
+import {
+  makeMetadata,
+  makeMetadataFromStrapi,
+} from '@/helpers/metadata.helpers';
 import GuideInPageMenu from '@/components/organisms/GuideInPageMenu/GuideInPageMenu';
 import { translations } from '@/_contents/translations';
 import RelatedLinks, {
@@ -60,7 +63,12 @@ export async function generateMetadata({
     tutorialPath,
   ]);
   if (strapiTutorialProps) {
-    const { title, path } = strapiTutorialProps;
+    const { title, path, seo } = strapiTutorialProps;
+
+    if (seo) {
+      return makeMetadataFromStrapi(seo);
+    }
+
     return makeMetadata({
       title,
       url: path,

diff --git a/apps/nextjs-website/src/app/[productSlug]/tutorials/page.tsx b/apps/nextjs-website/src/app/[productSlug]/tutorials/page.tsx
@@ -11,7 +11,11 @@ import Newsroom from '@/editorialComponents/Newsroom/Newsroom';
 import React from 'react';
 import { translations } from '@/_contents/translations';
 import { ProductParams } from '@/lib/types/productParams';
-import { makeMetadata } from '@/helpers/metadata.helpers';
+import {
+  makeMetadata,
+  makeMetadataFromStrapi,
+} from '@/helpers/metadata.helpers';
+import { SEO } from '@/lib/types/seo';
 
 export async function generateStaticParams() {
   return [...getProductsSlugs('tutorials')].map((productSlug) => ({
@@ -26,17 +30,22 @@ export type TutorialsPageProps = {
     readonly description: string;
   };
   readonly tutorials: readonly Tutorial[];
+  readonly seo?: SEO;
 } & ProductLayoutProps;
 
 export async function generateMetadata(
   { params }: ProductParams,
   parent: ResolvingMetadata
 ): Promise<Metadata> {
   const resolvedParent = await parent;
-  const { product, abstract, path } = await getTutorialListPageProps(
+  const { product, abstract, path, seo } = await getTutorialListPageProps(
     params.productSlug
   );
 
+  if (seo) {
+    return makeMetadataFromStrapi(seo);
+  }
+
   return makeMetadata({
     parent: resolvedParent,
     title: product.name,

diff --git a/apps/nextjs-website/src/app/case-histories/[caseHistorySlug]/page.tsx b/apps/nextjs-website/src/app/case-histories/[caseHistorySlug]/page.tsx
@@ -1,4 +1,7 @@
-import { makeMetadata } from '@/helpers/metadata.helpers';
+import {
+  makeMetadata,
+  makeMetadataFromStrapi,
+} from '@/helpers/metadata.helpers';
 import { Metadata } from 'next';
 import { baseUrl } from '@/config';
 import { getCaseHistoriesProps } from '@/lib/cmsApi';
@@ -23,6 +26,10 @@ export async function generateMetadata({
 }): Promise<Metadata> {
   const caseHistory = await getCaseHistory(params?.caseHistorySlug);
 
+  if (caseHistory?.seo) {
+    return makeMetadataFromStrapi(caseHistory.seo);
+  }
+
   return makeMetadata({
     title: caseHistory.title,
     url: `${baseUrl}/case-histories/${caseHistory.slug}`,

diff --git a/apps/nextjs-website/src/app/solutions/[solutionSlug]/page.tsx b/apps/nextjs-website/src/app/solutions/[solutionSlug]/page.tsx
@@ -1,4 +1,7 @@
-import { makeMetadata } from '@/helpers/metadata.helpers';
+import {
+  makeMetadata,
+  makeMetadataFromStrapi,
+} from '@/helpers/metadata.helpers';
 import { Metadata } from 'next';
 import { baseUrl } from '@/config';
 import { getSolution } from '@/lib/api';
@@ -23,6 +26,10 @@ export async function generateMetadata({
 }): Promise<Metadata> {
   const solution = await getSolution(params?.solutionSlug);
 
+  if (solution.seo) {
+    return makeMetadataFromStrapi(solution.seo);
+  }
+
   return makeMetadata({
     title: solution.title,
     url: `${baseUrl}/solutions/${solution.slug}`,

diff --git a/apps/nextjs-website/src/app/webinars/[webinarSlug]/page.tsx b/apps/nextjs-website/src/app/webinars/[webinarSlug]/page.tsx
@@ -1,7 +1,10 @@
 import { getWebinar } from '@/lib/api';
 import dynamic from 'next/dynamic';
 import Spinner from '@/components/atoms/Spinner/Spinner';
-import { makeMetadata } from '@/helpers/metadata.helpers';
+import {
+  makeMetadata,
+  makeMetadataFromStrapi,
+} from '@/helpers/metadata.helpers';
 import { Metadata } from 'next';
 import { baseUrl } from '@/config';
 import { getWebinarsProps } from '@/lib/cmsApi';
@@ -24,6 +27,10 @@ export async function generateMetadata({
 }): Promise<Metadata> {
   const webinar = await getWebinar(params?.webinarSlug);
 
+  if (webinar.seo) {
+    return makeMetadataFromStrapi(webinar.seo);
+  }
+
   return makeMetadata({
     title: webinar.title,
     url: `${baseUrl}/webinars/${webinar.slug}`,

diff --git a/apps/nextjs-website/src/components/templates/ApiDataListTemplate/ApiDataListTemplate.tsx b/apps/nextjs-website/src/components/templates/ApiDataListTemplate/ApiDataListTemplate.tsx
@@ -7,6 +7,7 @@ import { BannerLinkProps } from '@/components/atoms/BannerLink/BannerLink';
 import BannerLinks from '@/components/molecules/BannerLinks/BannerLinks';
 import { StrapiApiDataList } from '@/lib/strapi/codecs/ApiDataListCodec';
 import { useTranslations } from 'next-intl';
+import { SEO } from '@/lib/types/seo';
 
 export type ApiDataListTemplateProps = {
   readonly hero: {
@@ -31,6 +32,7 @@ export type ApiDataListTemplateProps = {
   readonly bannerLinks: BannerLinkProps[];
   readonly theme?: Theme;
   readonly apiData: StrapiApiDataList;
+  readonly seo?: SEO;
 };
 
 const ApiDataListTemplate = ({

diff --git a/apps/nextjs-website/src/components/templates/CaseHistoryTemplate/CaseHistoryPageTemplate.tsx b/apps/nextjs-website/src/components/templates/CaseHistoryTemplate/CaseHistoryPageTemplate.tsx
@@ -10,6 +10,7 @@ import { pageToBreadcrumbs } from '@/helpers/breadcrumbs.helpers';
 import { Box, Typography, useTheme } from '@mui/material';
 import EContainer from '@/editorialComponents/EContainer/EContainer';
 import { Media } from '@/lib/strapi/codecs/MediaCodec';
+import { SEO } from '@/lib/types/seo';
 
 export type CaseHistoryPageTemplateProps = {
   slug: string;
@@ -18,6 +19,7 @@ export type CaseHistoryPageTemplateProps = {
   description?: string;
   products: Pick<Product, 'logo' | 'slug' | 'name' | 'description'>[];
   parts: Part[];
+  seo?: SEO;
 };
 
 const CaseHistoryPageTemplate = ({

diff --git a/apps/nextjs-website/src/components/templates/SolutionListTemplate/SolutionListTemplate.tsx b/apps/nextjs-website/src/components/templates/SolutionListTemplate/SolutionListTemplate.tsx
@@ -5,6 +5,7 @@ import Feature from '@/editorialComponents/Feature/Feature';
 import { FeatureItem } from '@/editorialComponents/Feature/FeatureStackItem';
 import Hero from '@/editorialComponents/Hero/Hero';
 import { Media } from '@/lib/strapi/codecs/MediaCodec';
+import { SEO } from '@/lib/types/seo';
 import { useTranslations } from 'next-intl';
 
 export type SolutionListTemplateProps = {
@@ -39,6 +40,7 @@ export type SolutionListTemplateProps = {
       };
     }[];
   };
+  seo?: SEO;
 };
 
 const SolutionListTemplate = ({