adopt @epic-web/config

kentcdodds · kentcdodds · commit 7923be98dc8a · 2024-05-29T14:23:51.000-06:00
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
diff --git a/.prettierrc.js b/.prettierrc.js
diff --git a/.vscode/extensions.json b/.vscode/extensions.json
@@ -1,11 +1,11 @@
 {
-  "recommendations": [
-    "bradlc.vscode-tailwindcss",
-    "dbaeumer.vscode-eslint",
-    "esbenp.prettier-vscode",
-    "prisma.prisma",
-    "qwtel.sqlite-viewer",
-    "yoavbls.pretty-ts-errors",
-    "github.vscode-github-actions"
-  ]
+	"recommendations": [
+		"bradlc.vscode-tailwindcss",
+		"dbaeumer.vscode-eslint",
+		"esbenp.prettier-vscode",
+		"prisma.prisma",
+		"qwtel.sqlite-viewer",
+		"yoavbls.pretty-ts-errors",
+		"github.vscode-github-actions"
+	]
 }
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -1,19 +1,19 @@
 {
-  "typescript.preferences.autoImportFileExcludePatterns": [
-    "@remix-run/server-runtime",
-    "@remix-run/router",
-    "express",
-    "@radix-ui/**",
-    "@react-email/**",
-    "react-router-dom",
-    "react-router",
-    "stream/consumers",
-    "node:stream/consumers",
-    "node:test",
-    "console",
-    "node:console"
-  ],
-  "workbench.editorAssociations": {
-    "*.db": "sqlite-viewer.view"
-  }
+	"typescript.preferences.autoImportFileExcludePatterns": [
+		"@remix-run/server-runtime",
+		"@remix-run/router",
+		"express",
+		"@radix-ui/**",
+		"@react-email/**",
+		"react-router-dom",
+		"react-router",
+		"stream/consumers",
+		"node:stream/consumers",
+		"node:test",
+		"console",
+		"node:console"
+	],
+	"workbench.editorAssociations": {
+		"*.db": "sqlite-viewer.view"
+	}
 }
diff --git a/app/components/ui/icon.tsx b/app/components/ui/icon.tsx
@@ -1,7 +1,7 @@
 import { type SVGProps } from 'react'
 import { cn } from '#app/utils/misc.tsx'
-import { type IconName } from '@/icon-name'
 import href from './icons/sprite.svg'
+import { type IconName } from '@/icon-name'
 
 export { href }
 export { IconName }
diff --git a/app/routes/_marketing+/index.tsx b/app/routes/_marketing+/index.tsx
@@ -50,13 +50,13 @@ export default function Index() {
 					</a>
 					<h1
 						data-heading
-						className="mt-8 animate-slide-top text-4xl font-medium text-foreground [animation-fill-mode:backwards] [animation-delay:0.3s] md:text-5xl xl:mt-4 xl:animate-slide-left xl:text-6xl xl:[animation-fill-mode:backwards] xl:[animation-delay:0.8s]"
+						className="mt-8 animate-slide-top text-4xl font-medium text-foreground [animation-delay:0.3s] [animation-fill-mode:backwards] md:text-5xl xl:mt-4 xl:animate-slide-left xl:text-6xl xl:[animation-delay:0.8s] xl:[animation-fill-mode:backwards]"
 					>
 						<a href="https://www.epicweb.dev/stack">The Epic Stack</a>
 					</h1>
 					<p
 						data-paragraph
-						className="mt-6 animate-slide-top text-xl/7 text-muted-foreground [animation-fill-mode:backwards] [animation-delay:0.8s] xl:mt-8 xl:animate-slide-left xl:text-xl/6 xl:leading-10 xl:[animation-fill-mode:backwards] xl:[animation-delay:1s]"
+						className="mt-6 animate-slide-top text-xl/7 text-muted-foreground [animation-delay:0.8s] [animation-fill-mode:backwards] xl:mt-8 xl:animate-slide-left xl:text-xl/6 xl:leading-10 xl:[animation-delay:1s] xl:[animation-fill-mode:backwards]"
 					>
 						Check the{' '}
 						<a
diff --git a/app/routes/resources+/theme-switch.tsx b/app/routes/resources+/theme-switch.tsx
@@ -1,14 +1,8 @@
 import { useForm, getFormProps } from '@conform-to/react'
 import { parseWithZod } from '@conform-to/zod'
 import { invariantResponse } from '@epic-web/invariant'
-import {
-	json,
-	type ActionFunctionArgs,
-} from '@remix-run/node'
-import {
-	useFetcher,
-	useFetchers,
-} from '@remix-run/react'
+import { json, type ActionFunctionArgs } from '@remix-run/node'
+import { useFetcher, useFetchers } from '@remix-run/react'
 import { z } from 'zod'
 import { Icon } from '#app/components/ui/icon.tsx'
 import { useHints } from '#app/utils/client-hints.tsx'
@@ -35,7 +29,11 @@ export async function action({ request }: ActionFunctionArgs) {
 	return json({ result: submission.reply() }, responseInit)
 }
 
-export function ThemeSwitch({ userPreference }: { userPreference?: Theme | null }) {
+export function ThemeSwitch({
+	userPreference,
+}: {
+	userPreference?: Theme | null
+}) {
 	const fetcher = useFetcher<typeof action>()
 
 	const [form] = useForm({
@@ -66,7 +64,11 @@ export function ThemeSwitch({ userPreference }: { userPreference?: Theme | null
 	}
 
 	return (
-		<fetcher.Form method="POST" {...getFormProps(form)} action="/resources/theme-switch">
+		<fetcher.Form
+			method="POST"
+			{...getFormProps(form)}
+			action="/resources/theme-switch"
+		>
 			<input type="hidden" name="theme" value={nextMode} />
 			<div className="flex gap-2">
 				<button
@@ -86,7 +88,9 @@ export function ThemeSwitch({ userPreference }: { userPreference?: Theme | null
  */
 export function useOptimisticThemeMode() {
 	const fetchers = useFetchers()
-	const themeFetcher = fetchers.find(f => f.formAction === '/resources/theme-switch')
+	const themeFetcher = fetchers.find(
+		f => f.formAction === '/resources/theme-switch',
+	)
 
 	if (themeFetcher && themeFetcher.formData) {
 		const submission = parseWithZod(themeFetcher.formData, {
@@ -111,4 +115,4 @@ export function useTheme() {
 		return optimisticMode === 'system' ? hints.theme : optimisticMode
 	}
 	return requestInfo.userPrefs.theme ?? hints.theme
-}
+}
diff --git a/components.json b/components.json
@@ -1,15 +1,15 @@
 {
-  "$schema": "https://ui.shadcn.com/schema.json",
-  "style": "default",
-  "rsc": false,
-  "tailwind": {
-    "config": "tailwind.config.ts",
-    "css": "app/styles/tailwind.css",
-    "baseColor": "slate",
-    "cssVariables": true
-  },
-  "aliases": {
-    "components": "#app/components",
-    "utils": "#app/utils/misc.tsx"
-  }
+	"$schema": "https://ui.shadcn.com/schema.json",
+	"style": "default",
+	"rsc": false,
+	"tailwind": {
+		"config": "tailwind.config.ts",
+		"css": "app/styles/tailwind.css",
+		"baseColor": "slate",
+		"cssVariables": true
+	},
+	"aliases": {
+		"components": "#app/components",
+		"utils": "#app/utils/misc.tsx"
+	}
 }
diff --git a/docs/database.md b/docs/database.md
@@ -341,7 +341,8 @@ You've got a few options:
 
    2. Commit this change and deploy the app to fly.
       - This will make sure that after building the dockerfile and deploying it
-        to the fly machine, `npx prisma migrate deploy` and `npm start` commands won't be executed.
+        to the fly machine, `npx prisma migrate deploy` and `npm start` commands
+        won't be executed.
    3. Now that the main machine is up and running, you can SSH into it by
       running `fly ssh console --app [YOUR_APP_NAME]` in the terminal.
    4. Create a backup of the DB and download it by following the steps mentioned
diff --git a/docs/decisions/011-sitemaps.md b/docs/decisions/011-sitemaps.md
@@ -4,8 +4,9 @@ Date: 2023-06-05
 
 Status: deprecated
 
-> Update: The contribution in [#456](https://github.com/epicweb-dev/epic-stack/pull/456)
-> made it quite easy to handle a sitemap so this decision has been reversed.
+> Update: The contribution in
+> [#456](https://github.com/epicweb-dev/epic-stack/pull/456) made it quite easy
+> to handle a sitemap so this decision has been reversed.
 
 ## Context
 
diff --git a/docs/deployment.md b/docs/deployment.md
@@ -151,7 +151,12 @@ You can keep the `Dockerfile` and `.dockerignore` in the root if you prefer,
 just make sure to remove the move step from the `.github/workflows/deploy.yml`.
 
 ## Deploying locally using docker/podman
-If you'd like to deploy locally by building a docker container image, you definitely can. For that you need to make some minimal changes to the Dockerfile located at other/Dockerfile. Remove everything from the line that says (#prepare for litefs) in "other/Dockerfile" till the end of file and swap with the contents below.
+
+If you'd like to deploy locally by building a docker container image, you
+definitely can. For that you need to make some minimal changes to the Dockerfile
+located at other/Dockerfile. Remove everything from the line that says (#prepare
+for litefs) in "other/Dockerfile" till the end of file and swap with the
+contents below.
 
 ```
 # prepare for litefs
@@ -162,11 +167,14 @@ EXPOSE ${PORT}
 ENTRYPOINT ["/myapp/other/docker-entry-point.sh"]
 ```
 
-There are 2 things that we are doing here. 
+There are 2 things that we are doing here.
+
 1. docker volume is used to swap out the fly.io litefs mount.
-2. Docker ENTRYPOINT is used to execute some commands upon launching of the docker container
+2. Docker ENTRYPOINT is used to execute some commands upon launching of the
+   docker container
 
 Create a file at other/docker-entry-point.sh with the contents below.
+
 ```
 #!/bin/sh -ex
 
@@ -175,9 +183,12 @@ sqlite3 /litefs/data/sqlite.db "PRAGMA journal_mode = WAL;"
 sqlite3 /litefs/data/cache.db "PRAGMA journal_mode = WAL;"
 npm run start
 ```
-This takes care of applying the prisma migrations, followed by launching the node application (on port 8081). 
+
+This takes care of applying the prisma migrations, followed by launching the
+node application (on port 8081).
 
 Helpful commands:
+
 ```
 docker build -t epic-stack . -f other/Dockerfile --build-arg COMMIT_SHA=`git rev-parse --short HEAD` # builds the docker container
 mkdir ~/litefs # mountpoint for your sqlite databases
diff --git a/docs/examples.md b/docs/examples.md
@@ -62,8 +62,8 @@ This page links to examples of how to implement some things with the Epic Stack.
 - [Epic Stack + Argos](https://github.com/jsfez/epic-stack-with-argos) by
   [@jsfez](https://github.com/jsfez): An example of the Epic Stack with
   [Argos](https://www.argos-ci.com/) for visual testing
-- [Epic Stack with Nx](https://github.com/isaacplmann/epic-stack-with-nx):
-  An example of using [Nx](https://nx.dev) in an Epic Stack app
+- [Epic Stack with Nx](https://github.com/isaacplmann/epic-stack-with-nx): An
+  example of using [Nx](https://nx.dev) in an Epic Stack app
 - [Epic Stack monorepo with pnpm + turbo](https://github.com/abetoots/epic-stack-turborepo):
   An example of the Epic Stack in a monorepo setup
 - [Epic Stack + passkeys/webauthn](https://github.com/rperon/epic-stack-with-passkeys/)
diff --git a/eslint.config.js b/eslint.config.js
@@ -0,0 +1,7 @@
+import { default as defaultConfig } from '@epic-web/config/eslint'
+
+/** @type {import("eslint").Linter.Config} */
+export default [
+	...defaultConfig,
+	// add custom config objects here:
+]
diff --git a/other/sly/sly.json b/other/sly/sly.json
@@ -1,11 +1,11 @@
 {
-  "$schema": "https://sly-cli.fly.dev/registry/config.json",
-  "libraries": [
-    {
-      "name": "@radix-ui/icons",
-      "directory": "./other/svg-icons",
-      "postinstall": ["npm", "run", "build:icons"],
-      "transformers": ["transform-icon.ts"]
-    }
-  ]
+	"$schema": "https://sly-cli.fly.dev/registry/config.json",
+	"libraries": [
+		{
+			"name": "@radix-ui/icons",
+			"directory": "./other/svg-icons",
+			"postinstall": ["npm", "run", "build:icons"],
+			"transformers": ["transform-icon.ts"]
+		}
+	]
 }
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
diff --git a/tsconfig.json b/tsconfig.json
diff --git a/vite.config.ts b/vite.config.ts
