refactor(pages): rewrite helpers to output schema in json-ld format

* make sure url are absolutes
* nest breadcrumb schema in webpage schema
* trim HTML tags from content/description
* use a regular script instead of next/script (with the latter the
schema is not updated on route change)
* place the script in document head
* add keywords, wordCount and readingTime keys in BlogPosting schema
* fix breadcrumbs in search page (without query)
* add tests (a `MatchInlineSnapshot` will be better but Prettier 3 is
not supported yet)

1 files changed, 3 insertions, 2 deletions

diff --git a/src/components/templates/page/page-comments.tsx b/src/components/templates/page/page-comments.tsx
index 5f5208f..01c4eea 100644
--- a/src/components/templates/page/page-comments.tsx
+++ b/src/components/templates/page/page-comments.tsx
@@ -10,6 +10,7 @@ import {
   createComment,
   type CreateCommentInput,
 } from '../../../services/graphql';
+import { COMMENTS_SECTION_ID } from '../../../utils/constants';
 import { Heading, Link, Section } from '../../atoms';
 import { Card, CardBody } from '../../molecules';
 import {
@@ -27,7 +28,7 @@ const link = (chunks: ReactNode) => (
 
 export type PageCommentsProps = Omit<
   HTMLAttributes<HTMLDivElement>,
-  'children' | 'onSubmit'
+  'children' | 'id' | 'onSubmit'
 > &
   Pick<CommentsListProps, 'depth'> & {
     /**
@@ -139,7 +140,7 @@ const PageCommentsWithRef: ForwardRefRenderFunction<
   );
 
   return (
-    <div {...props} className={wrapperClass} ref={ref}>
+    <div {...props} className={wrapperClass} id={COMMENTS_SECTION_ID} ref={ref}>
       <Section className={styles.comments__body}>
         <Heading className={styles.heading} level={2}>
           {commentsListTitle}