Skip to content

Commit

Permalink
adopt @epic-web/config
Browse files Browse the repository at this point in the history
  • Loading branch information
kentcdodds committed May 29, 2024
1 parent b26b673 commit 7923be9
Show file tree
Hide file tree
Showing 18 changed files with 904 additions and 1,337 deletions.
85 changes: 0 additions & 85 deletions .eslintrc.cjs

This file was deleted.

30 changes: 0 additions & 30 deletions .prettierrc.js

This file was deleted.

18 changes: 9 additions & 9 deletions .vscode/extensions.json
Original file line number Diff line number Diff line change
@@ -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"
]
}
34 changes: 17 additions & 17 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -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"
}
}
2 changes: 1 addition & 1 deletion app/components/ui/icon.tsx
Original file line number Diff line number Diff line change
@@ -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 }
Expand Down
4 changes: 2 additions & 2 deletions app/routes/_marketing+/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
28 changes: 16 additions & 12 deletions app/routes/resources+/theme-switch.tsx
Original file line number Diff line number Diff line change
@@ -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'
Expand All @@ -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({
Expand Down Expand Up @@ -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
Expand All @@ -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, {
Expand All @@ -111,4 +115,4 @@ export function useTheme() {
return optimisticMode === 'system' ? hints.theme : optimisticMode
}
return requestInfo.userPrefs.theme ?? hints.theme
}
}
26 changes: 13 additions & 13 deletions components.json
Original file line number Diff line number Diff line change
@@ -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"
}
}
3 changes: 2 additions & 1 deletion docs/database.md
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
5 changes: 3 additions & 2 deletions docs/decisions/011-sitemaps.md
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand Down
19 changes: 15 additions & 4 deletions docs/deployment.md
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand All @@ -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
Expand All @@ -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
Expand Down
4 changes: 2 additions & 2 deletions docs/examples.md
Original file line number Diff line number Diff line change
Expand Up @@ -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/)
Expand Down
7 changes: 7 additions & 0 deletions eslint.config.js
Original file line number Diff line number Diff line change
@@ -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:
]
18 changes: 9 additions & 9 deletions other/sly/sly.json
Original file line number Diff line number Diff line change
@@ -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"]
}
]
}
Loading

0 comments on commit 7923be9

Please sign in to comment.