Remix v2 Prep remix-run/remix@@remix-run/[email protected]...@remix-r…

…un/[email protected]

app/_custom/routes/_site+/$siteId.collections+/readme.md

@@ -4,7 +4,7 @@
 
 ```
 import { useLoaderData } from "@remix-run/react";
-import { json, type LoaderArgs } from "@remix-run/node";
+import { json, type LoaderFunctionArgs } from "@remix-run/node";
 import { EntryHeader } from "~/routes/$siteId.collections+/$collectionId.$entryId/EntryHeader";
 import {
    EntryContent,
@@ -17,7 +17,7 @@ import {
 
 export { meta };
 
-export async function loader({ context: { payload }, params }: LoaderArgs) {
+export async function loader({ context: { payload }, params }: LoaderFunctionArgs) {
    // Get custom data here
    const entryDefault = await getDefaultEntryData({ payload, params });
    return json({ entryDefault });

app/modules/collections/entryDefaults.ts

@@ -1,4 +1,4 @@
-import type { V2_MetaFunction } from "@remix-run/node";
+import type { MetaFunction } from "@remix-run/node";
 import type { Params } from "@remix-run/react";
 import type { Payload } from "payload";
 import type { PaginatedDocs } from "payload/dist/mongoose/types";
@@ -161,7 +161,7 @@ export const getCustomEntryData = async ({
    );
 };
 
-export const meta: V2_MetaFunction = ({ matches, data }) => {
+export const meta: MetaFunction = ({ matches, data }) => {
    const siteName = matches.find(
       ({ id }) => id === "routes/_site+/$siteId+/_layout"
    )?.data?.site?.name;

app/root.tsx

@@ -1,10 +1,10 @@
-import { useEffect, lazy } from "react";
+import { useEffect } from "react";
 
 import { MetronomeLinks } from "@metronome-sh/react";
 import type {
-   V2_MetaFunction,
+   MetaFunction,
    LinksFunction,
-   LoaderArgs,
+   LoaderFunctionArgs,
 } from "@remix-run/node";
 import { json } from "@remix-run/node";
 import {
@@ -19,7 +19,6 @@ import {
 } from "@remix-run/react";
 import { Toaster } from "react-hot-toast";
 import { useTranslation } from "react-i18next";
-import rdtStylesheet from "remix-development-tools/stylesheet.css";
 
 import { settings } from "mana-config";
 import customStylesheetUrl from "~/_custom/styles.css";
@@ -41,13 +40,12 @@ import { i18nextServer } from "./utils/i18n";
 import { commitSession, getSession } from "./utils/message.server";
 import type { ToastMessage } from "./utils/message.server";
 
-const RemixDevTools = lazy(() => import("remix-development-tools"));
 
 export const loader = async ({
    context: { user },
    request,
    params,
-}: LoaderArgs) => {
+}: LoaderFunctionArgs) => {
    const themeSession = await getThemeSession(request);
    const locale = await i18nextServer.getLocale(request);
    const session = await getSession(request.headers.get("cookie"));
@@ -74,7 +72,7 @@ export const loader = async ({
    );
 };
 
-export const meta: V2_MetaFunction = () => [
+export const meta: MetaFunction = () => [
    { title: settings.title },
    { charSet: "utf-8" },
 ];
@@ -112,10 +110,6 @@ export const links: LinksFunction = () => [
       }.mana.wiki`,
    },
 
-   //Remix Devtools
-   ...(rdtStylesheet && process.env.NODE_ENV === "development"
-      ? [{ rel: "stylesheet", href: rdtStylesheet }]
-      : []),
 ];
 
 export const handle = {
@@ -124,15 +118,15 @@ export const handle = {
 };
 
 function App() {
-   const { locale, siteTheme, toastMessage, isMobileApp } =
+   const { locale, siteTheme, toastMessage } =
       useLoaderData<typeof loader>();
    const [theme] = useTheme();
    const { i18n } = useTranslation();
    const isBot = useIsBot();
    useChangeLanguage(locale);
 
    //site data should live in layout, this may be potentially brittle if we shift site architecture around
-   const site = useMatches()?.[1]?.data?.site as Site;
+   const {site } = useMatches()?.[1]?.data as {site: Site};
    const favicon = site?.favicon?.url ?? site?.icon?.url ?? "/favicon.ico";
 
    useEffect(() => {
@@ -206,9 +200,6 @@ function App() {
             <ScrollRestoration />
             {isBot ? null : <Scripts />}
             <LiveReload />
-            {/* {process.env.NODE_ENV === "development" && !isMobileApp && (
-               <RemixDevTools />
-            )} */}
          </body>
       </html>
    );

app/routes/_auth+/check-email.tsx

@@ -1,17 +1,17 @@
-import type { LoaderArgs, V2_MetaFunction } from "@remix-run/node";
+import type { LoaderFunctionArgs, MetaFunction } from "@remix-run/node";
 import { redirect } from "@remix-run/node";
 import { Mail } from "lucide-react";
 import { useTranslation } from "react-i18next";
 
-export async function loader({ context: { user }, request }: LoaderArgs) {
+export async function loader({ context: { user }, request }: LoaderFunctionArgs) {
    if (user) {
       return redirect("/");
    }
    return null;
 }
 
 //TODO Fix server side translation
-export const meta: V2_MetaFunction = () => {
+export const meta: MetaFunction = () => {
    return [
       {
          title: "Check Email - Mana",

app/routes/_auth+/join.tsx

@@ -1,8 +1,8 @@
 import type {
    ActionFunction,
    LinksFunction,
-   LoaderArgs,
-   V2_MetaFunction,
+   LoaderFunctionArgs,
+   MetaFunction,
 } from "@remix-run/node";
 import { redirect, json } from "@remix-run/node";
 import {
@@ -28,7 +28,7 @@ import {
 } from "~/utils";
 import { i18nextServer } from "~/utils/i18n";
 
-export async function loader({ context: { user }, request }: LoaderArgs) {
+export async function loader({ context: { user }, request }: LoaderFunctionArgs) {
    if (user) {
       return redirect("/");
    }
@@ -61,7 +61,7 @@ export const links: LinksFunction = () => {
    return [{ rel: "canonical", href: `${settings.domainFull}/join` }];
 };
 
-export const meta: V2_MetaFunction = ({ data }) => {
+export const meta: MetaFunction = ({ data }) => {
    return [
       {
          title: `${data.title} - Mana`,

app/routes/_auth+/login.tsx

@@ -3,8 +3,8 @@ import { useState } from "react";
 import type {
    ActionFunction,
    LinksFunction,
-   LoaderArgs,
-   V2_MetaFunction,
+   LoaderFunctionArgs,
+   MetaFunction,
 } from "@remix-run/node";
 import { redirect, json } from "@remix-run/node";
 import {
@@ -55,7 +55,7 @@ const PasswordResetSchema = z.object({
       .transform((email) => email.toLowerCase()),
 });
 
-export async function loader({ context: { user }, request }: LoaderArgs) {
+export async function loader({ context: { user }, request }: LoaderFunctionArgs) {
    if (user) {
       return redirect("/");
    }
@@ -73,7 +73,7 @@ export const links: LinksFunction = () => {
    return [{ rel: "canonical", href: `${settings.domainFull}/login` }];
 };
 
-export const meta: V2_MetaFunction = ({ data }) => {
+export const meta: MetaFunction = ({ data }) => {
    return [
       {
          title: `${data.title} - Mana`,

app/routes/_auth+/reset-password.tsx

@@ -1,7 +1,7 @@
 import type {
    ActionFunction,
-   LoaderArgs,
-   V2_MetaFunction,
+   LoaderFunctionArgs,
+   MetaFunction,
 } from "@remix-run/node";
 import { redirect, json } from "@remix-run/node";
 import { Form, useNavigation, useSearchParams } from "@remix-run/react";
@@ -28,7 +28,7 @@ const PasswordResetSchema = z.object({
    token: z.string(),
 });
 
-export async function loader({ context: { user }, request }: LoaderArgs) {
+export async function loader({ context: { user }, request }: LoaderFunctionArgs) {
    if (user) {
       return redirect("/");
    }
@@ -37,7 +37,7 @@ export async function loader({ context: { user }, request }: LoaderArgs) {
    return json({ title });
 }
 
-export const meta: V2_MetaFunction = ({ data }) => {
+export const meta: MetaFunction = ({ data }) => {
    return [
       {
          title: `${data.title} - Mana`,

app/routes/_auth+/verify.tsx

@@ -1,4 +1,4 @@
-import type { LoaderArgs, V2_MetaFunction } from "@remix-run/node";
+import type { LoaderFunctionArgs, MetaFunction } from "@remix-run/node";
 import { redirect } from "@remix-run/node";
 import { Check } from "lucide-react";
 import { useTranslation } from "react-i18next";
@@ -10,7 +10,7 @@ import { commitSession, getSession, setSuccessMessage } from "~/utils";
 export async function loader({
    context: { payload, user },
    request,
-}: LoaderArgs) {
+}: LoaderFunctionArgs) {
    if (user) {
       return redirect("/");
    }
@@ -36,7 +36,7 @@ export async function loader({
 }
 
 //TODO Fix server side translation
-export const meta: V2_MetaFunction = () => {
+export const meta: MetaFunction = () => {
    return [
       {
          title: "Verify Email - Mana",

app/routes/_editor+/$siteId.blocks+/image/_image.ts

@@ -1,4 +1,4 @@
-import { type ActionArgs, json, redirect } from "@remix-run/node";
+import { type ActionFunctionArgs, json, redirect } from "@remix-run/node";
 import { z } from "zod";
 import { zx } from "zodix";
 
@@ -7,7 +7,7 @@ import { assertIsPost, getMultipleFormData, uploadImage } from "~/utils";
 export async function action({
    context: { payload, user },
    request,
-}: ActionArgs) {
+}: ActionFunctionArgs) {
    const { intent } = await zx.parseForm(request, {
       intent: z.string(),
    });

app/routes/_editor+/$siteId.blocks+/link/_link.tsx

@@ -1,7 +1,7 @@
 import type { ReactNode } from "react";
 
 import { TrashIcon } from "@heroicons/react/20/solid";
-import type { LoaderArgs } from "@remix-run/node";
+import type { LoaderFunctionArgs } from "@remix-run/node";
 import { redirect } from "@remix-run/node";
 import { Link, useParams } from "@remix-run/react";
 import { request as gqlRequest, gql } from "graphql-request";
@@ -27,7 +27,7 @@ import type { CustomElement, LinkElement } from "../../functions/types";
 export async function loader({
    context: { payload, user },
    request,
-}: LoaderArgs) {
+}: LoaderFunctionArgs) {
    const { linkUrl } = zx.parseQuery(request, {
       linkUrl: z.string(),
    });
@@ -262,7 +262,7 @@ export const action = async ({
    context: { payload, user },
    request,
    params,
-}: LoaderArgs) => {
+}: LoaderFunctionArgs) => {
    if (!user || !user.id) throw redirect("/login", { status: 302 });
 
    const { intent } = await zx.parseForm(request, {

app/routes/_editor+/$siteId.blocks+/updates/_updates.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useState } from "react";
 
-import type { LoaderArgs } from "@remix-run/node";
+import type { LoaderFunctionArgs } from "@remix-run/node";
 import { redirect } from "@remix-run/node";
 import { useFetcher, useMatches } from "@remix-run/react";
 import dt from "date-and-time";
@@ -213,7 +213,7 @@ export const action = async ({
    context: { payload, user },
    request,
    params,
-}: LoaderArgs) => {
+}: LoaderFunctionArgs) => {
    if (!user || !user.id) throw redirect("/login", { status: 302 });
 
    const { intent } = await zx.parseForm(request, {

app/routes/_editor+/editor.tsx

@@ -9,7 +9,7 @@ import {
    verticalListSortingStrategy,
 } from "@dnd-kit/sortable";
 import { CSS } from "@dnd-kit/utilities";
-import { type ActionArgs, redirect } from "@remix-run/node";
+import { type ActionFunctionArgs, redirect } from "@remix-run/node";
 import isHotkey, { isKeyHotkey } from "is-hotkey";
 import { Trash } from "lucide-react";
 import { nanoid } from "nanoid";
@@ -552,7 +552,7 @@ function withShortcuts(editor: Editor) {
 export async function action({
    context: { payload, user },
    request,
-}: ActionArgs) {
+}: ActionFunctionArgs) {
    const { intent, intentType, siteId, pageId, collectionEntity, sectionId } =
       await zx.parseForm(request, {
          intent: z.string(),

app/routes/_home+/_index.tsx

@@ -1,14 +1,14 @@
 import { useEffect, useState } from "react";
 
 import { RadioGroup } from "@headlessui/react";
-import { json, type LinksFunction, type LoaderArgs } from "@remix-run/node";
+import { json, type LinksFunction, type LoaderFunctionArgs } from "@remix-run/node";
 import {
    Link,
    useLoaderData,
    useRouteLoaderData,
    useSearchParams,
 } from "@remix-run/react";
-import type { V2_MetaFunction } from "@remix-run/react";
+import type { MetaFunction } from "@remix-run/react";
 import AOS from "aos";
 import aosStyles from "aos/dist/aos.css";
 import clsx from "clsx";
@@ -36,15 +36,15 @@ import { Top } from "./components/top";
 import indexStyles from "./styles.css";
 import { FollowingListMobile } from "../_site+/$siteId+/components";
 
-export const meta: V2_MetaFunction = () => [
+export const meta: MetaFunction = () => [
    { title: "Mana - A new kind of wiki" },
 ];
 
 export async function loader({
    context: { payload, user },
    params,
    request,
-}: LoaderArgs) {
+}: LoaderFunctionArgs) {
    const { q, c, page } = zx.parseQuery(request, {
       q: z.string().optional(),
       c: z

app/routes/_home+/privacy.tsx

@@ -1,6 +1,6 @@
-import type { V2_MetaFunction } from "@remix-run/node";
+import type { MetaFunction } from "@remix-run/node";
 
-export const meta: V2_MetaFunction = () => {
+export const meta: MetaFunction = () => {
    return [
       {
          title: "Privacy Policy - Mana",

app/routes/_seo+/sitemap_index[.]xml.tsx

@@ -1,4 +1,4 @@
-import type { LoaderArgs } from "@remix-run/node";
+import type { LoaderFunctionArgs } from "@remix-run/node";
 
 import { settings } from "mana-config";
 
@@ -14,7 +14,7 @@ const toXmlSitemap = (urls: string[]) => {
     `;
 };
 
-export async function loader({ context: { payload } }: LoaderArgs) {
+export async function loader({ context: { payload } }: LoaderFunctionArgs) {
    try {
       const { docs } = await payload.find({
          collection: "sites",