Revert back to working v1 state :/

This reverts commit 524946f.
This reverts commit b1248b5.
This reverts commit 9b26b2e.
This reverts commit 9413eb1.
This reverts commit 9eb2980.

.eslintrc.js

@@ -1,106 +1,4 @@
-/**
- * This is intended to be a basic starting point for linting in the Indie Stack.
- * It relies on recommended configs out of the box for simplicity, but you can
- * and should modify this configuration to best suit your team's needs.
- */
-
 /** @type {import('eslint').Linter.Config} */
 module.exports = {
-  root: true,
-  parserOptions: {
-    ecmaVersion: 'latest',
-    sourceType: 'module',
-    ecmaFeatures: {
-      jsx: true,
-    },
-  },
-  env: {
-    browser: true,
-    commonjs: true,
-    es6: true,
-  },
-
-  // Base config
-  extends: ['eslint:recommended'],
-
-  overrides: [
-    // React
-    {
-      files: ['**/*.{js,jsx,ts,tsx}'],
-      plugins: ['react', 'jsx-a11y'],
-      extends: [
-        'plugin:react/recommended',
-        'plugin:react/jsx-runtime',
-        'plugin:react-hooks/recommended',
-        'plugin:jsx-a11y/recommended',
-        'prettier',
-      ],
-      settings: {
-        react: {
-          version: 'detect',
-        },
-        formComponents: ['Form'],
-        linkComponents: [
-          { name: 'Link', linkAttribute: 'to' },
-          { name: 'NavLink', linkAttribute: 'to' },
-        ],
-      },
-      rules: {
-        'react/jsx-no-leaked-render': [
-          'warn',
-          { validStrategies: ['ternary'] },
-        ],
-      },
-    },
-
-    // Typescript
-    {
-      files: ['**/*.{ts,tsx}'],
-      plugins: ['@typescript-eslint', 'import'],
-      parser: '@typescript-eslint/parser',
-      settings: {
-        'import/internal-regex': '^~/',
-        'import/resolver': {
-          node: {
-            extensions: ['.ts', '.tsx'],
-          },
-          typescript: {
-            alwaysTryTypes: true,
-          },
-        },
-      },
-      extends: [
-        'plugin:@typescript-eslint/recommended',
-        'plugin:@typescript-eslint/stylistic',
-        'plugin:import/recommended',
-        'plugin:import/typescript',
-        'prettier',
-      ],
-      rules: {
-        'import/order': [
-          'error',
-          {
-            alphabetize: { caseInsensitive: true, order: 'asc' },
-            groups: ['builtin', 'external', 'internal', 'parent', 'sibling'],
-            'newlines-between': 'always',
-          },
-        ],
-      },
-    },
-
-    // Markdown
-    // {
-    //   files: ['**/*.md'],
-    //   plugins: ['markdown'],
-    //   extends: ['plugin:markdown/recommended', 'prettier'],
-    // },
-
-    // Node
-    {
-      files: ['.eslintrc.js', 'mocks/**/*.js'],
-      env: {
-        node: true,
-      },
-    },
-  ],
+  extends: ['@remix-run/eslint-config', '@remix-run/eslint-config/node'],
 };

.github/workflows/fly-deploy.yml

@@ -11,24 +11,8 @@ concurrency:
   cancel-in-progress: true
 
 jobs:
-  validate:
-    name: '✅ Validate'
-    runs-on: ubuntu-latest
-    steps:
-      - name: ⬇️ Checkout repo
-        uses: actions/checkout@v4
-
-      - name: ⎔ Setup node
-        uses: actions/setup-node@v3
-
-      - name: 📥 Install deps
-        run: npm ci
-
-      - run: npm run validate
-
   deploy:
-    name: '🚀 Deploy'
-    needs: validate
+    name: Deploy
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v2

Dockerfile

@@ -1,11 +1,11 @@
-FROM node:18-alpine as build
+FROM node:16-alpine as build
 WORKDIR /brophy.org
 COPY package.json package-lock.json ./
 RUN npm ci
 COPY . .
 RUN npm run build
 
-FROM node:18-alpine as production
+FROM node:16-alpine as production
 WORKDIR /brophy.org
 COPY --from=build /brophy.org/package.json /brophy.org/package-lock.json ./
 COPY --from=build /brophy.org/node_modules ./node_modules

app/components/CircleLinks.tsx

@@ -1,5 +1,4 @@
 import { Link } from '@remix-run/react';
-
 import ExternalLink from './ExternalLink';
 
 interface LinkBodyProps {

app/components/PostList.tsx

@@ -1,12 +1,10 @@
 import { Link } from '@remix-run/react';
-
 import type { Post } from '~/ts/post-api';
-
 import PostMeta from './PostMeta';
 
-interface PostListProps {
+type PostListProps = {
   posts: Post[];
-}
+};
 
 export default function PostList({ posts }: PostListProps) {
   return (

app/components/PostMeta.tsx

@@ -1,20 +1,17 @@
 import { Link } from '@remix-run/react';
-
 import type { Post } from '~/ts/post-api';
 
-interface PostMetaProps {
+type PostMetaProps = {
   post: Post;
-}
+};
 
 export default function PostMeta({ post }: PostMetaProps) {
   let formattedDate = post.postDate;
   try {
     const date = new Date(post.postDate);
     const [, month, day, year] = date.toDateString().split(' ');
     formattedDate = `${month} ${day}, ${year}`;
-  } catch (e) {
-    // No-op
-  }
+  } catch (e) {}
 
   return (
     <p className="post-meta">

app/components/PostNav.tsx

@@ -1,16 +1,15 @@
 import { Link } from '@remix-run/react';
-
 import type { Post } from '~/ts/post-api';
 
-interface PostNavProps {
+type PostNavProps = {
   previousPost?: Post;
   nextPost?: Post;
-}
+};
 
 export default function PostNav({ previousPost, nextPost }: PostNavProps) {
   return (
     <div className="c-post-nav">
-      {previousPost ? (
+      {previousPost && (
         <div className="c-post-nav__link c-post-nav__link--previous">
           <Link
             className="c-post-nav__link-arrow"
@@ -27,9 +26,9 @@ export default function PostNav({ previousPost, nextPost }: PostNavProps) {
             {previousPost.title}
           </Link>
         </div>
-      ) : null}
+      )}
 
-      {nextPost ? (
+      {nextPost && (
         <div className="c-post-nav__link c-post-nav__link--next">
           <Link
             to={nextPost.permalink}
@@ -46,7 +45,7 @@ export default function PostNav({ previousPost, nextPost }: PostNavProps) {
             ⏩
           </Link>
         </div>
-      ) : null}
+      )}
     </div>
   );
 }

app/root.tsx

@@ -1,4 +1,5 @@
-import type { MetaFunction, LinksFunction } from '@remix-run/node';
+import type { V2_MetaFunction } from '@remix-run/node';
+import type { LinksFunction } from '@remix-run/node';
 import {
   Links,
   LiveReload,
@@ -7,10 +8,9 @@ import {
   Scripts,
   ScrollRestoration,
 } from '@remix-run/react';
-
 import appStyles from '~/styles/app.css';
 
-export const meta: MetaFunction = () => {
+export const meta: V2_MetaFunction = () => {
   return [
     { name: 'charset', content: 'utf-8' },
     { name: 'viewport', content: 'width=device-width, initial-scale=1' },
@@ -48,7 +48,7 @@ export default function App() {
         <Outlet />
         <ScrollRestoration />
         <Scripts />
-        {process.env.NODE_ENV === 'development' ? <LiveReload /> : null}
+        {process.env.NODE_ENV === 'development' && <LiveReload />}
       </body>
     </html>
   );

app/routes/_default.post.$slug.tsx

@@ -1,7 +1,8 @@
+import { useEffect } from 'react';
 import type {
   LinksFunction,
   LoaderFunction,
-  MetaFunction,
+  V2_MetaFunction,
 } from '@remix-run/node';
 import { json } from '@remix-run/node';
 import {
@@ -10,33 +11,31 @@ import {
   useLoaderData,
   useRouteError,
 } from '@remix-run/react';
-import { useEffect } from 'react';
 import invariant from 'tiny-invariant';
-
 import ExternalLink from '~/components/ExternalLink';
 import PostMeta from '~/components/PostMeta';
 import PostNav from '~/components/PostNav';
-import { meta as rootMeta } from '~/root';
-import prismStyles from '~/styles/prism.css';
-import { getPost, getPosts } from '~/ts/post-api';
 import type { FullPost, Post } from '~/ts/post-api';
+import { getPost, getPosts } from '~/ts/post-api';
+import prismStyles from '~/styles/prism.css';
 
-interface LoaderData {
+type LoaderData = {
   post: FullPost;
   previousPost: Post;
   nextPost: Post;
-}
+};
 
-export const meta: MetaFunction<typeof loader> = ({ data, matches }) => {
+export const meta: V2_MetaFunction<typeof loader, { root: any }> = ({
+  data,
+  matches,
+}) => {
   if (!data?.post) {
     return [{ title: 'Error' }];
   }
 
-  const rootMatchMeta = matches[0].meta as ReturnType<typeof rootMeta>;
   return [
-    ...rootMatchMeta.filter(
-      (m) => !('title' in m) && 'name' in m && m.name !== 'description'
-    ),
+    // @ts-expect-error
+    ...matches[0].meta.filter((o) => !o.title && o.name !== 'description'),
     { title: data.post.title },
     { name: 'og:title', content: data.post.title },
     { name: 'twitter:title', content: data.post.title },
@@ -96,9 +95,7 @@ export default function PostView() {
 
   useEffect(() => {
     if (document.querySelectorAll('.codepen').length === 0) {
-      return () => {
-        // no-op
-      };
+      return () => {};
     }
     const el = document.createElement('script');
     el.src = 'https://static.codepen.io/assets/embed/ei.js';
@@ -145,7 +142,7 @@ export default function PostView() {
 }
 
 export function ErrorBoundary() {
-  const error = useRouteError();
+  let error = useRouteError();
   if (isRouteErrorResponse(error)) {
     if (error.status === 404) {
       return (

app/routes/_default.posts.tsx

@@ -1,13 +1,12 @@
 import type { LoaderFunction } from '@remix-run/node';
 import { useLoaderData } from '@remix-run/react';
-
 import PostList from '~/components/PostList';
 import type { Post } from '~/ts/post-api';
 import { getPosts } from '~/ts/post-api';
 
-interface LoaderData {
+type LoaderData = {
   posts: Post[];
-}
+};
 
 export const loader: LoaderFunction = async (): Promise<LoaderData> => {
   const posts = await getPosts();

app/routes/_default.tag.$tag.tsx

@@ -1,15 +1,14 @@
 import type { LoaderFunction } from '@remix-run/node';
 import { useLoaderData } from '@remix-run/react';
 import invariant from 'tiny-invariant';
-
 import PostList from '~/components/PostList';
 import type { Post } from '~/ts/post-api';
 import { getPosts } from '~/ts/post-api';
 
-interface LoaderData {
+type LoaderData = {
   tag: string;
   posts: Post[];
-}
+};
 
 export const loader: LoaderFunction = async ({
   params,