refactor(remix-auth-form): Switch to V2 (remix-run#353)

twilsonn · May 29, 2024 · 391bd26 · 391bd26
1 parent 577ae94
commit 391bd26
Show file tree

Hide file tree

Showing 5 changed files with 37 additions and 30 deletions.
diff --git a/remix-auth-form/app/root.tsx b/remix-auth-form/app/root.tsx
@@ -1,4 +1,5 @@
-import type { MetaFunction } from "@remix-run/node";
+import { cssBundleHref } from "@remix-run/css-bundle";
+import type { LinksFunction, MetaFunction } from "@remix-run/node";
 import {
   Links,
   LiveReload,
@@ -8,16 +9,23 @@ import {
   ScrollRestoration,
 } from "@remix-run/react";
 
-export const meta: MetaFunction = () => ({
-  charset: "utf-8",
-  title: "New Remix App",
-  viewport: "width=device-width,initial-scale=1",
-});
+export const links: LinksFunction = () => [
+  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
+];
+
+export const meta: MetaFunction = () => {
+  return [
+    { title: "New Remix App" },
+    { name: "description", content: "Welcome to Remix!" },
+  ];
+};
 
 export default function App() {
   return (
     <html lang="en">
       <head>
+        <meta charSet="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
         <Meta />
         <Links />
       </head>

diff --git a/remix-auth-form/app/routes/login.tsx b/remix-auth-form/app/routes/login.tsx
@@ -1,18 +1,18 @@
-import type { ActionArgs, LoaderArgs } from "@remix-run/node";
+import type { ActionFunctionArgs, LoaderFunctionArgs } from "@remix-run/node";
 import { json } from "@remix-run/node";
 import { Form, useLoaderData } from "@remix-run/react";
 
 import { auth, sessionStorage } from "~/auth.server";
 
-export const action = async ({ request }: ActionArgs) => {
+export const action = async ({ request }: ActionFunctionArgs) => {
   await auth.authenticate("form", request, {
     successRedirect: "/private",
     failureRedirect: "/login",
   });
 };
 
 type LoaderError = { message: string } | null;
-export const loader = async ({ request }: LoaderArgs) => {
+export const loader = async ({ request }: LoaderFunctionArgs) => {
   await auth.isAuthenticated(request, { successRedirect: "/private" });
   const session = await sessionStorage.getSession(
     request.headers.get("Cookie"),

diff --git a/remix-auth-form/app/routes/private.tsx b/remix-auth-form/app/routes/private.tsx
@@ -1,14 +1,14 @@
-import type { ActionArgs, LoaderArgs } from "@remix-run/node";
+import type { ActionFunctionArgs, LoaderFunctionArgs } from "@remix-run/node";
 import { json } from "@remix-run/node";
 import { Form, useLoaderData } from "@remix-run/react";
 
 import { auth } from "~/auth.server";
 
-export const action = async ({ request }: ActionArgs) => {
+export const action = async ({ request }: ActionFunctionArgs) => {
   await auth.logout(request, { redirectTo: "/login" });
 };
 
-export const loader = async ({ request }: LoaderArgs) => {
+export const loader = async ({ request }: LoaderFunctionArgs) => {
   const email = await auth.isAuthenticated(request, {
     failureRedirect: "/login",
   });

diff --git a/remix-auth-form/package.json b/remix-auth-form/package.json
@@ -1,29 +1,31 @@
 {
   "private": true,
   "sideEffects": false,
+  "type": "module",
   "scripts": {
     "build": "remix build",
-    "dev": "remix dev",
-    "start": "remix-serve build",
+    "dev": "remix dev --manual",
+    "start": "remix-serve ./build/index.js",
     "typecheck": "tsc"
   },
   "dependencies": {
-    "@remix-run/node": "^1.19.3",
-    "@remix-run/react": "^1.19.3",
-    "@remix-run/serve": "^1.19.3",
-    "isbot": "^3.6.5",
+    "@remix-run/css-bundle": "^2.0.1",
+    "@remix-run/node": "^2.0.1",
+    "@remix-run/react": "^2.0.1",
+    "@remix-run/serve": "^2.0.1",
+    "isbot": "^3.6.8",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "remix-auth": "^3.2.1",
-    "remix-auth-form": "^1.1.1"
+    "remix-auth": "^3.6.0",
+    "remix-auth-form": "^1.4.0"
   },
   "devDependencies": {
-    "@remix-run/dev": "^1.19.3",
-    "@remix-run/eslint-config": "^1.19.3",
-    "@types/react": "^18.0.25",
-    "@types/react-dom": "^18.0.8",
-    "eslint": "^8.27.0",
-    "typescript": "^4.8.4"
+    "@remix-run/dev": "^2.0.1",
+    "@remix-run/eslint-config": "^2.0.1",
+    "@types/react": "^18.2.20",
+    "@types/react-dom": "^18.2.7",
+    "eslint": "^8.38.0",
+    "typescript": "^5.1.6"
   },
   "engines": {
     "node": ">=14.0.0"

diff --git a/remix-auth-form/remix.config.js b/remix-auth-form/remix.config.js
@@ -1,8 +1,5 @@
 /** @type {import('@remix-run/dev').AppConfig} */
-module.exports = {
-  future: {
-    v2_routeConvention: true,
-  },
+export default {
   ignoredRouteFiles: ["**/.*"],
   // appDirectory: "app",
   // assetsBuildDirectory: "public/build",