From b36ab92eb1642329368279e37ec57255625c1f02 Mon Sep 17 00:00:00 2001
From: Alex Krawiec <alex.krawiec@R7J1Y747QQ.local>
Date: Thu, 24 Oct 2024 14:44:50 -0700
Subject: [PATCH 1/3] Get custom canonical tags functioning using frontmatter

---
 app/[[...path]]/page.tsx                      | 20 ++++++++++++++++++-
 .../common/configuration/options.mdx          |  1 +
 src/types/frontmatter.ts                      |  2 ++
 3 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/app/[[...path]]/page.tsx b/app/[[...path]]/page.tsx
index a3df97f0c781f..ae0393b02ccfa 100644
--- a/app/[[...path]]/page.tsx
+++ b/app/[[...path]]/page.tsx
@@ -132,6 +132,17 @@ type MetadataProps = {
   };
 };
 
+// Helper function to clean up canonical tags missing leading or trailing slash
+function checkCanonicalTagFormat(tag: string) {
+  if (tag.charAt(0) !== '/') {
+    tag = '/' + tag;
+  }
+  if (tag.charAt(tag.length - 1) !== '/') {
+    tag = tag + '/';
+  }
+  return tag;
+}
+
 export async function generateMetadata({params}: MetadataProps): Promise<Metadata> {
   const domain = isDeveloperDocs
     ? 'https://develop.sentry.dev'
@@ -142,6 +153,7 @@ export async function generateMetadata({params}: MetadataProps): Promise<Metadat
     : domain;
   let title =
     'Sentry Docs | Application Performance Monitoring &amp; Error Tracking Software';
+  let customCanonicalTag;
   let description =
     'Self-hosted and cloud-based application performance monitoring &amp; error tracking that helps software teams see clearer, solve quicker, &amp; learn continuously.';
   const images = [{url: `${previewDomain ?? domain}/meta.jpg`, width: 1200, height: 822}];
@@ -160,11 +172,17 @@ export async function generateMetadata({params}: MetadataProps): Promise<Metadat
         pageNode.frontmatter.title +
         (guideOrPlatform ? ` | Sentry for ${guideOrPlatform.title}` : '');
       description = pageNode.frontmatter.description ?? '';
+
+      if (pageNode.frontmatter.customCanonicalTag) {
+        customCanonicalTag = pageNode.frontmatter.customCanonicalTag;
+      }
     }
   }
 
   let canonical = domain;
-  if (params.path) {
+  if (customCanonicalTag) {
+    canonical = domain + checkCanonicalTagFormat(customCanonicalTag);
+  } else if (params.path) {
     canonical = `${domain}/${params.path.join('/')}/`;
   }
 
diff --git a/docs/platforms/javascript/common/configuration/options.mdx b/docs/platforms/javascript/common/configuration/options.mdx
index 7ee147682ebcc..2e40f7b36e7c4 100644
--- a/docs/platforms/javascript/common/configuration/options.mdx
+++ b/docs/platforms/javascript/common/configuration/options.mdx
@@ -1,6 +1,7 @@
 ---
 title: Basic Options
 description: "Learn more about how to configure the SDK. These options are set when the SDK is first initialized, passed to the init function as an object."
+customCanonicalTag: "platforms/javascript/guides/configuration/options/"
 sidebar_order: 1
 ---
 
diff --git a/src/types/frontmatter.ts b/src/types/frontmatter.ts
index 708b1cbd20997..92b7944e2ad8a 100644
--- a/src/types/frontmatter.ts
+++ b/src/types/frontmatter.ts
@@ -14,6 +14,8 @@ export interface FrontMatter {
   /**
    * A description to use in the <meta> header, as well as in auto generated page grids.
    */
+  customCanonicalTag?: string;
+  /**  Add this if you want to add a canonical tag (without this it will default to the page url). Should be a relative path without the domain (e.g. `/platforms/react/options/`) */
   description?: string;
   /**
    * Set this to true to mark this page as a draft, and hide it from various other components (such as the PageGrid).

From 2ca6cc437b79205e2d7781d559c6e214dabfa2fc Mon Sep 17 00:00:00 2001
From: Alex Krawiec <alex.krawiec@R7J1Y747QQ.local>
Date: Thu, 24 Oct 2024 15:19:27 -0700
Subject: [PATCH 2/3] Add more canonical tags and refactored code logic

---
 app/[[...path]]/page.tsx                              | 11 +++++------
 .../javascript/common/configuration/options.mdx       |  2 +-
 .../common/enriching-events/level/index.mdx           |  1 +
 .../javascript/common/session-replay/privacy.mdx      |  1 +
 .../javascript/common/sourcemaps/uploading/vite.mdx   |  1 +
 .../common/sourcemaps/uploading/webpack.mdx           |  1 +
 6 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/app/[[...path]]/page.tsx b/app/[[...path]]/page.tsx
index ae0393b02ccfa..9451406ee9dfa 100644
--- a/app/[[...path]]/page.tsx
+++ b/app/[[...path]]/page.tsx
@@ -179,12 +179,11 @@ export async function generateMetadata({params}: MetadataProps): Promise<Metadat
     }
   }
 
-  let canonical = domain;
-  if (customCanonicalTag) {
-    canonical = domain + checkCanonicalTagFormat(customCanonicalTag);
-  } else if (params.path) {
-    canonical = `${domain}/${params.path.join('/')}/`;
-  }
+  const canonical = customCanonicalTag
+    ? domain + checkCanonicalTagFormat(customCanonicalTag)
+    : params.path
+      ? `${domain}/${params.path.join('/')}/`
+      : domain;
 
   return {
     title,
diff --git a/docs/platforms/javascript/common/configuration/options.mdx b/docs/platforms/javascript/common/configuration/options.mdx
index 2e40f7b36e7c4..da76c18488cef 100644
--- a/docs/platforms/javascript/common/configuration/options.mdx
+++ b/docs/platforms/javascript/common/configuration/options.mdx
@@ -1,7 +1,7 @@
 ---
 title: Basic Options
 description: "Learn more about how to configure the SDK. These options are set when the SDK is first initialized, passed to the init function as an object."
-customCanonicalTag: "platforms/javascript/guides/configuration/options/"
+customCanonicalTag: "/platforms/javascript/configuration/options/"
 sidebar_order: 1
 ---
 
diff --git a/docs/platforms/javascript/common/enriching-events/level/index.mdx b/docs/platforms/javascript/common/enriching-events/level/index.mdx
index 295e8474ee425..2b54ba5c571f0 100644
--- a/docs/platforms/javascript/common/enriching-events/level/index.mdx
+++ b/docs/platforms/javascript/common/enriching-events/level/index.mdx
@@ -1,6 +1,7 @@
 ---
 title: Event Level
 description: "The level - similar to logging levels - is generally added by default based on the integration. You can also override it within an event."
+customCanonicalTag: "/platforms/javascript/enriching-events/level/"
 ---
 
 The level - similar to logging levels - is generally added by default by the SDK. You can either provide a dedicated level directly in `captureMessage`, or configure a level on the scope in order to apply it to all events.
diff --git a/docs/platforms/javascript/common/session-replay/privacy.mdx b/docs/platforms/javascript/common/session-replay/privacy.mdx
index fe25bac39563c..648f66b87d6f3 100644
--- a/docs/platforms/javascript/common/session-replay/privacy.mdx
+++ b/docs/platforms/javascript/common/session-replay/privacy.mdx
@@ -18,6 +18,7 @@ notSupported:
   - javascript.nestjs
   - javascript.cloudflare
 description: "Configuring Session Replay to maintain user and data privacy."
+customCanonicalTag: "/platforms/javascript/session-replay/privacy/"
 ---
 
 <Include name="session-replay-web-report-bug.mdx" />
diff --git a/docs/platforms/javascript/common/sourcemaps/uploading/vite.mdx b/docs/platforms/javascript/common/sourcemaps/uploading/vite.mdx
index f164773a9ec9b..41ccd84a26b10 100644
--- a/docs/platforms/javascript/common/sourcemaps/uploading/vite.mdx
+++ b/docs/platforms/javascript/common/sourcemaps/uploading/vite.mdx
@@ -1,6 +1,7 @@
 ---
 title: Vite
 description: "Upload your source maps with the Sentry Vite Plugin."
+customCanonicalTag: "/platforms/javascript/sourcemaps/uploading/vite/"
 sidebar_order: 3
 ---
 
diff --git a/docs/platforms/javascript/common/sourcemaps/uploading/webpack.mdx b/docs/platforms/javascript/common/sourcemaps/uploading/webpack.mdx
index c5770e9009703..614f922c9064d 100644
--- a/docs/platforms/javascript/common/sourcemaps/uploading/webpack.mdx
+++ b/docs/platforms/javascript/common/sourcemaps/uploading/webpack.mdx
@@ -1,6 +1,7 @@
 ---
 title: Webpack
 description: "Upload your source maps with our webpack plugin."
+customCanonicalTag: "/platforms/javascript/sourcemaps/uploading/webpack/"
 sidebar_order: 1
 ---
 

From 4ddbe3e3128f691032125f1790d467dde0d3b4f3 Mon Sep 17 00:00:00 2001
From: Alex Krawiec <alex.krawiec@R7J1Y747QQ.local>
Date: Mon, 28 Oct 2024 11:00:13 -0700
Subject: [PATCH 3/3] Small refactor of tag format helper function for
 readability

---
 app/[[...path]]/page.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/[[...path]]/page.tsx b/app/[[...path]]/page.tsx
index 9451406ee9dfa..e8b94fb86ba52 100644
--- a/app/[[...path]]/page.tsx
+++ b/app/[[...path]]/page.tsx
@@ -133,7 +133,7 @@ type MetadataProps = {
 };
 
 // Helper function to clean up canonical tags missing leading or trailing slash
-function checkCanonicalTagFormat(tag: string) {
+function formatCanonicalTag(tag: string) {
   if (tag.charAt(0) !== '/') {
     tag = '/' + tag;
   }
@@ -174,13 +174,13 @@ export async function generateMetadata({params}: MetadataProps): Promise<Metadat
       description = pageNode.frontmatter.description ?? '';
 
       if (pageNode.frontmatter.customCanonicalTag) {
-        customCanonicalTag = pageNode.frontmatter.customCanonicalTag;
+        customCanonicalTag = formatCanonicalTag(pageNode.frontmatter.customCanonicalTag);
       }
     }
   }
 
   const canonical = customCanonicalTag
-    ? domain + checkCanonicalTagFormat(customCanonicalTag)
+    ? domain + customCanonicalTag
     : params.path
       ? `${domain}/${params.path.join('/')}/`
       : domain;