feat(platform): Display requested title in platform redirect (#11646)

Author: chargome

Diff for: app/platform-redirect/page.tsx

@@ -1,5 +1,6 @@
 import {redirect} from 'next/navigation';
 
+import {Alert} from 'sentry-docs/components/alert';
 import {DocPage} from 'sentry-docs/components/docPage';
 import {PlatformIcon} from 'sentry-docs/components/platformIcon';
 import {SmartLink} from 'sentry-docs/components/smartLink';
@@ -14,16 +15,31 @@ export default async function Page({
   if (Array.isArray(next)) {
     next = next[0];
   }
+
   // discard the hash
   const [pathname, _] = next.split('#');
   const rootNode = await getDocsRootNode();
+  const defaultTitle = 'Platform Specific Content';
+  let description = '';
+  const platformInfo =
+    "The page you are looking for is customized for each platform. Select your platform below and we'll direct you to the most specific documentation on it.";
+  let title = defaultTitle;
+
   // get rid of irrelevant platforms for the `next` path
   const platformList = extractPlatforms(rootNode).filter(platform_ => {
-    return !!nodeForPath(rootNode, [
+    const node = nodeForPath(rootNode, [
       'platforms',
       platform_.key,
       ...pathname.split('/').filter(Boolean),
     ]);
+
+    // extract title and description for displaying it on page
+    if (node && title === defaultTitle && pathname.length > 0) {
+      title = node.frontmatter.title ?? title;
+      description = node.frontmatter.description || '';
+    }
+
+    return !!node;
   });
 
   if (platformList.length === 0) {
@@ -42,18 +58,16 @@ export default async function Page({
   }
 
   const frontMatter = {
-    title: 'Platform Specific Content',
+    title,
+    description,
   };
 
   // make the Sidebar aware of the current path
   setServerContext({rootNode, path: ['platform-redirect']});
 
   return (
     <DocPage frontMatter={frontMatter}>
-      <p>
-        The page you are looking for is customized for each platform. Select your platform
-        below and we&apos;ll direct you to the most specific documentation on it.
-      </p>
+      <Alert level="info">{platformInfo}</Alert>
 
       <ul>
         {platformList.map(p => (