yarn -> pnpm

Dockerfile

@@ -1,32 +1,21 @@
-FROM node:18 as base
+FROM node:18-slim AS base
+ENV PNPM_HOME="/pnpm"
+ENV PATH="$PNPM_HOME:$PATH"
+RUN corepack enable
+COPY . /app
+WORKDIR /app
 
-ARG NODE_ENV
-ARG HCAPTCHA_SITE_KEY
+FROM base AS prod-deps
+RUN pnpm install --prod --frozen-lockfile
 
-ENV NODE_ENV=${NODE_ENV}
-ENV HCAPTCHA_SITE_KEY=${HCAPTCHA_SITE_KEY}
+FROM base AS build
+RUN pnpm install --prod false --frozen-lockfile
+RUN pnpm run build
 
-FROM base as builder
-
-WORKDIR /home/node
-COPY package*.json ./
-
-COPY . .
-RUN yarn install
-RUN yarn build
-
-FROM base as runtime
-
-ENV NODE_ENV=production
-
-WORKDIR /home/node
-COPY package*.json  ./
-
-RUN yarn install --production
-COPY --from=builder /home/node/dist ./dist
-COPY --from=builder /home/node/build ./build
-COPY --from=builder /home/node/public ./public
+FROM base
+COPY --from=prod-deps /app/node_modules /app/node_modules
+COPY --from=build /app/dist /app/dist
+COPY --from=build /app/build /app/build
 
 EXPOSE 3000
-
-CMD ["yarn", "start"]
+CMD [ "pnpm", "start" ]

README.md

@@ -9,14 +9,14 @@ Powered by [Remix](https://remix.run) and [PayloadCMS](https://payloadcms.com).
 install the dependencies and generate the types:
 
 ```sh
-yarn
-yarn generate:types
+pnpm i
+pnpm generate:types
 ```
 
 Start the app in the dev environment:
 
 ```sh
-yarn dev
+pnpm dev
 ```
 
 OR:
@@ -30,13 +30,13 @@ docker compose up -d
 First, build your app for production:
 
 ```sh
-yarn build
+pnpm build
 ```
 
 Then run the app in production mode:
 
 ```sh
-yarn start
+pnpm start
 ```
 
 ### Fly.io Setup
@@ -66,8 +66,8 @@ Media files should be stored in a S3 bucket. Create a bucket at Cloudflare, AWS,
 To seed the database, run the following command in the docker container of the app:
 
 ```sh
-yarn seed
-# in development use yarn seed:dev
+pnpm seed
+# in development use pnpm seed:dev
 ```
 
 It will exexute the script `cms/seed/index.ts` which does:
@@ -79,27 +79,27 @@ It will exexute the script `cms/seed/index.ts` which does:
 To apply database migrations, run the following command in the docker container of the app:
 
 ```sh
-yarn payload migrate
+pnpm payload migrate
 
 # development:
-yarn payload:dev migrate
+pnpm payload:dev migrate
 
 # migrate down:
-yarn payload migrate:down
+pnpm payload migrate:down
 ```
 
 #### Dev: Create a new Migration
 
 ```sh
-yarn payload:dev migrate:create <name>
+pnpm payload:dev migrate:create <name>
 ```
 
 #### Regenerate Image Sizes
 
 If you need to generate the image sizes again, you can do that with the following command:
 
 ```sh
-yarn generate:images
+pnpm generate:images
 ```
 
 Make sure you have an `.env` file with `PAYLOAD_SECRET` and `MONGO_URL` defined.  

app/routes/_index.tsx

@@ -1,4 +1,4 @@
-import { redirect } from "@remix-run/router";
+import { redirect } from "@remix-run/node";
 
 /**
  * Redirect to /news

app/routes/auth.me.tsx

@@ -1,8 +1,11 @@
-import type { LoaderFunctionArgs } from "@remix-run/node";
-import { json } from "@remix-run/node";
+import {
+  json,
+  redirect,
+  type ActionFunctionArgs,
+  type ActionFunction,
+  type LoaderFunctionArgs,
+} from "@remix-run/node";
 import { Form, Link, useActionData, useLoaderData } from "@remix-run/react";
-import type { ActionArgs, ActionFunction } from "@remix-run/server-runtime";
-import { redirect } from "@remix-run/server-runtime";
 import { useTranslation } from "react-i18next";
 import classes from "./auth.module.css";
 import i18next from "~/i18next.server";
@@ -16,7 +19,7 @@ const ns = "auth";
 export const action: ActionFunction = async ({
   request,
   context: { payload, res },
-}: ActionArgs) => {
+}: ActionFunctionArgs) => {
   const form = await request.formData();
   const t = await i18next.getFixedT(request, ns);
 

cms/seed/index.ts

@@ -10,7 +10,7 @@ export async function seedCountries(payload: Payload) {
     payload.logger.info(`adding ${alpha2}`);
 
     // create item in fallback language if not already exists
-    const name = countries.getName(alpha2, fallbackLocale);
+    const name = countries.getName(alpha2, fallbackLocale) as string;
     try {
       await payload.create({
         collection: "countries",

package.json

@@ -39,13 +39,14 @@
     "axios": "^1.4.0",
     "compression": "^1.7.4",
     "cross-env": "^7.0.3",
+    "date-fns": "^2",
     "date-fns-tz": "^2.0.0",
     "dotenv": "^16.0.3",
     "email-validator": "^2.0.4",
     "express": "^4.18.2",
     "html-escaper": "^3.0.3",
     "i18n-iso-countries": "^7.6.0",
-    "i18next": "^22.4.10",
+    "i18next": "^23.1.0",
     "i18next-browser-languagedetector": "^7.0.1",
     "i18next-fs-backend": "^2.1.1",
     "i18next-http-backend": "^2.1.1",
@@ -57,12 +58,15 @@
     "react": "^18.2.0",
     "react-cookie-consent": "^8.0.1",
     "react-dom": "^18.2.0",
-    "react-i18next": "11",
+    "react-i18next": "14",
     "react-mailchimp-form": "^1.0.2",
     "react-player": "^2.12.0",
     "react-responsive-carousel": "^3.2.23",
+    "react-router-dom": "5",
     "remix-i18next": "^5.4.0",
     "schema-dts": "^1.1.2",
+    "slate": "^0.102.0",
+    "slate-react": "^0.102.0",
     "slugify": "^1.6.5",
     "tiny-invariant": "^1.3.1",
     "zod": "^3.21.4"
@@ -80,7 +84,7 @@
     "nodemon": "^2.0.20",
     "npm-run-all": "^4.1.5",
     "ts-node": "^10.9.1",
-    "typescript": "^4.9.5"
+    "typescript": "^5.1.0"
   },
   "engines": {
     "node": ">=18"