Update to remix v2. Fix fly mem leak

app/routes/$.tsx

@@ -1,12 +1,12 @@
 import type { LoaderFunction } from "@remix-run/node";
 import { redirect } from "@remix-run/node";
-import { useCatch } from "@remix-run/react";
+import { isRouteErrorResponse, useRouteError } from "@remix-run/react";
 import { getLinkByAlias } from "~/models/shortlink.server";
 
-export function CatchBoundary() {
-  const caught = useCatch();
+export function ErrorBoundary() {
+  const error = useRouteError();
 
-  if (caught.status === 404) {
+  if (isRouteErrorResponse(error) && error.status === 404) {
     return (
       <main className="flex h-screen justify-center bg-slate-100">
         <div className="m-auto flex max-w-xl flex-col items-center justify-center space-y-6 bg-white p-10">

app/routes/healthcheck.tsx

@@ -1,9 +1,9 @@
 // learn more: https://fly.io/docs/reference/configuration/#services-http_checks
-import type { LoaderArgs } from "@remix-run/node";
+import type { LoaderFunctionArgs } from "@remix-run/node";
 
 import { prisma } from "~/db.server";
 
-export async function loader({ request }: LoaderArgs) {
+export async function loader({ request }: LoaderFunctionArgs) {
   const host =
     request.headers.get("X-Forwarded-Host") ?? request.headers.get("host");
 

app/routes/new.tsx

@@ -83,7 +83,7 @@ export const loader: LoaderFunction = async ({ request }) => {
 
 export default function Index() {
   const actionData = useActionData<ActionData>();
-  const data = useLoaderData();
+  const data = useLoaderData<typeof loader>();
 
   if (!data.authorized) {
     return <h1>Not Authorized</h1>;
@@ -145,7 +145,7 @@ export default function Index() {
 
           <button
             type="submit"
-            className="w-full rounded bg-blue-500  py-2 px-4 text-white hover:bg-blue-600 focus:bg-blue-400"
+            className="w-full rounded bg-blue-500  px-4 py-2 text-white hover:bg-blue-600 focus:bg-blue-400"
           >
             Create
           </button>

package.json

@@ -26,58 +26,59 @@
     "/public/build"
   ],
   "dependencies": {
-    "@prisma/client": "^4.5.0",
-    "@remix-run/node": "^1.7.2",
-    "@remix-run/react": "^1.7.2",
-    "@remix-run/serve": "^1.7.2",
-    "@remix-run/server-runtime": "^1.7.2",
+    "@prisma/client": "^5.5.2",
+    "@remix-run/node": "^2.1.0",
+    "@remix-run/react": "^2.1.0",
+    "@remix-run/serve": "^2.1.0",
+    "@remix-run/server-runtime": "^2.1.0",
     "bcryptjs": "^2.4.3",
-    "isbot": "^3.6.3",
-    "nanoid": "^3.0.0",
+    "isbot": "^3.7.0",
+    "nanoid": "^5.0.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "tiny-invariant": "^1.3.1"
   },
   "devDependencies": {
-    "@faker-js/faker": "^7.6.0",
-    "@remix-run/dev": "^1.7.2",
-    "@remix-run/eslint-config": "^1.7.2",
-    "@testing-library/cypress": "^8.0.3",
-    "@testing-library/dom": "^8.19.0",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/react": "^13.4.0",
-    "@testing-library/user-event": "^14.4.3",
-    "@types/bcryptjs": "^2.4.2",
-    "@types/eslint": "^8.4.10",
-    "@types/node": "^18.11.9",
-    "@types/react": "^18.0.25",
-    "@types/react-dom": "^18.0.8",
-    "@vitejs/plugin-react": "^2.2.0",
+    "@faker-js/faker": "^8.2.0",
+    "@remix-run/dev": "^2.1.0",
+    "@remix-run/eslint-config": "^2.1.0",
+    "@testing-library/cypress": "^10.0.1",
+    "@testing-library/dom": "^9.3.3",
+    "@testing-library/jest-dom": "^6.1.4",
+    "@testing-library/react": "^14.0.0",
+    "@testing-library/user-event": "^14.5.1",
+    "@types/bcryptjs": "^2.4.5",
+    "@types/eslint": "^8.44.6",
+    "@types/node": "^20.8.9",
+    "@types/react": "^18.2.33",
+    "@types/react-dom": "^18.2.14",
+    "@vitejs/plugin-react": "^4.1.0",
     "@vitest/coverage-c8": "^0.24.5",
-    "autoprefixer": "^10.4.13",
+    "autoprefixer": "^10.4.16",
     "binode": "^1.0.5",
-    "c8": "^7.12.0",
+    "c8": "^8.0.1",
     "cookie": "^0.5.0",
     "cross-env": "^7.0.3",
-    "cypress": "^10.11.0",
-    "eslint": "^8.26.0",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-cypress": "^2.12.1",
-    "happy-dom": "^6.0.4",
-    "msw": "^0.47.4",
+    "cypress": "^13.4.0",
+    "eslint": "^8.52.0",
+    "eslint-config-prettier": "^9.0.0",
+    "eslint-plugin-cypress": "^2.15.1",
+    "happy-dom": "^12.10.3",
+    "msw": "^2.0.1",
+    "npm-check-updates": "^16.14.6",
     "npm-run-all": "^4.1.5",
-    "postcss": "^8.4.18",
-    "prettier": "2.7.1",
-    "prettier-plugin-tailwindcss": "^0.1.13",
-    "prisma": "^4.5.0",
-    "start-server-and-test": "^1.14.0",
-    "tailwindcss": "^3.2.2",
+    "postcss": "^8.4.31",
+    "prettier": "3.0.3",
+    "prettier-plugin-tailwindcss": "^0.5.6",
+    "prisma": "^5.5.2",
+    "start-server-and-test": "^2.0.1",
+    "tailwindcss": "^3.3.5",
     "ts-node": "^10.9.1",
-    "tsconfig-paths": "^4.1.0",
-    "typescript": "^4.8.4",
-    "vite": "^3.2.2",
-    "vite-tsconfig-paths": "^3.5.2",
-    "vitest": "^0.24.5"
+    "tsconfig-paths": "^4.2.0",
+    "typescript": "^5.2.2",
+    "vite": "^4.5.0",
+    "vite-tsconfig-paths": "^4.2.1",
+    "vitest": "^0.34.6"
   },
   "engines": {
     "node": ">=14"

start.sh

@@ -6,5 +6,20 @@
 # Learn more: https://community.fly.io/t/sqlite-not-getting-setup-properly/4386
 
 set -ex
+
+# Setup 512MB of space for swap and set permissions and turn on swapmode
+fallocate -l 512M /swapfile
+chmod 0600 /swapfile
+mkswap /swapfile
+echo 10 > /proc/sys/vm/swappiness
+swapon /swapfile
+
+# Run migrations
 npx prisma migrate deploy
-npm run start
+
+# Turn off swap mode and remove swap directory
+swapoff /swapfile
+rm /swapfile
+
+# Finally start the app
+npm run start