refactor: enable all remix future flags

https://reactrouter.com/upgrading/remix
https://remix.run/docs/en/2.13.1/start/future-flags#v3_fetcherpersist
https://remix.run/docs/en/2.13.1/guides/single-fetch

Author: TrySound

apps/builder/app/root.tsx

@@ -1,13 +1,13 @@
 // Our root outlet doesn't contain a layout because we have 2 types of documents: canvas and builder and we need to decide down the line which one to render, thre is no single root document.
-import { Outlet, json, useLoaderData } from "@remix-run/react";
+import { Outlet, useLoaderData } from "@remix-run/react";
 import { setEnv } from "@webstudio-is/feature-flags";
 import env from "./env/env.server";
 import { useSetFeatures } from "./shared/use-set-features";
 
 export const loader = () => {
-  return json({
+  return {
     features: env.FEATURES,
-  });
+  };
 };
 
 export default function App() {

apps/builder/app/routes/_ui.(builder).tsx

@@ -7,7 +7,7 @@ import { lazy } from "react";
 import { useLoaderData } from "@remix-run/react";
 import type { MetaFunction, ShouldRevalidateFunction } from "@remix-run/react";
 import {
-  json,
+  data,
   type HeadersArgs,
   type LoaderFunctionArgs,
 } from "@remix-run/server-runtime";
@@ -207,7 +207,7 @@ export const loader = async (loaderArgs: LoaderFunctionArgs) => {
       `frame-src ${url.origin}/canvas https://app.goentri.com/; worker-src 'none'`
     );
 
-    return json(
+    return data(
       {
         project,
         publisherHost,

apps/builder/app/routes/_ui.dashboard.tsx

@@ -1,6 +1,6 @@
 import { lazy } from "react";
 import { useLoaderData, type MetaFunction } from "@remix-run/react";
-import { json, type LoaderFunctionArgs } from "@remix-run/server-runtime";
+import type { LoaderFunctionArgs } from "@remix-run/server-runtime";
 import { dashboardProjectRouter } from "@webstudio-is/dashboard/index.server";
 import { findAuthenticatedUser } from "~/services/auth.server";
 import { builderUrl, isDashboard, loginPath } from "~/shared/router-utils";
@@ -112,7 +112,7 @@ export const loader = async ({ request }: LoaderFunctionArgs) => {
 
   const { sourceOrigin } = parseBuilderUrl(request.url);
 
-  return json({
+  return {
     user,
     projects,
     projectTemplates,
@@ -121,7 +121,7 @@ export const loader = async ({ request }: LoaderFunctionArgs) => {
     imageBaseUrl: env.IMAGE_BASE_URL,
     origin: sourceOrigin,
     projectToClone,
-  });
+  };
 };
 
 /**

apps/builder/app/routes/_ui.login._index.tsx

@@ -1,8 +1,7 @@
 import {
   type LinksFunction,
   type LoaderFunctionArgs,
-  type TypedResponse,
-  json,
+  data,
 } from "@remix-run/server-runtime";
 import { useLoaderData, type MetaFunction } from "@remix-run/react";
 import { findAuthenticatedUser } from "~/services/auth.server";
@@ -49,9 +48,7 @@ export const meta: MetaFunction<typeof loader> = () => {
   return metas;
 };
 
-export const loader = async ({
-  request,
-}: LoaderFunctionArgs): Promise<TypedResponse<LoginProps>> => {
+export const loader = async ({ request }: LoaderFunctionArgs) => {
   if (false === isDashboard(request)) {
     throw new Response("Not Found", {
       status: 404,
@@ -83,14 +80,14 @@ export const loader = async ({
 
   headers.append("Set-Cookie", await returnToCookie.serialize(returnTo));
 
-  return json(
+  return data(
     {
       isSecretLoginEnabled: env.DEV_LOGIN === "true",
       isGithubEnabled: Boolean(env.GH_CLIENT_ID && env.GH_CLIENT_SECRET),
       isGoogleEnabled: Boolean(
         env.GOOGLE_CLIENT_ID && env.GOOGLE_CLIENT_SECRET
       ),
-    },
+    } satisfies LoginProps,
     { headers }
   );
 };

apps/builder/app/routes/_ui.logout.tsx

@@ -1,4 +1,4 @@
-import { json, type LoaderFunctionArgs } from "@remix-run/server-runtime";
+import type { LoaderFunctionArgs } from "@remix-run/server-runtime";
 import { createDebug } from "~/shared/debug";
 import { builderUrl, isDashboard, loginPath } from "~/shared/router-utils";
 import { preventCrossOriginCookie } from "~/services/no-cross-origin-cookie";
@@ -58,10 +58,10 @@ export const loader = async ({ request }: LoaderFunctionArgs) => {
         `${builderUrl({ projectId, origin: url.origin })}builder-logout`
     );
 
-    return json({
+    return {
       redirectTo,
       logoutUrls,
-    });
+    };
   } catch (error) {
     if (error instanceof Response) {
       throw error;

apps/builder/app/routes/_ui.tsx

@@ -11,7 +11,7 @@ import manropeVariableFont from "@fontsource-variable/manrope/index.css?url";
 import robotoMonoFont from "@fontsource/roboto-mono/index.css?url";
 import appCss from "../shared/app.css?url";
 import {
-  json,
+  data,
   type LinksFunction,
   type LoaderFunctionArgs,
 } from "@remix-run/server-runtime";
@@ -56,7 +56,7 @@ export const loader = async ({ request }: LoaderFunctionArgs) => {
   const [csrfToken, setCookieValue] = await getCsrfTokenAndCookie(request);
 
   if (request.headers.get("sec-fetch-mode") !== "navigate") {
-    return json({ csrfToken: "" });
+    return { csrfToken: "" };
   }
 
   const headers = new Headers();
@@ -65,7 +65,7 @@ export const loader = async ({ request }: LoaderFunctionArgs) => {
     headers.set("Set-Cookie", setCookieValue);
   }
 
-  return json(
+  return data(
     { csrfToken },
     {
       headers,

apps/builder/app/routes/builder-logout.ts

@@ -1,4 +1,4 @@
-import { json, type ActionFunctionArgs } from "@remix-run/server-runtime";
+import { data, type ActionFunctionArgs } from "@remix-run/server-runtime";
 import { createDebug } from "~/shared/debug";
 import { builderAuthenticator } from "~/services/builder-auth.server";
 import { getAuthorizationServerOrigin } from "~/shared/router-utils/origins";
@@ -19,7 +19,7 @@ export const action = async ({ request }: ActionFunctionArgs) => {
   }
 
   if (request.method !== "POST") {
-    return json(
+    return data(
       { message: "Method not allowed" },
       {
         status: 405,

apps/builder/app/routes/dashboard-logout.ts

@@ -1,4 +1,4 @@
-import { json } from "@remix-run/server-runtime";
+import { data } from "@remix-run/server-runtime";
 import { authenticator } from "~/services/auth.server";
 import { isDashboard, loginPath } from "~/shared/router-utils";
 import { preventCrossOriginCookie } from "~/services/no-cross-origin-cookie";
@@ -32,7 +32,7 @@ export const action = async ({ request }: ActionFunctionArgs) => {
 
       headers.set("Content-Type", "application/json");
 
-      return json(
+      return data(
         {
           redirectTo: error.headers.get("Location"),
         },

apps/builder/app/routes/n8n.$.tsx

@@ -1,4 +1,4 @@
-import { type LoaderFunctionArgs, json } from "@remix-run/server-runtime";
+import type { LoaderFunctionArgs } from "@remix-run/server-runtime";
 import { isRouteErrorResponse, useRouteError } from "@remix-run/react";
 import { z } from "zod";
 import { findAuthenticatedUser } from "~/services/auth.server";
@@ -119,7 +119,7 @@ export const loader = async ({ request, params }: LoaderFunctionArgs) => {
 
   n8nResponse satisfies never;
 
-  return json({});
+  return {};
 };
 
 export const ErrorBoundary = () => {

apps/builder/app/routes/oauth.ws.authorize.tsx

@@ -1,4 +1,4 @@
-import { json, type LoaderFunction } from "@remix-run/server-runtime";
+import { data, type LoaderFunction } from "@remix-run/server-runtime";
 import { z } from "zod";
 import { createDebug } from "~/shared/debug";
 import { fromError } from "zod-validation-error";
@@ -103,7 +103,7 @@ export const loader: LoaderFunction = async ({ request }) => {
     if (false === parsedRedirect.success) {
       debug("redirect_uri not provided in query params");
 
-      return json(
+      return data(
         {
           error: "invalid_request",
           error_description: "No redirect_uri provided",
@@ -126,7 +126,7 @@ export const loader: LoaderFunction = async ({ request }) => {
     ) {
       debug("redirect_uri does not match the registered redirect URIs");
 
-      return json(
+      return data(
         {
           error: "invalid_request",
           error_description:
@@ -196,7 +196,7 @@ export const loader: LoaderFunction = async ({ request }) => {
       ) {
         debug("redirect_uri does not match the registered redirect URIs");
 
-        return json(
+        return data(
           {
             error: "invalid_request",
             error_description:
@@ -260,7 +260,7 @@ export const loader: LoaderFunction = async ({ request }) => {
     console.error("error", error);
     debug("error", error);
 
-    throw json(
+    throw data(
       {
         error: "server_error",
         error_description: