From 7a38a8ea27bca0e77aad350c4028f08c32d17102 Mon Sep 17 00:00:00 2001 From: Matt Brophy Date: Wed, 8 Mar 2023 17:08:38 -0500 Subject: [PATCH 1/8] Remove v2_errorBoundary and CatchBoundary from code --- packages/remix-dev/compiler/assets.ts | 2 - packages/remix-dev/config.ts | 14 -- packages/remix-react/browser.tsx | 16 -- packages/remix-react/components.tsx | 55 +------ packages/remix-react/errorBoundaries.tsx | 151 +++++------------- packages/remix-react/index.tsx | 1 - packages/remix-react/routeModules.ts | 23 +-- packages/remix-react/routes.tsx | 16 +- packages/remix-server-runtime/routeModules.ts | 19 +-- packages/remix-server-runtime/routes.ts | 10 +- packages/remix-server-runtime/server.ts | 59 ------- packages/remix-testing/create-remix-stub.tsx | 2 - 12 files changed, 57 insertions(+), 311 deletions(-) diff --git a/packages/remix-dev/compiler/assets.ts b/packages/remix-dev/compiler/assets.ts index f8c427704cc..c8bf11df2d7 100644 --- a/packages/remix-dev/compiler/assets.ts +++ b/packages/remix-dev/compiler/assets.ts @@ -27,7 +27,6 @@ export interface AssetsManifest { imports?: string[]; hasAction: boolean; hasLoader: boolean; - hasCatchBoundary: boolean; hasErrorBoundary: boolean; }; }; @@ -112,7 +111,6 @@ export async function createAssetsManifest({ imports: resolveImports(output.imports), hasAction: sourceExports.includes("action"), hasLoader: sourceExports.includes("loader"), - hasCatchBoundary: sourceExports.includes("CatchBoundary"), hasErrorBoundary: sourceExports.includes("ErrorBoundary"), }; } diff --git a/packages/remix-dev/config.ts b/packages/remix-dev/config.ts index 6fdf8d3651d..52350b9d572 100644 --- a/packages/remix-dev/config.ts +++ b/packages/remix-dev/config.ts @@ -41,7 +41,6 @@ interface FutureConfig { unstable_postcss: boolean; unstable_tailwind: boolean; unstable_vanillaExtract: boolean; - v2_errorBoundary: boolean; v2_meta: boolean; v2_routeConvention: boolean; } @@ -375,10 +374,6 @@ export async function readConfig( } } - if (!appConfig.future?.v2_errorBoundary) { - warnOnce(errorBoundaryWarning, "v2_errorBoundary"); - } - let serverBuildPath = resolveServerBuildPath(rootDirectory, appConfig); let serverBuildTargetEntryModule = `export * from ${JSON.stringify( serverBuildVirtualModule.id @@ -578,7 +573,6 @@ export async function readConfig( unstable_postcss: appConfig.future?.unstable_postcss === true, unstable_tailwind: appConfig.future?.unstable_tailwind === true, unstable_vanillaExtract: appConfig.future?.unstable_vanillaExtract === true, - v2_errorBoundary: appConfig.future?.v2_errorBoundary === true, v2_meta: appConfig.future?.v2_meta === true, v2_routeConvention: appConfig.future?.v2_routeConvention === true, }; @@ -671,11 +665,3 @@ let listFormat = new Intl.ListFormat("en", { }); export let flatRoutesWarning = `⚠️ DEPRECATED: The old nested folders route convention has been deprecated in favor of "flat routes". Please enable the new routing convention via the \`future.v2_routeConvention\` flag in your \`remix.config.js\` file. For more information, please see https://remix.run/docs/en/main/file-conventions/route-files-v2.`; - -export const errorBoundaryWarning = - "⚠️ DEPRECATED: The separation of `CatchBoundary` and `ErrorBoundary` has " + - "been deprecated and Remix v2 will use a singular `ErrorBoundary` for " + - "all thrown values (`Response` and `Error`). Please migrate to the new " + - "behavior in Remix v1 via the `future.v2_errorBoundary` flag in your " + - "`remix.config.js` file. For more information, see " + - "https://remix.run/docs/route/error-boundary-v2"; diff --git a/packages/remix-react/browser.tsx b/packages/remix-react/browser.tsx index 70eeb7095d5..368d48cbcaa 100644 --- a/packages/remix-react/browser.tsx +++ b/packages/remix-react/browser.tsx @@ -84,10 +84,6 @@ if (import.meta && import.meta.hot) { ? window.__remixRouteModules[id]?.default ?? imported.default : imported.default, - CatchBoundary: imported.CatchBoundary - ? window.__remixRouteModules[id]?.CatchBoundary ?? - imported.CatchBoundary - : imported.CatchBoundary, ErrorBoundary: imported.ErrorBoundary ? window.__remixRouteModules[id]?.ErrorBoundary ?? imported.ErrorBoundary @@ -139,18 +135,6 @@ if (import.meta && import.meta.hot) { */ export function RemixBrowser(_props: RemixBrowserProps): ReactElement { if (!router) { - if (!window.__remixContext.future.v2_errorBoundary) { - warnOnce( - false, - "⚠️ DEPRECATED: The separation of `CatchBoundary` and `ErrorBoundary` has " + - "been deprecated and Remix v2 will use a singular `ErrorBoundary` for " + - "all thrown values (`Response` and `Error`). Please migrate to the new " + - "behavior in Remix v1 via the `future.v2_errorBoundary` flag in your " + - "`remix.config.js` file. For more information, see " + - "https://remix.run/docs/route/error-boundary-v2" - ); - } - let routes = createClientRoutes( window.__remixManifest.routes, window.__remixRouteModules, diff --git a/packages/remix-react/components.tsx b/packages/remix-react/components.tsx index e9bb988ce85..2b4435c886e 100644 --- a/packages/remix-react/components.tsx +++ b/packages/remix-react/components.tsx @@ -43,12 +43,7 @@ import type { SerializeFrom } from "@remix-run/server-runtime"; import type { AppData } from "./data"; import type { EntryContext, RemixContextObject } from "./entry"; -import { - RemixRootDefaultErrorBoundary, - RemixRootDefaultCatchBoundary, - RemixCatchBoundary, - V2_RemixRootDefaultErrorBoundary, -} from "./errorBoundaries"; +import { V2_RemixRootDefaultErrorBoundary } from "./errorBoundaries"; import invariant from "./invariant"; import { getDataLinkHrefs, @@ -143,7 +138,7 @@ export function RemixRoute({ id }: { id: string }) { } export function RemixRouteError({ id }: { id: string }) { - let { future, routeModules } = useRemixContext(); + let { routeModules } = useRemixContext(); // This checks prevent cryptic error messages such as: 'Cannot read properties of undefined (reading 'root')' invariant( @@ -153,51 +148,15 @@ export function RemixRouteError({ id }: { id: string }) { ); let error = useRouteError(); - let { CatchBoundary, ErrorBoundary } = routeModules[id]; - - if (future.v2_errorBoundary) { - // Provide defaults for the root route if they are not present - if (id === "root") { - ErrorBoundary ||= V2_RemixRootDefaultErrorBoundary; - } - if (ErrorBoundary) { - // TODO: Unsure if we can satisfy the typings here - // @ts-expect-error - return ; - } - throw error; - } + let { ErrorBoundary } = routeModules[id]; // Provide defaults for the root route if they are not present - if (id === "root") { - CatchBoundary ||= RemixRootDefaultCatchBoundary; - ErrorBoundary ||= RemixRootDefaultErrorBoundary; - } - - if (isRouteErrorResponse(error)) { - let tError = error as any; - if ( - tError?.error instanceof Error && - tError.status !== 404 && - ErrorBoundary - ) { - // Internal framework-thrown ErrorResponses - return ; - } - if (CatchBoundary) { - // User-thrown ErrorResponses - return ( - - ); - } + if (!ErrorBoundary && id === "root") { + ErrorBoundary = V2_RemixRootDefaultErrorBoundary; } - if (error instanceof Error && ErrorBoundary) { - // User- or framework-thrown Errors - return ; + if (ErrorBoundary) { + return ; } throw error; diff --git a/packages/remix-react/errorBoundaries.tsx b/packages/remix-react/errorBoundaries.tsx index 5e083af4d36..96115e7c678 100644 --- a/packages/remix-react/errorBoundaries.tsx +++ b/packages/remix-react/errorBoundaries.tsx @@ -1,16 +1,12 @@ -import React, { useContext } from "react"; -import type { ErrorResponse, Location } from "@remix-run/router"; +import React from "react"; +import type { Location } from "@remix-run/router"; import { isRouteErrorResponse, useRouteError } from "react-router-dom"; -import type { - CatchBoundaryComponent, - ErrorBoundaryComponent, -} from "./routeModules"; -import type { ThrownResponse } from "./errors"; +import type { V2_ErrorBoundaryComponent } from "./routeModules"; type RemixErrorBoundaryProps = React.PropsWithChildren<{ location: Location; - component: ErrorBoundaryComponent; + component: V2_ErrorBoundaryComponent; error?: Error; }>; @@ -66,55 +62,24 @@ export class RemixErrorBoundary extends React.Component< } } -/** - * When app's don't provide a root level ErrorBoundary, we default to this. - */ -export function RemixRootDefaultErrorBoundary({ error }: { error: Error }) { - console.error(error); - return ( - - - - - Application Error! - - -
-

Application Error

- 
-            {error.stack}
-
-
-