Removed legacy config, allow to include segments in produciton, updat…

…ed docs website

docs/app/components/ClientHint.tsx

@@ -1,5 +1,6 @@
-import { useRevalidator } from '@remix-run/react'
+
 import { useEffect } from 'react'
+import { useRevalidator } from 'react-router'
 
   const clientHints = {
   theme: {

docs/app/components/ThemeSwitcher.tsx

@@ -1,6 +1,7 @@
-import { useFetcher } from '@remix-run/react'
+
 import { MoonIcon, SunIcon } from 'lucide-react'
 import { useRef } from 'react'
+import { useFetcher } from 'react-router'
 
 import { useTheme } from '~/hooks/useTheme'
 

docs/app/components/layout/Documentation.tsx

@@ -1,4 +1,4 @@
-import { Link, useRouteLoaderData } from '@remix-run/react'
+
 import { Fragment, useMemo, useRef } from 'react'
 import { getMDXComponent, getMDXExport } from 'mdx-bundler/client'
 import clsx from 'clsx'
@@ -12,6 +12,7 @@ import Editor from '~/components/plugins/Editor'
 import Heading from '~/components/plugins/Heading'
 import { useTableOfContents } from '~/hooks/useTableOfContents'
 import { BackgroundGradient } from '../ui/background-gradient'
+import { Link, useRouteLoaderData } from 'react-router'
 
 export function Documentation({
   route = 'routes/docs.$tag.$slug',
@@ -117,7 +118,7 @@ export function Documentation({
               </dt>
               <dd className="mt-1">
                 <Link
-                  unstable_viewTransition
+                  viewTransition
                   className="text-base font-semibold text-slate-500 hover:text-slate-600 dark:text-slate-400 dark:hover:text-slate-300"
                   to={`/docs/${tag}/${prev.slug}`}
                   prefetch="intent"
@@ -138,7 +139,7 @@ export function Documentation({
                   className="text-base font-semibold text-slate-500 hover:text-slate-600 dark:text-slate-400 dark:hover:text-slate-300"
                   to={`/docs/${tag}/${next.slug}`}
                   prefetch="intent"
-                  unstable_viewTransition
+                  viewTransition
                 >
                   {next.alternateTitle ?? next.title}
                   {/* */}&nbsp;<span aria-hidden="true">→</span>

docs/app/components/layout/Header.tsx

@@ -6,7 +6,7 @@ import {
   useLocation,
   useNavigate,
   useRouteLoaderData,
-} from '@remix-run/react'
+} from 'react-router'
 import { ChevronDownIcon, RatioIcon, SearchIcon, XIcon } from 'lucide-react'
 import { Disclosure, Menu, Transition } from '@headlessui/react'
 import { useTransition, animated } from 'react-spring'
@@ -308,7 +308,7 @@ export default function Header({
                   aria-label="Home page"
                   to="/"
                   reloadDocument
-                  unstable_viewTransition
+                  viewTransition
                   className="md:flex"
                 >
                   <RatioIcon className="mr-2 h-7 w-7 self-center text-center md:hidden" />

docs/app/components/layout/Sidebar.tsx

@@ -1,6 +1,6 @@
 import { Fragment, useEffect, useRef, useState } from 'react'
 import type { ReactNode } from 'react'
-import { NavLink, useLocation } from '@remix-run/react'
+import { NavLink, useLocation } from 'react-router'
 import clsx from 'clsx'
 
 import { useIsomorphicLayoutEffect } from '~/hooks/useIsomorphicLayoutEffect'
@@ -125,7 +125,7 @@ function DocList({ meta, tag }: { meta: MetadataMetaType; tag: string }) {
                 />
               </svg>
               Quick search...
-              
+
               {actionKey ? (
                 <span className="ml-auto flex-none pl-3 text-xs font-semibold">
                   {actionKey[0]}K

docs/app/components/ui/navbar-menu.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from 'react'
 import { motion } from 'framer-motion'
-import { Link } from '@remix-run/react'
+import { Link } from 'react-router'
 import { cn } from '~/utils/cn'
 
 const transition = {

docs/app/entry.client.tsx

@@ -1,4 +1,4 @@
-import { RemixBrowser } from '@remix-run/react'
+import { HydratedRouter } from 'react-router/dom'
 import { startTransition, StrictMode } from 'react'
 import { hydrateRoot } from 'react-dom/client'
 import { configureGlobalCache } from 'remix-client-cache'
@@ -9,7 +9,7 @@ startTransition(() => {
   hydrateRoot(
     document,
     <StrictMode>
-      <RemixBrowser />
+      <HydratedRouter />
     </StrictMode>
   )
 })

docs/app/entry.server.tsx

@@ -1,8 +1,7 @@
 /* eslint-disable indent */
 import { PassThrough } from 'node:stream'
-import type { AppLoadContext, EntryContext } from '@remix-run/node'
-import { createReadableStreamFromReadable } from '@remix-run/node'
-import { RemixServer } from '@remix-run/react'
+import { type AppLoadContext, type EntryContext, ServerRouter } from "react-router"
+import { createReadableStreamFromReadable } from '@react-router/node'
 import * as isbotModule from 'isbot'
 import { renderToPipeableStream } from 'react-dom/server'
 import 'dotenv/config'
@@ -61,7 +60,7 @@ function handleBotRequest(
   return new Promise((resolve, reject) => {
     let shellRendered = false
     const { abort, pipe } = renderToPipeableStream(
-      <RemixServer
+      <ServerRouter
         context={remixContext}
         url={request.url}
         abortDelay={ABORT_DELAY}
@@ -111,7 +110,7 @@ function handleBrowserRequest(
   return new Promise((resolve, reject) => {
     let shellRendered = false
     const { abort, pipe } = renderToPipeableStream(
-      <RemixServer
+      <ServerRouter
         context={remixContext}
         url={request.url}
         abortDelay={ABORT_DELAY}

docs/app/hooks/useRequestInfo.ts

@@ -1,5 +1,5 @@
 import { invariant } from '@epic-web/invariant'
-import { useRouteLoaderData } from '@remix-run/react'
+import { useRouteLoaderData } from 'react-router'
 
 import { type loader as rootLoader } from '~/root.tsx'
 

docs/app/hooks/useTheme.ts

@@ -1,4 +1,4 @@
-import { useFetchers } from '@remix-run/react'
+import { useFetchers } from 'react-router'
 import { z } from 'zod'
 
 import { useHints } from './useHints'

docs/app/root.tsx

@@ -1,13 +1,4 @@
-import {
-  Links,
-  LiveReload,
-  Meta,
-  Outlet,
-  Scripts,
-  ScrollRestoration,
-} from '@remix-run/react'
-import { json } from '@remix-run/node'
-import type { LoaderFunctionArgs, MetaFunction } from '@remix-run/node'
+
 import { ClientHints, getHints } from './components/ClientHint'
 import { useTheme } from './hooks/useTheme'
 import { getTheme } from './utils/server/theme.server'
@@ -17,11 +8,12 @@ import './styles/code.css'
 import './styles/documentation.css'
 import './styles/fonts.css'
 import './styles/tailwind.css'
+import { Links, LoaderFunctionArgs, Meta, MetaFunction, Outlet, Scripts, ScrollRestoration } from 'react-router'
 
 export const loader = async ({ request }: LoaderFunctionArgs) => {
   const versions = (await getVersions()) ?? []
 
-  return json({
+  return  ({
     requestInfo: {
       hints: getHints(request),
       userPrefs: { theme: getTheme(request) },

docs/app/routes.ts

@@ -0,0 +1,3 @@
+import { flatRoutes } from "@react-router/fs-routes"
+
+export const routes = flatRoutes()

docs/app/routes/_index.tsx

@@ -1,5 +1,5 @@
-import type { MetaFunction } from '@remix-run/node'
-import { Link } from '@remix-run/react' 
+
+import { Link } from 'react-router'
 import { FeaturesSection } from '~/components/FeaturesSection'
 import { Button } from '~/components/ui/Button'
 import { LampContainer } from '~/components/ui/Lamp'
@@ -68,7 +68,7 @@ export default function Index() {
           as={Link}
           to="/docs/main"
           className="text-white"
-          unstable_viewTransition
+          viewTransition
         >
           Get Started
         </Button>

docs/app/routes/docs.$tag.$slug.tsx

@@ -1,5 +1,5 @@
-import { type LoaderFunctionArgs, json } from '@remix-run/node'
 
+import { LoaderFunctionArgs } from 'react-router'
 import { Documentation } from '~/components/layout/Documentation'
 import {
   getPostContent,
@@ -15,7 +15,7 @@ export const loader = async ({ params }: LoaderFunctionArgs) => {
   const { code, frontmatter } = await mdxToHtml(postContent)
   const [prev, next] = await getPreviousAndNextRoutes(tag, slug)
 
-  return json({
+  return  ({
     frontmatter,
     code,
     next,

docs/app/routes/docs.$tag._index.tsx

@@ -1,5 +1,5 @@
-import { json, redirect } from '@remix-run/node'
-import type { LoaderFunctionArgs } from '@remix-run/node'
+
+import { LoaderFunctionArgs, redirect } from 'react-router'
 
 import { Documentation } from '~/components/layout/Documentation'
 import {
@@ -23,7 +23,7 @@ export const loader = async ({ params }: LoaderFunctionArgs) => {
   const { code, frontmatter } = await mdxToHtml(postContent)
   const next = await getFirstPost(tag)
 
-  return json({
+  return  ({
     frontmatter,
     code,
     next,

docs/app/routes/docs.$tag.tsx

@@ -1,7 +1,6 @@
-import { json } from '@remix-run/node'
-import type { LoaderFunctionArgs } from '@remix-run/node'
-import type { ClientLoaderFunctionArgs } from '@remix-run/react'
-import { Outlet } from '@remix-run/react'
+
+import type { ClientLoaderFunctionArgs, LoaderFunctionArgs } from 'react-router'
+import { Outlet } from 'react-router'
 import { cacheClientLoader, useCachedLoaderData } from 'remix-client-cache'
 
 import { Sidebar } from '~/components/layout/Sidebar'
@@ -20,7 +19,7 @@ export const loader = async ({ params }: LoaderFunctionArgs) => {
     metadata = (await getParsedMetadata(params.tag)) ?? metadata
   }
 
-  return json({
+  return  ({
     metadata,
     tag: params.tag,
   })

docs/app/routes/healthcheck.tsx

@@ -1,4 +1,4 @@
-import type { LoaderFunctionArgs } from '@remix-run/node'
+import type { LoaderFunctionArgs } from '@react-router/node'
 
 export async function loader({ request }: LoaderFunctionArgs) {
   try {

docs/app/routes/updateTheme.ts

@@ -1,5 +1,6 @@
-import { json, type ActionFunctionArgs, redirect } from '@remix-run/node'
 
+
+import { ActionFunctionArgs, data, redirect } from 'react-router'
 import { ThemeFormSchema } from '~/hooks/useTheme'
 import { setTheme } from '~/utils/server/theme.server'
 
@@ -15,5 +16,5 @@ export async function action({ request }: ActionFunctionArgs) {
     return redirect(redirectTo, responseInit)
   }
 
-  return json({ success: true }, responseInit)
+  return  data({ success: true }, responseInit)
 }

docs/env.d.ts

@@ -1,2 +1,2 @@
-/// <reference types="@remix-run/node" />
+/// <reference types="@react-router/node" />
 /// <reference types="vite/client" />