Python Starlette: new option middleware_spans

.github/ISSUE_TEMPLATE/issue-platform-404.yml

@@ -0,0 +1,28 @@
+name: "💻 Docs Platform: 🔗 404 Error"
+labels: "Type: Platform,404"
+description: Broken links, missing pages, and other 404 errors.
+
+body:
+  - type: textarea
+    id: url
+    attributes:
+      label: URL
+      description: The broken link or missing page.
+      placeholder: |-
+        https://docs.sentry.io/your-broken-link
+    validations:
+      required: true
+  - type: textarea
+    id: notes
+    attributes:
+      label: Additional Info
+      description: Where did you find the link? Anything else we should know?
+    validations:
+      required: false
+  - type: markdown
+    attributes:
+      value: |-
+        ## Thanks 🙏
+        Check our [triage docs](https://open.sentry.io/triage/) for what to expect next.
+    validations:
+      required: false

app/[[...path]]/layout.tsx

@@ -2,12 +2,17 @@ import 'prism-sentry/index.css';
 
 import type {Metadata} from 'next';
 
-import 'sentry-docs/styles/screen.scss';
+import {HotReload} from 'sentry-docs/components/hotReload';
 
 export const metadata: Metadata = {
   title: {template: '%s | Sentry Documentation', default: 'Home'},
 };
 
 export default function DocsLayout({children}: {children: React.ReactNode}) {
-  return <div>{children}</div>;
+  return (
+    <div>
+      {children}
+      <HotReload />
+    </div>
+  );
 }

app/[[...path]]/page.tsx

@@ -53,6 +53,7 @@ export default async function Page({params}) {
   const docs = await getDocsFrontMatter();
   const rootNode = await getDocsRootNode();
   if (!rootNode) {
+    // eslint-disable-next-line no-console
     console.warn('no root node');
     return notFound();
   }
@@ -78,6 +79,7 @@ export default async function Page({params}) {
 
   const pageNode = nodeForPath(rootNode, params.path);
   if (!pageNode) {
+    // eslint-disable-next-line no-console
     console.warn('no page node', params.path);
     return notFound();
   }
@@ -88,6 +90,7 @@ export default async function Page({params}) {
     doc = await getFileBySlug(`docs/${pageNode.path}`);
   } catch (e) {
     if (e.code === 'ENOENT') {
+      // eslint-disable-next-line no-console
       console.error('ENOENT', pageNode.path);
       return notFound();
     }
@@ -121,7 +124,7 @@ export async function generateMetadata({params}: MetadataProps): Promise<Metadat
 
   const rootNode = await getDocsRootNode();
 
-  if (rootNode && params.path) {
+  if (params.path) {
     const pageNode = nodeForPath(rootNode, params.path);
     if (pageNode) {
       const guideOrPlatform = getCurrentPlatformOrGuide(rootNode, params.path);

app/api/auth/[...nextauth]/route.ts

@@ -1,11 +1,12 @@
 import {PrismaAdapter} from '@auth/prisma-adapter';
 import NextAuth from 'next-auth';
+import {Adapter} from 'next-auth/adapters';
 import GoogleProvider from 'next-auth/providers/google';
 
 import prisma from 'sentry-docs/prisma';
 
 const handler = NextAuth({
-  adapter: PrismaAdapter(prisma),
+  adapter: PrismaAdapter(prisma) as Adapter,
   providers: [
     GoogleProvider({
       clientId: process.env.GOOGLE_CLIENT_ID || '',

app/changelog/globals.css

@@ -1,164 +1 @@
-@import '@radix-ui/themes/styles.css';
 
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-#changelogcontent {
-  font-family: var(--font-rubik);
-}
-.radix-themes {
-  --cursor-button: pointer;
-}
-.fancy-border {
-  transition-property: box-shadow, border-color;
-  transition-duration: 0.25s;
-  transition-timing-function: ease-out;
-
-  &:hover {
-    box-shadow:
-      0 2px 0 rgba(54, 45, 89, 0.15),
-      -0.1875rem -0.1875rem 0 0.1875rem #f2b712,
-      0 0 0 0.375rem #e1567c;
-    text-decoration: none;
-    cursor: pointer;
-  }
-}
-
-.hero-top-left-down-slope {
-  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 40%);
-}
-
-.hero-bottom-left-down-slope {
-  clip-path: polygon(0 0, 100% 100%, 100% 100%, 0 100%);
-}
-
-.footer-top-right-down-slope {
-  clip-path: polygon(0 0, 100% 0, 100% 40%, 0 100%);
-}
-
-.icon {
-  margin-left: 0.25em;
-
-  svg {
-    display: inline;
-    width: 14px;
-    height: 14px;
-  }
-}
-
-.btn {
-  align-items: center;
-  border: 0.125rem solid transparent;
-  border-radius: 0.5rem;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: inline-flex;
-  gap: 0.25rem;
-  height: 2.5rem;
-  justify-content: center;
-  line-height: 1rem;
-  outline: 0;
-  padding: 0.75rem 1rem;
-  position: relative;
-  text-align: center;
-  text-rendering: optimizeLegibility;
-  text-transform: uppercase;
-  user-select: none;
-  vertical-align: middle;
-  white-space: nowrap;
-  text-decoration: none;
-
-  @apply text-primary;
-}
-
-.solid-btn {
-  background: linear-gradient(
-    120deg,
-    #c83852,
-    #b44092 25%,
-    #6a5fc1 50%,
-    #452650 55%,
-    #452650
-  );
-  background-position: 98% 0;
-  background-size: 250% 100%;
-  border-color: transparent;
-  border-radius: 0.5rem;
-  box-shadow: none;
-  outline: 0 solid #6a5fc1;
-  outline-offset: 0.125rem;
-  transition:
-    background-position 0.2s,
-    outline-width 0.2s;
-}
-
-.solid-btn:hover {
-  background-position: 2% 0;
-}
-
-.solid-btn:focus {
-  background: #6a5fc1;
-  outline-width: 0.125rem;
-}
-
-.outline-btn {
-  background: linear-gradient(
-    120deg,
-    #fa7faa,
-    #ff9691 25%,
-    #ffb287 50%,
-    transparent 55%,
-    transparent
-  );
-  background-clip: padding-box;
-  background-position: 98% 0;
-  background-size: 250% 100%;
-  border: none;
-  box-shadow: none;
-  box-sizing: border-box;
-  -webkit-box-sizing: border-box;
-  outline: 0 solid #fa7faa;
-  outline-offset: 0.125rem;
-  position: relative;
-  transition:
-    background-position 0.2s,
-    outline-width 0.2s;
-  z-index: 0;
-}
-
-.outline-btn:before {
-  background: linear-gradient(11deg, #c83852, #b44092 50%, #6a5fc1);
-  border-radius: 0.5rem;
-  content: '';
-  inset: 0;
-  -webkit-mask:
-    linear-gradient(#fff 0 0) content-box,
-    linear-gradient(#fff 0 0);
-  mask:
-    linear-gradient(#fff 0 0) content-box,
-    linear-gradient(#fff 0 0);
-  -webkit-mask-composite: xor;
-  mask-composite: exclude;
-  padding: 0.125rem;
-  position: absolute;
-  transition: opacity 0.2s;
-  z-index: -1;
-}
-
-.outline-btn:hover {
-  background-position: 2% 0;
-}
-
-.outline-btn:hover:before {
-  opacity: 0;
-}
-
-.outline-btn:focus {
-  background: #ffa269;
-  outline-width: 0.125rem;
-}
-
-.try-sentry-footer-wrapper {
-  background: url('/changelog/assets/squiggle.png') 0px 0px / 300px 300px, linear-gradient(315deg, rgb(24, 13, 28) 0.57%, rgb(69, 38, 80) 100%) 0% 0% / cover;;
-}

app/changelog/header.tsx

@@ -2,6 +2,8 @@ export default function Header({loading}) {
   return (
     <div className="w-full mx-auto h-96 relative bg-darkPurple">
       <div className="relative w-full lg:max-w-7xl mx-auto px-4 lg:px-8 pt-8 grid grid-cols-12 items-center">
+        {/* this needs to be a plain <img> next/image doesn't work here because of redirects we do */}
+        {/* eslint-disable-next-line @next/next/no-img-element */}
         <img
           className={`justify-self-center col-span-10 hidden lg:block ${loading ? 'animate-fade-in-left' : ''}`}
           src="https://docs.sentry.io/changelog/assets/hero.png"

app/changelog/layout.tsx

@@ -1,21 +1,11 @@
-import './globals.css';
 import 'prism-sentry/index.css';
 
-import {ReactNode} from 'react';
-import {Theme} from '@radix-ui/themes';
+import {Fragment, ReactNode} from 'react';
 import type {Metadata} from 'next';
-import {Rubik} from 'next/font/google';
 import NextTopLoader from 'nextjs-toploader';
 
 import {Navbar} from 'sentry-docs/components/changelog/navbar';
 
-const rubik = Rubik({
-  weight: ['400', '500', '700'],
-  style: ['normal', 'italic'],
-  subsets: ['latin'],
-  variable: '--font-rubik',
-});
-
 export const metadata: Metadata = {
   title: {template: '%s | Sentry Changelog', default: 'Changelog'},
   metadataBase: new URL('https://sentry.io/changelog/'),
@@ -26,15 +16,15 @@ export const metadata: Metadata = {
 
 export default function ChangelogLayout({children}: {children: ReactNode}) {
   return (
-    <Theme accentColor="violet" grayColor="sand" radius="large" scaling="95%">
+    <Fragment>
       <NextTopLoader color="#8d5494" />
-      <div id="changelogcontent" className={`${rubik.variable}`}>
+      <div id="changelogcontent" className="tw-app">
         <Navbar />
         <div className="bg-gray-100">{children}</div>
         <div className="w-full mx-auto h-16 relative bg-darkPurple">
           <div className="footer-top-right-down-slope absolute w-full -top-1 h-10 bg-gray-200" />
         </div>
       </div>
-    </Theme>
+    </Fragment>
   );
 }

app/global-error.jsx

@@ -6,8 +6,6 @@ import {useEffect} from 'react';
 import * as Sentry from '@sentry/nextjs';
 import Error from 'next/error';
 
-import 'sentry-docs/styles/screen.scss';
-
 export default function GlobalError({error}) {
   useEffect(() => {
     Sentry.captureException(error);