From 3d2c18fb5d63ca738cb6cc668f4c286c8f288d5e Mon Sep 17 00:00:00 2001
From: Nick the Sick <nick@blocknotejs.org>
Date: Mon, 22 Sep 2025 11:03:39 +0200
Subject: [PATCH 1/9] docs: update analytics event tracking

---
 docs/app/pricing/tiers.tsx             | 34 ++++++++++++++++++++++++--
 docs/components/AuthenticationPage.tsx | 26 ++++++++++++--------
 2 files changed, 48 insertions(+), 12 deletions(-)

diff --git a/docs/app/pricing/tiers.tsx b/docs/app/pricing/tiers.tsx
index 8b24b7107d..74e7f6154c 100644
--- a/docs/app/pricing/tiers.tsx
+++ b/docs/app/pricing/tiers.tsx
@@ -72,25 +72,55 @@ function TierCTAButton({ tier }: { tier: Tier }) {
   return (
     <a
       onClick={async (e) => {
+        // This event is deprecated, but we keep it to use as a baseline for analytics
+        track("Signup", { tier: tier.id });
+
         if (!session) {
+          Sentry.captureEvent({
+            message: "click-pricing-signup",
+            level: "info",
+            extra: {
+              tier: tier.id,
+            },
+          });
+          track("click-pricing-signup", { tier: tier.id });
           return;
         }
 
         if (session.planType === "free") {
           Sentry.captureEvent({
-            message: "Checkout",
+            message: "click-pricing-buy-now",
             level: "info",
             extra: {
               tier: tier.id,
             },
           });
-          track("Checkout", { tier: tier.id });
+          track("click-pricing-buy-now", { tier: tier.id });
           e.preventDefault();
           e.stopPropagation();
           await authClient.checkout({
             slug: tier.id,
           });
         } else {
+          if (session.planType === tier.id) {
+            Sentry.captureEvent({
+              message: "click-pricing-manage-subscription",
+              level: "info",
+              extra: {
+                tier: tier.id,
+              },
+            });
+            track("click-pricing-manage-subscription", { tier: tier.id });
+          } else {
+            Sentry.captureEvent({
+              message: "click-pricing-update-subscription",
+              level: "info",
+              extra: {
+                tier: tier.id,
+              },
+            });
+            track("click-pricing-update-subscription", { tier: tier.id });
+          }
           e.preventDefault();
           e.stopPropagation();
           await authClient.customer.portal();
diff --git a/docs/components/AuthenticationPage.tsx b/docs/components/AuthenticationPage.tsx
index e9518cd0aa..c2bfad8252 100644
--- a/docs/components/AuthenticationPage.tsx
+++ b/docs/components/AuthenticationPage.tsx
@@ -71,9 +71,9 @@ function AuthenticationBox(props: {
     setSigningInState({ state: "loading" });
 
     if (props.variant === "password") {
-      track("Sign In", { type: "password" });
+      track("click-sign-in", { type: "password" });
       Sentry.captureEvent({
-        message: "Sign In",
+        message: "click-sign-in",
         level: "info",
         extra: {
           type: "password",
@@ -98,9 +98,9 @@ function AuthenticationBox(props: {
         },
       );
     } else if (props.variant === "email") {
-      track("Sign In", { type: "magic-link" });
+      track("click-sign-in", { type: "magic-link" });
       Sentry.captureEvent({
-        message: "Sign In",
+        message: "click-sign-in",
         level: "info",
         extra: {
           type: "magic-link",
@@ -135,9 +135,9 @@ function AuthenticationBox(props: {
         },
       );
     } else {
-      track("Create Account");
+      track("click-sign-up", { type: "email" });
       Sentry.captureEvent({
-        message: "Sign Up",
+        message: "click-sign-up",
         level: "info",
         extra: {
           type: "email",
@@ -323,7 +323,9 @@ function PasswordSignInButton() {
   );
 }
 
-function GitHubSignInButton() {
+function GitHubSignInButton(props: {
+  variant: "password" | "register" | "email";
+}) {
   const searchParams = useSearchParams();
   const callbackURL = searchParams?.get("redirect") || "/";
 
@@ -345,9 +347,13 @@ function GitHubSignInButton() {
         </svg>
       }
       onClick={async () => {
-        track("Sign In", { type: "github" });
+        track(
+          props.variant === "register" ? "click-sign-up" : "click-sign-in",
+          { type: "github" },
+        );
         Sentry.captureEvent({
-          message: "Sign In",
+          message:
+            props.variant === "register" ? "click-sign-up" : "click-sign-in",
           level: "info",
           extra: {
             type: "github",
@@ -380,7 +386,7 @@ function AlternativeSignInBox(props: {
       <div className="mt-6 flex flex-col gap-4">
         {props.variant === "email" && <PasswordSignInButton />}
         {props.variant === "password" && <EmailSignInButton />}
-        <GitHubSignInButton />
+        <GitHubSignInButton variant={props.variant} />
       </div>
     </div>
   );

From 2b25ca50ed54984864f0b679a3ea4f3d87d5a4c8 Mon Sep 17 00:00:00 2001
From: Nick the Sick <nick@blocknotejs.org>
Date: Mon, 22 Sep 2025 15:27:51 +0200
Subject: [PATCH 2/9] fix(docs): add error boundaries for better UX

---
 docs/app/(home)/layout.tsx                    | 21 +++++++++++++-
 docs/app/about/layout.tsx                     | 21 +++++++++++++-
 docs/app/docs/layout.tsx                      | 19 +++++++++++-
 docs/app/examples/layout.tsx                  | 19 +++++++++++-
 docs/app/global-error.tsx                     | 10 +++++--
 docs/app/layout.tsx                           | 18 +++++++++++-
 .../layout.tsx                                | 21 +++++++++++++-
 docs/app/legal/privacy-policy/layout.tsx      | 21 +++++++++++++-
 .../legal/service-level-agreement/layout.tsx  | 21 +++++++++++++-
 .../app/legal/terms-and-conditions/layout.tsx | 21 +++++++++++++-
 docs/app/pricing/layout.tsx                   | 21 +++++++++++++-
 docs/app/signin/layout.tsx                    | 23 ++++++++++++++-
 docs/app/signup/layout.tsx                    | 23 ++++++++++++++-
 docs/app/thanks/layout.tsx                    | 21 +++++++++++++-
 docs/components/Example.tsx                   | 29 ++++++++++++++-----
 15 files changed, 285 insertions(+), 24 deletions(-)

diff --git a/docs/app/(home)/layout.tsx b/docs/app/(home)/layout.tsx
index 235258e8c5..1cdb476017 100644
--- a/docs/app/(home)/layout.tsx
+++ b/docs/app/(home)/layout.tsx
@@ -2,11 +2,30 @@ import type { ReactNode } from "react";
 import { HomeLayout } from "fumadocs-ui/layouts/home";
 import { baseOptions } from "@/app/layout.config";
 import { Footer } from "@/components/Footer";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
   return (
     <>
-      <HomeLayout {...baseOptions}>{children}</HomeLayout>
+      <HomeLayout {...baseOptions}>
+        <Sentry.ErrorBoundary
+          fallback={
+            <div>
+              We encountered an error trying to show this page. Please report
+              this to us on GitHub at{" "}
+              <a href="https://github.com/TypeCellOS/BlockNote/issues">
+                https://github.com/TypeCellOS/BlockNote/issues
+              </a>
+            </div>
+          }
+          beforeCapture={(scope) => {
+            scope.setTag("type", "react-render");
+            scope.setTag("page", "home");
+          }}
+        >
+          {children}
+        </Sentry.ErrorBoundary>
+      </HomeLayout>
       <Footer />
     </>
   );
diff --git a/docs/app/about/layout.tsx b/docs/app/about/layout.tsx
index 8bd5d635ce..cdbd096704 100644
--- a/docs/app/about/layout.tsx
+++ b/docs/app/about/layout.tsx
@@ -2,11 +2,30 @@ import { HomeLayout } from "fumadocs-ui/layouts/home";
 import type { ReactNode } from "react";
 import { baseOptions } from "@/app/layout.config";
 import { Footer } from "@/components/Footer";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
   return (
     <>
-      <HomeLayout {...baseOptions}>{children}</HomeLayout>
+      <HomeLayout {...baseOptions}>
+        <Sentry.ErrorBoundary
+          fallback={
+            <div>
+              We encountered an error trying to show this page. Please report
+              this to us on GitHub at{" "}
+              <a href="https://github.com/TypeCellOS/BlockNote/issues">
+                https://github.com/TypeCellOS/BlockNote/issues
+              </a>
+            </div>
+          }
+          beforeCapture={(scope) => {
+            scope.setTag("type", "react-render");
+            scope.setTag("page", "about");
+          }}
+        >
+          {children}
+        </Sentry.ErrorBoundary>
+      </HomeLayout>
       <Footer />
     </>
   );
diff --git a/docs/app/docs/layout.tsx b/docs/app/docs/layout.tsx
index b144332b6b..f88616023d 100644
--- a/docs/app/docs/layout.tsx
+++ b/docs/app/docs/layout.tsx
@@ -4,12 +4,29 @@ import { baseOptions } from "@/app/layout.config";
 import { CustomDocsLayout } from "@/components/CustomDocsLayout";
 import { Footer } from "@/components/Footer";
 import { source } from "@/lib/source/docs";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
   return (
     <>
       <CustomDocsLayout tree={source.pageTree} {...baseOptions}>
-        {children}
+        <Sentry.ErrorBoundary
+          fallback={
+            <div>
+              We encountered an error trying to show this page. Please report
+              this to us on GitHub at{" "}
+              <a href="https://github.com/TypeCellOS/BlockNote/issues">
+                https://github.com/TypeCellOS/BlockNote/issues
+              </a>
+            </div>
+          }
+          beforeCapture={(scope) => {
+            scope.setTag("type", "react-render");
+            scope.setTag("page", "docs");
+          }}
+        >
+          {children}
+        </Sentry.ErrorBoundary>
       </CustomDocsLayout>
       <Footer />
       <Analytics />
diff --git a/docs/app/examples/layout.tsx b/docs/app/examples/layout.tsx
index e82b8a4039..553373605a 100644
--- a/docs/app/examples/layout.tsx
+++ b/docs/app/examples/layout.tsx
@@ -6,6 +6,7 @@ import { Footer } from "@/components/Footer";
 import { ProBadge } from "@/components/ProBadge";
 import { source } from "@/lib/source/examples";
 import { getExampleData } from "@/util/getExampleData";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
   // Add Pro badges to example pages in sidebar.
@@ -34,7 +35,23 @@ export default function Layout({ children }: { children: ReactNode }) {
   return (
     <>
       <CustomDocsLayout tree={source.pageTree} {...baseOptions}>
-        {children}
+        <Sentry.ErrorBoundary
+          fallback={
+            <div>
+              We encountered an error trying to show this page. Please report
+              this to us on GitHub at{" "}
+              <a href="https://github.com/TypeCellOS/BlockNote/issues">
+                https://github.com/TypeCellOS/BlockNote/issues
+              </a>
+            </div>
+          }
+          beforeCapture={(scope) => {
+            scope.setTag("type", "react-render");
+            scope.setTag("page", "examples");
+          }}
+        >
+          {children}
+        </Sentry.ErrorBoundary>
       </CustomDocsLayout>
       <Footer />
       <Analytics />
diff --git a/docs/app/global-error.tsx b/docs/app/global-error.tsx
index 9bda5feef0..498b5984d3 100644
--- a/docs/app/global-error.tsx
+++ b/docs/app/global-error.tsx
@@ -4,9 +4,13 @@ import * as Sentry from "@sentry/nextjs";
 import NextError from "next/error";
 import { useEffect } from "react";
 
-export default function GlobalError({ error }: { error: Error & { digest?: string } }) {
+export default function GlobalError({
+  error,
+}: {
+  error: Error & { digest?: string };
+}) {
   useEffect(() => {
-    Sentry.captureException(error);
+    Sentry.captureException(error, { tags: { type: "react-render" } });
   }, [error]);
 
   return (
@@ -20,4 +24,4 @@ export default function GlobalError({ error }: { error: Error & { digest?: strin
       </body>
     </html>
   );
-}
\ No newline at end of file
+}
diff --git a/docs/app/layout.tsx b/docs/app/layout.tsx
index 9eaa409569..0bc04f7514 100644
--- a/docs/app/layout.tsx
+++ b/docs/app/layout.tsx
@@ -3,6 +3,7 @@ import { RootProvider } from "fumadocs-ui/provider";
 import { Analytics } from "@vercel/analytics/react";
 import { Metadata } from "next";
 import type { ReactNode } from "react";
+import * as Sentry from "@sentry/nextjs";
 
 import { getFullMetadata } from "@/util/getFullMetadata";
 
@@ -29,7 +30,22 @@ export default function Layout({ children }: { children: ReactNode }) {
             Access the early preview.
           </a>
         </Banner>
-        <RootProvider>{children as any}</RootProvider>
+        <Sentry.ErrorBoundary
+          fallback={
+            <div>
+              We encountered an error trying to show this page. Please report
+              this to us on GitHub at{" "}
+              <a href="https://github.com/TypeCellOS/BlockNote/issues">
+                https://github.com/TypeCellOS/BlockNote/issues
+              </a>
+            </div>
+          }
+          beforeCapture={(scope) => {
+            scope.setTag("type", "react-render");
+          }}
+        >
+          <RootProvider>{children}</RootProvider>
+        </Sentry.ErrorBoundary>
         <Analytics />
       </body>
     </html>
diff --git a/docs/app/legal/blocknote-xl-commercial-license/layout.tsx b/docs/app/legal/blocknote-xl-commercial-license/layout.tsx
index 8bd5d635ce..47e444c345 100644
--- a/docs/app/legal/blocknote-xl-commercial-license/layout.tsx
+++ b/docs/app/legal/blocknote-xl-commercial-license/layout.tsx
@@ -2,11 +2,30 @@ import { HomeLayout } from "fumadocs-ui/layouts/home";
 import type { ReactNode } from "react";
 import { baseOptions } from "@/app/layout.config";
 import { Footer } from "@/components/Footer";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
   return (
     <>
-      <HomeLayout {...baseOptions}>{children}</HomeLayout>
+      <HomeLayout {...baseOptions}>
+        <Sentry.ErrorBoundary
+          fallback={
+            <div>
+              We encountered an error trying to show this page. Please report
+              this to us on GitHub at{" "}
+              <a href="https://github.com/TypeCellOS/BlockNote/issues">
+                https://github.com/TypeCellOS/BlockNote/issues
+              </a>
+            </div>
+          }
+          beforeCapture={(scope) => {
+            scope.setTag("type", "react-render");
+            scope.setTag("page", "legal/blocknote-xl-commercial-license");
+          }}
+        >
+          {children}
+        </Sentry.ErrorBoundary>
+      </HomeLayout>
       <Footer />
     </>
   );
diff --git a/docs/app/legal/privacy-policy/layout.tsx b/docs/app/legal/privacy-policy/layout.tsx
index 8bd5d635ce..0fe43fedb2 100644
--- a/docs/app/legal/privacy-policy/layout.tsx
+++ b/docs/app/legal/privacy-policy/layout.tsx
@@ -2,11 +2,30 @@ import { HomeLayout } from "fumadocs-ui/layouts/home";
 import type { ReactNode } from "react";
 import { baseOptions } from "@/app/layout.config";
 import { Footer } from "@/components/Footer";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
   return (
     <>
-      <HomeLayout {...baseOptions}>{children}</HomeLayout>
+      <HomeLayout {...baseOptions}>
+        <Sentry.ErrorBoundary
+          fallback={
+            <div>
+              We encountered an error trying to show this page. Please report
+              this to us on GitHub at{" "}
+              <a href="https://github.com/TypeCellOS/BlockNote/issues">
+                https://github.com/TypeCellOS/BlockNote/issues
+              </a>
+            </div>
+          }
+          beforeCapture={(scope) => {
+            scope.setTag("type", "react-render");
+            scope.setTag("page", "legal/privacy-policy");
+          }}
+        >
+          {children}
+        </Sentry.ErrorBoundary>
+      </HomeLayout>
       <Footer />
     </>
   );
diff --git a/docs/app/legal/service-level-agreement/layout.tsx b/docs/app/legal/service-level-agreement/layout.tsx
index 8bd5d635ce..be593c8786 100644
--- a/docs/app/legal/service-level-agreement/layout.tsx
+++ b/docs/app/legal/service-level-agreement/layout.tsx
@@ -2,11 +2,30 @@ import { HomeLayout } from "fumadocs-ui/layouts/home";
 import type { ReactNode } from "react";
 import { baseOptions } from "@/app/layout.config";
 import { Footer } from "@/components/Footer";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
   return (
     <>
-      <HomeLayout {...baseOptions}>{children}</HomeLayout>
+      <HomeLayout {...baseOptions}>
+        <Sentry.ErrorBoundary
+          fallback={
+            <div>
+              We encountered an error trying to show this page. Please report
+              this to us on GitHub at{" "}
+              <a href="https://github.com/TypeCellOS/BlockNote/issues">
+                https://github.com/TypeCellOS/BlockNote/issues
+              </a>
+            </div>
+          }
+          beforeCapture={(scope) => {
+            scope.setTag("type", "react-render");
+            scope.setTag("page", "legal/service-level-agreement");
+          }}
+        >
+          {children}
+        </Sentry.ErrorBoundary>
+      </HomeLayout>
       <Footer />
     </>
   );
diff --git a/docs/app/legal/terms-and-conditions/layout.tsx b/docs/app/legal/terms-and-conditions/layout.tsx
index 8bd5d635ce..af65f072e2 100644
--- a/docs/app/legal/terms-and-conditions/layout.tsx
+++ b/docs/app/legal/terms-and-conditions/layout.tsx
@@ -2,11 +2,30 @@ import { HomeLayout } from "fumadocs-ui/layouts/home";
 import type { ReactNode } from "react";
 import { baseOptions } from "@/app/layout.config";
 import { Footer } from "@/components/Footer";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
   return (
     <>
-      <HomeLayout {...baseOptions}>{children}</HomeLayout>
+      <HomeLayout {...baseOptions}>
+        <Sentry.ErrorBoundary
+          fallback={
+            <div>
+              We encountered an error trying to show this page. Please report
+              this to us on GitHub at{" "}
+              <a href="https://github.com/TypeCellOS/BlockNote/issues">
+                https://github.com/TypeCellOS/BlockNote/issues
+              </a>
+            </div>
+          }
+          beforeCapture={(scope) => {
+            scope.setTag("type", "react-render");
+            scope.setTag("page", "legal/terms-and-conditions");
+          }}
+        >
+          {children}
+        </Sentry.ErrorBoundary>
+      </HomeLayout>
       <Footer />
     </>
   );
diff --git a/docs/app/pricing/layout.tsx b/docs/app/pricing/layout.tsx
index 8bd5d635ce..df2dbbd578 100644
--- a/docs/app/pricing/layout.tsx
+++ b/docs/app/pricing/layout.tsx
@@ -2,11 +2,30 @@ import { HomeLayout } from "fumadocs-ui/layouts/home";
 import type { ReactNode } from "react";
 import { baseOptions } from "@/app/layout.config";
 import { Footer } from "@/components/Footer";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
   return (
     <>
-      <HomeLayout {...baseOptions}>{children}</HomeLayout>
+      <HomeLayout {...baseOptions}>
+        <Sentry.ErrorBoundary
+          fallback={
+            <div>
+              We encountered an error trying to show this page. Please report
+              this to us on GitHub at{" "}
+              <a href="https://github.com/TypeCellOS/BlockNote/issues">
+                https://github.com/TypeCellOS/BlockNote/issues
+              </a>
+            </div>
+          }
+          beforeCapture={(scope) => {
+            scope.setTag("type", "react-render");
+            scope.setTag("page", "pricing");
+          }}
+        >
+          {children}
+        </Sentry.ErrorBoundary>
+      </HomeLayout>
       <Footer />
     </>
   );
diff --git a/docs/app/signin/layout.tsx b/docs/app/signin/layout.tsx
index e0f4458b9e..14d3328d05 100644
--- a/docs/app/signin/layout.tsx
+++ b/docs/app/signin/layout.tsx
@@ -1,7 +1,28 @@
 import { HomeLayout } from "fumadocs-ui/layouts/home";
 import type { ReactNode } from "react";
 import { baseOptions } from "@/app/layout.config";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
-  return <HomeLayout {...baseOptions}>{children}</HomeLayout>;
+  return (
+    <HomeLayout {...baseOptions}>
+      <Sentry.ErrorBoundary
+        fallback={
+          <div>
+            We encountered an error trying to show this page. Please report this
+            to us on GitHub at{" "}
+            <a href="https://github.com/TypeCellOS/BlockNote/issues">
+              https://github.com/TypeCellOS/BlockNote/issues
+            </a>
+          </div>
+        }
+        beforeCapture={(scope) => {
+          scope.setTag("type", "react-render");
+          scope.setTag("page", "signin");
+        }}
+      >
+        {children}
+      </Sentry.ErrorBoundary>
+    </HomeLayout>
+  );
 }
diff --git a/docs/app/signup/layout.tsx b/docs/app/signup/layout.tsx
index e0f4458b9e..59a093bac8 100644
--- a/docs/app/signup/layout.tsx
+++ b/docs/app/signup/layout.tsx
@@ -1,7 +1,28 @@
 import { HomeLayout } from "fumadocs-ui/layouts/home";
 import type { ReactNode } from "react";
 import { baseOptions } from "@/app/layout.config";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
-  return <HomeLayout {...baseOptions}>{children}</HomeLayout>;
+  return (
+    <HomeLayout {...baseOptions}>
+      <Sentry.ErrorBoundary
+        fallback={
+          <div>
+            We encountered an error trying to show this page. Please report this
+            to us on GitHub at{" "}
+            <a href="https://github.com/TypeCellOS/BlockNote/issues">
+              https://github.com/TypeCellOS/BlockNote/issues
+            </a>
+          </div>
+        }
+        beforeCapture={(scope) => {
+          scope.setTag("type", "react-render");
+          scope.setTag("page", "signup");
+        }}
+      >
+        {children}
+      </Sentry.ErrorBoundary>
+    </HomeLayout>
+  );
 }
diff --git a/docs/app/thanks/layout.tsx b/docs/app/thanks/layout.tsx
index 8bd5d635ce..1e0a412a14 100644
--- a/docs/app/thanks/layout.tsx
+++ b/docs/app/thanks/layout.tsx
@@ -2,11 +2,30 @@ import { HomeLayout } from "fumadocs-ui/layouts/home";
 import type { ReactNode } from "react";
 import { baseOptions } from "@/app/layout.config";
 import { Footer } from "@/components/Footer";
+import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
   return (
     <>
-      <HomeLayout {...baseOptions}>{children}</HomeLayout>
+      <HomeLayout {...baseOptions}>
+        <Sentry.ErrorBoundary
+          fallback={
+            <div>
+              We encountered an error trying to show this page. Please report
+              this to us on GitHub at{" "}
+              <a href="https://github.com/TypeCellOS/BlockNote/issues">
+                https://github.com/TypeCellOS/BlockNote/issues
+              </a>
+            </div>
+          }
+          beforeCapture={(scope) => {
+            scope.setTag("type", "react-render");
+            scope.setTag("page", "thanks");
+          }}
+        >
+          {children}
+        </Sentry.ErrorBoundary>
+      </HomeLayout>
       <Footer />
     </>
   );
diff --git a/docs/components/Example.tsx b/docs/components/Example.tsx
index 0e706ea82f..3d37ca69b9 100644
--- a/docs/components/Example.tsx
+++ b/docs/components/Example.tsx
@@ -12,6 +12,7 @@ import CTAButton from "@/components/CTAButton";
 import { SectionHeader } from "@/components/Headings";
 import { ExampleData } from "@/components/example/generated/exampleGroupsData.gen";
 import { authClient } from "@/util/auth-client";
+import * as Sentry from "@sentry/nextjs";
 
 function ExampleDemoBarSourceCodeLink(props: {
   name: string;
@@ -147,13 +148,25 @@ export default function Example(props: { exampleData: ExampleData }) {
   const userIsPro = session.data && session.data.planType !== "free";
 
   return (
-    <div className="demo">
-      <ExampleDemo exampleData={props.exampleData} />
-      {props.exampleData.isPro && !userIsPro ? (
-        <ExampleProPrompt />
-      ) : (
-        <ExampleCode exampleData={props.exampleData} />
-      )}
-    </div>
+    <Sentry.ErrorBoundary
+      fallback={
+        <div>
+          We encountered an error trying to show this example. Please report
+          this to us on GitHub at{" "}
+          <a href="https://github.com/TypeCellOS/BlockNote/issues">
+            https://github.com/TypeCellOS/BlockNote/issues
+          </a>
+        </div>
+      }
+    >
+      <div className="demo">
+        <ExampleDemo exampleData={props.exampleData} />
+        {props.exampleData.isPro && !userIsPro ? (
+          <ExampleProPrompt />
+        ) : (
+          <ExampleCode exampleData={props.exampleData} />
+        )}
+      </div>
+    </Sentry.ErrorBoundary>
   );
 }

From 5a8dee88e0a9857dcd348594c5e322203931a5b1 Mon Sep 17 00:00:00 2001
From: Nick the Sick <nick@blocknotejs.org>
Date: Mon, 22 Sep 2025 15:28:36 +0200
Subject: [PATCH 3/9] fix: statically import example code with a client
 component

---
 packages/dev-scripts/examples/genDocs.ts | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/packages/dev-scripts/examples/genDocs.ts b/packages/dev-scripts/examples/genDocs.ts
index d673f524b8..4749e80ad6 100644
--- a/packages/dev-scripts/examples/genDocs.ts
+++ b/packages/dev-scripts/examples/genDocs.ts
@@ -36,10 +36,7 @@ async function generateCodeForExample(project: Project) {
   fs.writeFileSync(
     indexFile,
     `"use client";
-import dynamic from "next/dynamic";
-const Component = dynamic(() => import("./App"), {
-  ssr: false,
-});
+import Component from "./App";
 
 export default Component;`,
   );

From e703f04a420261956ec275b5a0414122d5a06db1 Mon Sep 17 00:00:00 2001
From: Nick the Sick <nick@blocknotejs.org>
Date: Mon, 22 Sep 2025 15:52:59 +0200
Subject: [PATCH 4/9] fix: make bg color white in light mode

---
 docs/components/AuthenticationPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/components/AuthenticationPage.tsx b/docs/components/AuthenticationPage.tsx
index c2bfad8252..0dce386c5e 100644
--- a/docs/components/AuthenticationPage.tsx
+++ b/docs/components/AuthenticationPage.tsx
@@ -37,7 +37,7 @@ function AuthenticationInput(props: {
           type={props.type}
           required
           autoComplete={props.type}
-          className="text-fd-accent-foreground outline-fd-border focus:outline-fd-primary block w-full rounded-md px-3 py-1.5 text-base outline-1 -outline-offset-1 focus:outline-2 focus:-outline-offset-2 sm:text-sm/6"
+          className="text-fd-accent-foreground outline-fd-border focus:outline-fd-primary focus:outline-3 block w-full rounded-md bg-white px-3 py-1.5 text-base outline-2 -outline-offset-1 focus:-outline-offset-2 sm:text-sm/6 dark:bg-black"
           onChange={props.onChange}
         />
       </div>

From c27e749586ffb12d36f48dfa3e368de199c58cd7 Mon Sep 17 00:00:00 2001
From: Nick the Sick <nick@blocknotejs.org>
Date: Mon, 22 Sep 2025 16:14:20 +0200
Subject: [PATCH 5/9] fix: add tags for example errors

---
 docs/components/Example.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/docs/components/Example.tsx b/docs/components/Example.tsx
index 3d37ca69b9..78f9a056a5 100644
--- a/docs/components/Example.tsx
+++ b/docs/components/Example.tsx
@@ -158,6 +158,10 @@ export default function Example(props: { exampleData: ExampleData }) {
           </a>
         </div>
       }
+      beforeCapture={(scope) => {
+        scope.setTag("type", "react-render");
+        scope.setTag("page", "example");
+      }}
     >
       <div className="demo">
         <ExampleDemo exampleData={props.exampleData} />

From 9ea4a8a75870a8fd9d265177d0b6101b9d950961 Mon Sep 17 00:00:00 2001
From: Nick the Sick <nick@blocknotejs.org>
Date: Mon, 22 Sep 2025 16:21:13 +0200
Subject: [PATCH 6/9] chore: add context

---
 docs/components/Example.tsx | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/docs/components/Example.tsx b/docs/components/Example.tsx
index 78f9a056a5..3d37ca69b9 100644
--- a/docs/components/Example.tsx
+++ b/docs/components/Example.tsx
@@ -158,10 +158,6 @@ export default function Example(props: { exampleData: ExampleData }) {
           </a>
         </div>
       }
-      beforeCapture={(scope) => {
-        scope.setTag("type", "react-render");
-        scope.setTag("page", "example");
-      }}
     >
       <div className="demo">
         <ExampleDemo exampleData={props.exampleData} />

From f739c6c6089d4b7627ecefc806e799269c4a71db Mon Sep 17 00:00:00 2001
From: Yousef <yousefdardiry@gmail.com>
Date: Mon, 22 Sep 2025 16:21:59 +0200
Subject: [PATCH 7/9] docs: revert some copy of site, remove discord link from
 header (#2025)

Co-authored-by: Nick Perez <nick@blocknotejs.org>
---
 docs/app/docs/layout.tsx     |  4 +---
 docs/app/examples/layout.tsx |  4 +---
 docs/app/layout.config.tsx   | 16 ++++++++--------
 docs/app/layout.tsx          |  3 ++-
 docs/app/pricing/page.tsx    | 26 +++++++++++---------------
 5 files changed, 23 insertions(+), 30 deletions(-)

diff --git a/docs/app/docs/layout.tsx b/docs/app/docs/layout.tsx
index f88616023d..766d82c991 100644
--- a/docs/app/docs/layout.tsx
+++ b/docs/app/docs/layout.tsx
@@ -1,9 +1,8 @@
-import type { ReactNode } from "react";
-import { Analytics } from "@vercel/analytics/react";
 import { baseOptions } from "@/app/layout.config";
 import { CustomDocsLayout } from "@/components/CustomDocsLayout";
 import { Footer } from "@/components/Footer";
 import { source } from "@/lib/source/docs";
+import type { ReactNode } from "react";
 import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
@@ -29,7 +28,6 @@ export default function Layout({ children }: { children: ReactNode }) {
         </Sentry.ErrorBoundary>
       </CustomDocsLayout>
       <Footer />
-      <Analytics />
     </>
   );
 }
diff --git a/docs/app/examples/layout.tsx b/docs/app/examples/layout.tsx
index 553373605a..6137fa52a9 100644
--- a/docs/app/examples/layout.tsx
+++ b/docs/app/examples/layout.tsx
@@ -1,11 +1,10 @@
-import type { ReactNode } from "react";
-import { Analytics } from "@vercel/analytics/react";
 import { baseOptions } from "@/app/layout.config";
 import { CustomDocsLayout } from "@/components/CustomDocsLayout";
 import { Footer } from "@/components/Footer";
 import { ProBadge } from "@/components/ProBadge";
 import { source } from "@/lib/source/examples";
 import { getExampleData } from "@/util/getExampleData";
+import type { ReactNode } from "react";
 import * as Sentry from "@sentry/nextjs";
 
 export default function Layout({ children }: { children: ReactNode }) {
@@ -54,7 +53,6 @@ export default function Layout({ children }: { children: ReactNode }) {
         </Sentry.ErrorBoundary>
       </CustomDocsLayout>
       <Footer />
-      <Analytics />
     </>
   );
 }
diff --git a/docs/app/layout.config.tsx b/docs/app/layout.config.tsx
index 1c97ebc47f..c98de3bad9 100644
--- a/docs/app/layout.config.tsx
+++ b/docs/app/layout.config.tsx
@@ -1,13 +1,13 @@
 import { AuthNavButton } from "@/components/AuthNavButton";
 import ThemedImage from "@/components/ThemedImage";
-import LogoLight from "@/public/img/logos/banner.svg";
 import LogoDark from "@/public/img/logos/banner.dark.svg";
+import LogoLight from "@/public/img/logos/banner.svg";
 import {
   NavbarSidebarTrigger,
   type DocsLayoutProps,
 } from "fumadocs-ui/layouts/docs";
-import { FaBook, FaCode, FaDiscord, FaGithub } from "react-icons/fa";
 import { HomeLayoutProps } from "fumadocs-ui/layouts/home";
+import { FaBook, FaCode, FaGithub } from "react-icons/fa";
 
 /**
  * Shared layout configurations
@@ -67,12 +67,12 @@ export const baseOptions: Partial<DocsLayoutProps & HomeLayoutProps> = {
       url: "/about",
       active: "url",
     },
-    {
-      type: "icon",
-      icon: <FaDiscord />,
-      text: "Discord",
-      url: "https://discord.gg/Qc2QTTH5dF",
-    },
+    // {
+    //   type: "icon",
+    //   icon: <FaDiscord />,
+    //   text: "Discord",
+    //   url: "https://discord.gg/Qc2QTTH5dF",
+    // },
     {
       type: "icon",
       icon: <FaGithub />,
diff --git a/docs/app/layout.tsx b/docs/app/layout.tsx
index 0bc04f7514..87f2211496 100644
--- a/docs/app/layout.tsx
+++ b/docs/app/layout.tsx
@@ -1,6 +1,6 @@
+import { Analytics } from "@vercel/analytics/react";
 import { Banner } from "fumadocs-ui/components/banner";
 import { RootProvider } from "fumadocs-ui/provider";
-import { Analytics } from "@vercel/analytics/react";
 import { Metadata } from "next";
 import type { ReactNode } from "react";
 import * as Sentry from "@sentry/nextjs";
@@ -47,6 +47,7 @@ export default function Layout({ children }: { children: ReactNode }) {
           <RootProvider>{children}</RootProvider>
         </Sentry.ErrorBoundary>
         <Analytics />
+        TRACK 1
       </body>
     </html>
   );
diff --git a/docs/app/pricing/page.tsx b/docs/app/pricing/page.tsx
index e458d51fcb..e47753bbe2 100644
--- a/docs/app/pricing/page.tsx
+++ b/docs/app/pricing/page.tsx
@@ -32,7 +32,7 @@ const tiers: Tier[] = [
       "Access to all Pro Examples",
       "Prioritized Bug Reports on GitHub",
       "Support maintenance and new versions of our open source library",
-      "XL packages only available for open source projects under GPL-3.0",
+      "XL packages only available for open source projects under GPL-3.0 or early stage startups",
     ],
   },
   {
@@ -40,51 +40,47 @@ const tiers: Tier[] = [
     title: "Business",
     mostPopular: true,
     description:
-      "Best for companies who need a commercial license for XL features.",
+      // "Best for companies who need a commercial license for XL features.",
+
+      "Best for companies that want a direct line to the team and a commercial license.",
     price: { month: 390, year: 48 },
     features: [
-      <span>
-        <a href="/legal/blocknote-xl-commercial-license">Commercial license</a>{" "}
-        for XL packages:
-      </span>,
+      <span>Commercial license for XL packages:</span>,
       "- AI integration",
       "- Multi-column layouts",
       "- Export to PDF, Docx, ODT, Email",
       "Access to all Pro Examples",
       "Prioritized Bug Reports on GitHub",
+      "Support maintenance and new versions of our open source library",
+      "Logo on our website and repositories",
       <span>
         Standard Support included (
         <a href="/legal/service-level-agreement">see SLA</a>)
       </span>,
-      "Support maintenance and new versions of our open source library",
-      "Logo on our website and repositories",
     ],
   },
   {
     id: "enterprise",
     title: "Enterprise",
     description:
-      "Best for companies that want a direct line to the team for dedicated consulting and support.",
+      "Collaborate directly with the BlockNote team for dedicated consulting and support.",
     price: "Tailored pricing",
     features: [
       "Development of BlockNote features required for your organization",
       "Access to a private Slack channel with the maintainers",
       "Guidance on integrating BlockNote into your project",
-      <span>
-        <a href="/legal/blocknote-xl-commercial-license">Commercial license</a>{" "}
-        for XL packages:
-      </span>,
+      <span>Commercial license for XL packages:</span>,
       "- AI integration",
       "- Multi-column layouts",
       "- Export to PDF, Docx, ODT, Email",
       "Access to all Pro Examples",
       "Prioritized Bug Reports and Feature Requests on GitHub",
+      "Support maintenance and new versions of our open source library",
+      "Logo on our website and repositories",
       <span>
         Priority Support included (
         <a href="/legal/service-level-agreement">see SLA</a>)
       </span>,
-      "Support maintenance and new versions of our open source library",
-      "Logo on our website and repositories",
     ],
     href: "/about/",
   },

From 58de96fec3f77688d731ad5afb482f6d17256505 Mon Sep 17 00:00:00 2001
From: Matthew Lipski <50169049+matthewlipski@users.noreply.github.com>
Date: Mon, 22 Sep 2025 16:22:36 +0200
Subject: [PATCH 8/9] style: updated examples grid and CTA button (#1986)

---
 docs/app/examples/layout.tsx     |  2 +-
 docs/components/CTAButton.tsx    |  5 +++--
 docs/components/Example.tsx      |  2 +-
 docs/components/ExampleCards.tsx | 11 +++++++++--
 docs/components/ProBadge.tsx     |  2 +-
 5 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/docs/app/examples/layout.tsx b/docs/app/examples/layout.tsx
index 6137fa52a9..2fc00f9155 100644
--- a/docs/app/examples/layout.tsx
+++ b/docs/app/examples/layout.tsx
@@ -22,7 +22,7 @@ export default function Layout({ children }: { children: ReactNode }) {
 
           page.name = (
             <span>
-              {exampleData.title}
+              <span className="mr-1">{exampleData.title}</span>
               {exampleData.isPro && <ProBadge />}
             </span>
           );
diff --git a/docs/components/CTAButton.tsx b/docs/components/CTAButton.tsx
index 47f951e033..e0078770e1 100644
--- a/docs/components/CTAButton.tsx
+++ b/docs/components/CTAButton.tsx
@@ -4,13 +4,14 @@ import { ReactNode } from "react";
 export default function CTAButton(props: {
   href: string;
   hoverGlow?: boolean;
-  size?: "small" | "large";
+  size?: "default" | "small";
+  variant?: "default" | "colored";
   children: ReactNode;
 }) {
   return (
     <div className="not-prose button-glow-parent relative flex h-fit w-fit flex-wrap text-nowrap">
       <Link
-        className={`bg-fd-accent border-fd-border text-fd-foreground z-20 m-0 rounded-full border font-medium ${props.size === "small" ? "px-3 py-1.5 text-xs md:text-sm" : "px-4 py-2 text-base md:text-lg"}`}
+        className={`z-20 m-0 rounded-full font-medium ${props.variant === "colored" ? "text-fd-background dark:text-fd-foreground bg-indigo-600 hover:bg-indigo-500" : "bg-fd-accent border-fd-border text-fd-foreground border"} ${props.size === "small" ? "px-3 py-1.5 text-xs md:text-sm" : "px-4 py-2 text-base md:text-lg"}`}
         href={props.href}
         suppressHydrationWarning
       >
diff --git a/docs/components/Example.tsx b/docs/components/Example.tsx
index 3d37ca69b9..a074edc0a9 100644
--- a/docs/components/Example.tsx
+++ b/docs/components/Example.tsx
@@ -119,7 +119,7 @@ function ExampleProPrompt() {
           BlockNote Pro
         </p>
         <div className={"mt-8"}>
-          <CTAButton href={"/pricing"} size={"large"} hoverGlow={true}>
+          <CTAButton href={"/pricing"} variant={"colored"} hoverGlow={true}>
             Get BlockNote Pro
           </CTAButton>
         </div>
diff --git a/docs/components/ExampleCards.tsx b/docs/components/ExampleCards.tsx
index 2967ba1ef5..1a8187ccaa 100644
--- a/docs/components/ExampleCards.tsx
+++ b/docs/components/ExampleCards.tsx
@@ -3,6 +3,7 @@ import { Heading } from "fumadocs-ui/components/heading";
 
 import { exampleGroupsData } from "./example/generated/exampleGroupsData.gen";
 import { Fragment } from "react";
+import { ProBadge } from "./ProBadge";
 
 export default function ExampleCards() {
   return (
@@ -14,10 +15,11 @@ export default function ExampleCards() {
           </Heading>
           <Cards
             key={exampleGroupData.exampleGroupName + "-cards"}
-            className="mb-8"
+            className="mb-8 grid-cols-1 sm:grid-cols-2 lg:grid-cols-3"
           >
             {exampleGroupData.examplesData.map((exampleData) => (
               <Card
+                className="@max-lg:col-span-1"
                 key={
                   exampleGroupData.exampleGroupName +
                   "-" +
@@ -32,7 +34,12 @@ export default function ExampleCards() {
                     />
                   ) : undefined
                 }
-                title={exampleData.title}
+                title={
+                  <span>
+                    <span className="mr-1">{exampleData.title}</span>
+                    {exampleData.isPro && <ProBadge />}
+                  </span>
+                }
                 description={
                   exampleData.author ? `by ${exampleData.author}` : undefined
                 }
diff --git a/docs/components/ProBadge.tsx b/docs/components/ProBadge.tsx
index 6524d336c0..72cfc78dcc 100644
--- a/docs/components/ProBadge.tsx
+++ b/docs/components/ProBadge.tsx
@@ -1,6 +1,6 @@
 export function ProBadge() {
   return (
-    <span className="mx-1 inline-flex items-center text-nowrap rounded-full px-1.5 text-xs font-medium text-indigo-600 ring-1 ring-inset ring-indigo-600">
+    <span className="inline-flex h-4 items-center text-nowrap rounded-full px-1.5 text-xs font-medium text-indigo-600 ring-1 ring-inset ring-indigo-600">
       Pro
     </span>
   );

From 03259b5a26430b4a58eb0b2de14273386e1ee28c Mon Sep 17 00:00:00 2001
From: Nick the Sick <nick@blocknotejs.org>
Date: Mon, 22 Sep 2025 16:23:46 +0200
Subject: [PATCH 9/9] refactor: typo

---
 docs/app/layout.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/docs/app/layout.tsx b/docs/app/layout.tsx
index 87f2211496..39aa02c6f5 100644
--- a/docs/app/layout.tsx
+++ b/docs/app/layout.tsx
@@ -47,7 +47,6 @@ export default function Layout({ children }: { children: ReactNode }) {
           <RootProvider>{children}</RootProvider>
         </Sentry.ErrorBoundary>
         <Analytics />
-        TRACK 1
       </body>
     </html>
   );