fix open graph image and adding hardening dock to community

app/(docs)/[[...slug]]/page.tsx

@@ -11,7 +11,7 @@ import { notFound } from 'next/navigation';
 import { getMDXComponents } from '@/components/mdx';
 import type { Metadata } from 'next';
 import { createRelativeLink } from 'fumadocs-ui/mdx';
-import { appName, docsDir, getPageImageUrl, getPageMarkdownUrl, gitConfig, siteUrl } from '@/lib/shared';
+import { appName, docsDir, getPageMarkdownUrl, gitConfig, siteUrl } from '@/lib/shared';
 import { AskAIAboutPage } from '@/components/ai/ask-page';
 import { SiteFooter } from '@/components/site-footer';
 import { AskBar } from '@/components/ai/ask-bar';
@@ -80,7 +80,7 @@ export async function generateMetadata(props: PageProps<'/[[...slug]]'>): Promis
       types: { 'text/markdown': getPageMarkdownUrl(page).url },
     },
     openGraph: {
-      images: isHome ? '/images/home-social-graph.png' : getPageImageUrl(page).url,
+      images: '/images/home-social-graph.png',
     },
   };
 }

app/og/[...slug]/route.tsx

@@ -1,26 +0,0 @@
-import { source } from '@/lib/source';
-import { notFound } from 'next/navigation';
-import { generateOGImage } from 'fumadocs-ui/og';
-import { appName, getPageImageUrl } from '@/lib/shared';
-
-export const revalidate = false;
-
-export async function GET(_req: Request, { params }: RouteContext<'/og/[...slug]'>) {
-  const { slug } = await params;
-  const page = source.getPage(slug.slice(0, -1));
-  if (!page) notFound();
-
-  return generateOGImage({
-    title: page.data.title,
-    description: page.data.description,
-    site: appName,
-    primaryColor: 'rgba(243, 97, 23, 0.35)',
-    primaryTextColor: 'rgb(243, 97, 23)',
-  });
-}
-
-export function generateStaticParams() {
-  return source.getPages().map((page) => ({
-    slug: getPageImageUrl(page).segments,
-  }));
-}

components/analytics.tsx

@@ -21,8 +21,7 @@ export function Analytics() {
 posthog.init(${JSON.stringify(POSTHOG_KEY)},{api_host:${JSON.stringify(POSTHOG_HOST)},ui_host:'https://us.posthog.com',person_profiles:'identified_only'});`}
       </Script>
       <Script
-        src="https://rybbit.fossorial.io/api/script.js"
-        data-site-id={RYBBIT_SITE_ID}
+        src={`https://rybbit.fossorial.io/api/script.js?siteId=${RYBBIT_SITE_ID}`}
         strategy="afterInteractive"
       />
       <Script

lib/navigation.json

@@ -321,6 +321,7 @@
             "self-host/community-guides/homeassistant",
             "self-host/community-guides/middlewaremanager",
             "self-host/community-guides/traefiklogsdashboard",
+            "self-host/community-guides/traefik-hardening",
             "self-host/community-guides/geolite2automation"
           ]
         },

lib/shared.ts

@@ -7,7 +7,6 @@ export const siteDescription =
 
 /** docs are served from the site root, same URLs as the old Mintlify site */
 export const docsRoute = '/';
-export const docsImageRoute = '/og';
 export const docsContentRoute = '/llms.mdx';
 
 export const gitConfig = {
@@ -27,14 +26,6 @@ export function getPageMarkdownUrl(page: { slugs: string[]; locale?: string }) {
   return { segments, url: getContentUrl(segments, page.locale) };
 }
 
-const getImageUrl = createGetUrl(docsImageRoute);
-
-export function getPageImageUrl(page: { slugs: string[]; locale?: string }) {
-  const segments = [...page.slugs, 'image.png'];
-
-  return { segments, url: getImageUrl(segments, page.locale) };
-}
-
 /**
  * The Mintlify site was light-only (`appearance.strict`). Flip this to enable the
  * theme switch; the dark palette in `app/global.css` is ready for it.