Implement 404 redirect handling with middleware

.gitignore

@@ -18,3 +18,5 @@ docs/.vuepress/dist
 components/**/package-lock.json
 /packages/evals/
 /packages/sdk/examples/.next/
+
+**/.claude/settings.local.json

docs-v2/middleware.ts

@@ -0,0 +1,41 @@
+import { NextResponse } from "next/server"
+import type { NextRequest } from "next/server"
+
+/**
+ * Middleware to handle 404s by redirecting to the home page
+ * Instead of showing a 404 error page, we redirect to the root
+ * Using a 301 (permanent) redirect for better SEO handling
+ */
+export function middleware(request: NextRequest) {
+  // We only want to handle 404s, not other pages
+  // This check isn't foolproof but helps avoid redirecting existing pages
+  const pathname = request.nextUrl.pathname
+
+  // Check if this is a static asset or API route - we don't want to redirect these
+  if (
+    pathname.startsWith("/_next") ||
+    pathname.startsWith("/api/") ||
+    pathname.startsWith("/images/") ||
+    pathname.includes(".") // Likely a file, e.g. favicon.ico
+  ) {
+    return NextResponse.next()
+  }
+
+  // Return a 301 (permanent) redirect to the home page
+  return NextResponse.redirect(new URL("/", request.url), 301)
+}
+
+// Configure which paths this middleware will run on
+// This runs the middleware on paths that don't exist in our app
+export const config = {
+  matcher: [
+    /*
+     * Match all request paths except for:
+     * 1. Existing pages in the pages directory
+     * 2. API routes
+     * 3. Static files (images, etc)
+     * 4. System paths like _next, favicon.ico, etc.
+     */
+    "/((?!_next|api|images|favicon.ico).*)",
+  ],
+}

docs-v2/next.config.mjs

@@ -34,6 +34,11 @@ export default withNextra({
   },
   async redirects() {
     return [
+      {
+        source: "/apps/apps/",
+        destination: "/apps/",
+        permanent: true,
+      },
       {
         source: "/v3/",
         destination: "/",
@@ -69,11 +74,6 @@ export default withNextra({
         destination: "https://pipedream.com/apps/",
         permanent: true,
       },
-      {
-        source: "/apps/:path*/",
-        destination: "https://pipedream.com/apps/:path*/",
-        permanent: true,
-      },
       {
         source: "/support/",
         destination: "https://pipedream.com/support/",
@@ -481,6 +481,11 @@ export default withNextra({
         destination: "/integrations/oauth-clients/",
         permanent: true,
       },
+      {
+        source: "/integrations/",
+        destination: "/apps/",
+        permanent: true,
+      },
       {
         source: "/integrations/:path*/",
         destination: "/apps/:path*/",
@@ -561,6 +566,10 @@ export default withNextra({
         source: "/api-demo-connect/accounts/:id/",
         destination: "/api/demo-connect/accounts/:id",
       },
+      {
+        source: "/workflows/errors/",
+        destination: "/workflows/building-workflows/errors/",
+      },
     ];
   },
   env: {

docs-v2/pages/404.tsx

@@ -0,0 +1,37 @@
+import { useEffect } from "react"
+import { useRouter } from "next/router"
+
+/**
+ * Custom 404 component - this is a fallback in case the middleware redirect doesn't work
+ * The middleware.ts file handles the main redirect logic with a 301 status code
+ * This component will only be shown if the middleware fails to redirect
+ */
+export default function Custom404() {
+  const router = useRouter()
+
+  useEffect(() => {
+    // Fallback redirect if middleware didn't handle it
+    // Using a short timeout to ensure middleware has a chance to run first
+    const redirectTimeout = setTimeout(() => {
+      router.replace("/")
+    }, 100)
+
+    return () => clearTimeout(redirectTimeout)
+  }, [
+    router,
+  ])
+
+  return (
+    <div style={{
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      height: "100vh",
+    }}>
+      <div>
+        <h1>Page not found</h1>
+        <p>Redirecting to home page...</p>
+      </div>
+    </div>
+  )
+}

docs-v2/pages/connect/api.mdx

@@ -67,7 +67,7 @@ const pd = createBackendClient({
 
 You'll primarily use the browser SDK to let your users securely connect apps from your frontend. Here, you
 
-1. [Create a short-lived token on your server](#create-a-new-token)
+1. [Create a short-lived token on your server](#create-token)
 2. Initiate auth with that token to securely connect an account for a specific user
 
 Here's a Next.js example [from our quickstart](/connect/managed-auth/quickstart/):
@@ -240,7 +240,7 @@ Your app will initiate the account connection flow for your end users in your fr
 
 See [the Connect tokens docs](/connect/tokens/) for more information.
 
-#### Create a new token
+#### Create token
 
 ```
 POST /{project_id}/tokens
@@ -999,7 +999,7 @@ curl -X DELETE "https://api.pipedream.com/v1/connect/{project_id}/accounts/{acco
 
 Pipedream returns a `204 No Content` response on successful account deletion
 
-#### Delete an end user
+#### Delete end user
 
 Delete an end user, all their connected accounts, and any deployed triggers.
 
@@ -2688,7 +2688,7 @@ curl -X GET \
 }
 ```
 
-#### Delete a deployed trigger
+#### Delete deployed trigger
 
 Delete deployed trigger for a given user.
 
@@ -2798,7 +2798,7 @@ curl -X DELETE \
 Pipedream returns a `204 No Content` response on successful deletion
 
 
-#### Retrieve the events emitted by a deployed trigger
+#### Retrieve events emitted by deployed trigger
 
 Retrieve a list of the last events that a deployed trigger emitted.
 
@@ -2995,7 +2995,7 @@ curl -X GET \
 }
 ```
 
-#### Retrieve the webhooks listening to a deployed trigger
+#### Retrieve webhooks listening to deployed trigger
 
 Retrieve the list of webhook URLs listening to a deployed trigger.
 
@@ -3116,7 +3116,7 @@ curl -X GET \
 }
 ```
 
-#### Update the webhooks listening to a deployed trigger
+#### Update webhooks listening to deployed trigger
 
 Update the list of webhook URLs that will listen to a deployed trigger.
 
@@ -3255,7 +3255,7 @@ curl -X PUT \
 }
 ```
 
-#### Retrieve the workflows listening to a deployed trigger
+#### Retrieve workflows listening to deployed trigger
 
 Retrieve the list of workflow IDs listening to a deployed trigger.
 
@@ -3377,7 +3377,7 @@ curl -X GET \
 }
 ```
 
-#### Update the workflows listening to a deployed trigger
+#### Update workflows listening to deployed trigger
 
 Update the list of workflows that will listen to a deployed trigger.
 

docs-v2/pages/connect/components.mdx

@@ -833,7 +833,7 @@ Refer to the [full Connect API reference](/connect/api/#deploy-a-trigger) to lis
 - Many event sources attempt to retrieve a small set of historical events on deploy to provide visibility into the event shape for end users and developers
 - Exposing real test events make it easier to consume the event in downstream systems without requiring users to trigger real events ([more info](/components/contributing/guidelines/#surfacing-test-events))
 - However, this results in emitting those events to the listening webhook immediately, which may not always be ideal, depending on your use case
-- If you'd like to avoid emitting historical events, you can deploy a trigger without defining a `webhook_url`, then [update the listening webhooks for the deployed trigger](/connect/api/#update-the-webhooks-listening-to-a-deployed-trigger) after roughly a minute
+- If you'd like to avoid emitting historical events, you can deploy a trigger without defining a `webhook_url`, then [update the listening webhooks for the deployed trigger](/connect/api/#update-webhooks-listening-to-deployed-trigger) after roughly a minute
 
 
 ### Native triggers

docs-v2/pages/connect/environments.mdx

@@ -27,7 +27,7 @@ The `development` environment is not intended for production use with your custo
 
 ## How to specify the environment
 
-You specify the environment when [creating a new Connect token](/connect/api/#create-a-new-token) with the Pipedream SDK or API. When users successfully connect their account, Pipedream saves the account credentials (API key, access token, etc.) for that `external_user_id` in the specified environment.
+You specify the environment when [creating a new Connect token](/connect/api/#create-token) with the Pipedream SDK or API. When users successfully connect their account, Pipedream saves the account credentials (API key, access token, etc.) for that `external_user_id` in the specified environment.
 
 Always set the environment when you create the SDK client:
 

docs-v2/pages/connect/managed-auth/connect-link.mdx

@@ -27,6 +27,6 @@ https://pipedream.com/_static/connect.html?token={token}&connectLink=true&app={a
 
 ## Success and error redirect URLs
 
-To automatically redirect users somewhere after they complete the connection flow (or if an error occurs), define the `success_redirect_uri` and `error_redirect_uri` parameters during token creation. [See the API docs](/connect/api/#create-a-new-token) for details.
+To automatically redirect users somewhere after they complete the connection flow (or if an error occurs), define the `success_redirect_uri` and `error_redirect_uri` parameters during token creation. [See the API docs](/connect/api/#create-token) for details.
 
 In the absence of these URLs, Pipedream will redirect the user to a Pipedream-hosted success or error page at the end of the connection flow.

docs-v2/pages/connect/managed-auth/quickstart.mdx

@@ -78,7 +78,7 @@ In the code below you can see how we generate a Connect token for an example use
 Once you have a token, return it to your frontend to start the account connection flow for the user, or redirect them to a Pipedream-hosted URL with [Connect Link](#or-use-connect-link).
 
 <Callout type="info">
-Refer to the API docs for [full set of parameters you can pass](/connect/api/#create-a-new-token) in the `ConnectTokenCreate` call.
+Refer to the API docs for [full set of parameters you can pass](/connect/api/#create-token) in the `ConnectTokenCreate` call.
 </Callout>
 
 ### Connect your user's account
@@ -121,7 +121,7 @@ After generating a token in the [step above](#generate-a-short-lived-token), you
 <Callout type="info">
 Make sure to add the `app` parameter to the end of the URL to specify the app.
 
-Check out the [full API docs](/connect/api/#create-a-new-token) for all parameters you can pass when creating tokens, including setting redirect URLs for success or error cases.
+Check out the [full API docs](/connect/api/#create-token) for all parameters you can pass when creating tokens, including setting redirect URLs for success or error cases.
 </Callout>
 
 ### Make authenticated requests

docs-v2/pages/connect/managed-auth/tokens.mdx

@@ -17,7 +17,7 @@ Connect tokens currently have a 4-hour expiry, and can only be used once.
 
 ## Creating a token
 
-See docs on [the `/tokens` endpoint](/connect/api/#create-a-new-token) to create new tokens.
+See docs on [the `/tokens` endpoint](/connect/api/#create-token) to create new tokens.
 
 ## Webhooks
 
@@ -27,6 +27,6 @@ When you generate a token, you can specify a `webhook_uri` where Pipedream will
 
 ## Tokens are scoped to end users and environments
 
-When you [create a new Connect token](/connect/api/#create-a-new-token), you pass an `external_user_id` and an `environment`. See the docs on [environments](/connect/environments/) for more information on passing environment in the SDK and API.
+When you [create a new Connect token](/connect/api/#create-token), you pass an `external_user_id` and an `environment`. See the docs on [environments](/connect/environments/) for more information on passing environment in the SDK and API.
 
 Tokens are scoped to this user and environment. When the user successfully connects an account with that token, it will be saved for that `external_user_id` in the specified environment.

docs-v2/pages/connect/managed-auth/users.mdx

@@ -69,4 +69,4 @@ curl -X DELETE "https://api.pipedream.com/v1/connect/{project_id}/users/{externa
   -H "Authorization: Bearer {access_token}"
 ```
 
-For complete API details including TypeScript and Node.js examples, see the [API reference](/connect/api/#delete-an-end-user).
+For complete API details including TypeScript and Node.js examples, see the [API reference](/connect/api/#delete-end-user).

docs-v2/pages/connect/managed-auth/webhooks.mdx

@@ -1,6 +1,6 @@
 # Connect Webhooks
 
-When you [generate a Connect token](/connect/managed-auth/quickstart/#generate-a-short-lived-token), you can pass a `webhook_uri` parameter. Pipedream will send a POST request to this URL when the user completes the connection flow, or if an error occurs at any point. [See the API docs](/connect/api/#create-a-new-token) for details.
+When you [generate a Connect token](/connect/managed-auth/quickstart/#generate-a-short-lived-token), you can pass a `webhook_uri` parameter. Pipedream will send a POST request to this URL when the user completes the connection flow, or if an error occurs at any point. [See the API docs](/connect/api/#create-token) for details.
 
 ## Webhook events
 

docs-v2/pages/privacy-and-security/index.mdx

@@ -124,7 +124,7 @@ Pipedream provides a [client-side SDK](/connect/api/#typescript-sdk-browser) to
 
 When you initiate authorization, you must:
 
-1. [Create a server-side token for a specific end user](/connect/api/#create-a-new-token)
+1. [Create a server-side token for a specific end user](/connect/api/#create-token)
 2. Initiate auth with that token, connecting an account for a specific user
 
 These tokens can only initiate the auth connection flow. They have no permissions to access credentials or perform other operations against the REST API. They are meant to be scoped to a specific user, for use in clients that need to initiate auth flows.