Point docs and some blog posts to React Router v7 (#315)

* add a banner for React Router v7 * Update blog posts
remix-run · Dec 11, 2024 · 12a4457 · 12a4457
1 parent 0c732af
commit 12a4457
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 10 deletions.
diff --git a/app/routes/docs.$lang.$ref.tsx b/app/routes/docs.$lang.$ref.tsx
@@ -450,36 +450,53 @@ ColorSchemeButton.displayName = "ColorSchemeButton";
 
 function VersionWarningMobile() {
   let { isLatest, branches, currentGitHubRef } = useLoaderData<typeof loader>();
-  if (isLatest) return null;
 
   return (
     <div className="text-center lg:hidden">
       <div className="bg-blue-brand p-2 text-xs text-white">
-        <VersionWarningMessage
-          branches={branches}
-          currentGitHubRef={currentGitHubRef}
-        />
+        {isLatest ? (
+          <ReactRouterV7Message />
+        ) : (
+          <VersionWarningMessage
+            branches={branches}
+            currentGitHubRef={currentGitHubRef}
+          />
+        )}
       </div>
     </div>
   );
 }
 
 function VersionWarningDesktop() {
   let { isLatest, branches, currentGitHubRef } = useLoaderData<typeof loader>();
-  if (isLatest) return null;
 
   return (
     <div className="hidden lg:block">
       <div className="animate-[bounce_500ms_2.5] bg-blue-brand p-2 text-xs text-white">
-        <VersionWarningMessage
-          branches={branches}
-          currentGitHubRef={currentGitHubRef}
-        />
+        {isLatest ? (
+          <ReactRouterV7Message />
+        ) : (
+          <VersionWarningMessage
+            branches={branches}
+            currentGitHubRef={currentGitHubRef}
+          />
+        )}
       </div>
     </div>
   );
 }
 
+function ReactRouterV7Message() {
+  return (
+    <>
+      React Router v7 has been released.{" "}
+      <a href="https://reactrouter.com/home" className="underline">
+        View the docs
+      </a>
+    </>
+  );
+}
+
 function VersionWarningMessage({
   branches,
   currentGitHubRef,

diff --git a/data/posts/incremental-path-to-react-19.md b/data/posts/incremental-path-to-react-19.md
@@ -9,6 +9,12 @@ authors:
   - Ryan Florence
 ---
 
+**Update (Dec 2024):** [React Router v7](https://reactrouter.com/) has been released!
+
+We now recommend starting all new projects with React Router v7 and [upgrading existing Remix apps](https://reactrouter.com/upgrading/remix).
+
+---
+
 Last week [I gave a talk](https://www.youtube.com/watch?v=ZcwA0xt8FlQ) about React Router and Remix at React Conf and [we posted an announcement](./merging-remix-and-react-router) here. Now that the dust has settled, I wanted to provide some more insight into the decision announced there and answer some common questions.
 
 ## tl;dr

diff --git a/data/posts/merging-remix-and-react-router.md b/data/posts/merging-remix-and-react-router.md
@@ -10,6 +10,12 @@ authors:
   - Brooks Lybrand
 ---
 
+**Update (Dec 2024):** [React Router v7](https://reactrouter.com/) has been released!
+
+We now recommend starting all new projects with React Router v7 and [upgrading existing Remix apps](https://reactrouter.com/upgrading/remix).
+
+---
+
 We've been building a bridge. You can hear Ryan talk about this announcement at React Conf 🎥
 
 <iframe style="width:100%;aspect-ratio:16/9;" src="https://www.youtube.com/embed/ZcwA0xt8FlQ?si=vNgdHMWQIHpDyXb5" title="React Conf 2024" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>