chore: Add remix-1-7 package to keep compatibility with older Remix

seasonedcc · May 3, 2024 · ffcb866 · ffcb866
1 parent 6a1b0c7
commit ffcb866
Show file tree

Hide file tree

Showing 17 changed files with 776 additions and 320 deletions.
diff --git a/apps/remix-1-7/.eslintrc.cjs b/apps/remix-1-7/.eslintrc.cjs
@@ -0,0 +1,6 @@
+const path = require('path')
+
+module.exports = {
+ extends: path.resolve(__dirname, '../../.eslintrc.base.js'),
+ rules: {},
+}
diff --git a/apps/remix-1-7/.gitignore b/apps/remix-1-7/.gitignore
@@ -0,0 +1,6 @@
+node_modules
+
+/.cache
+/build
+/public/build
+.env
diff --git a/apps/remix-1-7/.prettierignore b/apps/remix-1-7/.prettierignore
@@ -0,0 +1,7 @@
+node_modules
+build
+public/build
+dist
+tsc
+*.css
+*.html
diff --git a/apps/remix-1-7/README.md b/apps/remix-1-7/README.md
@@ -0,0 +1,53 @@
+# Welcome to Remix!
+
+- [Remix Docs](https://remix.run/docs)
+
+## Development
+
+From your terminal:
+
+```sh
+npm run dev
+```
+
+This starts your app in development mode, rebuilding assets on file changes.
+
+## Deployment
+
+First, build your app for production:
+
+```sh
+npm run build
+```
+
+Then run the app in production mode:
+
+```sh
+npm start
+```
+
+Now you'll need to pick a host to deploy it to.
+
+### DIY
+
+If you're familiar with deploying node applications, the built-in Remix app server is production-ready.
+
+Make sure to deploy the output of `remix build`
+
+- `build/`
+- `public/build/`
+
+### Using a Template
+
+When you ran `npx create-remix@latest` there were a few choices for hosting. You can run that again to create a new project, then copy over your `app/` folder to the new project that's pre-configured for your target server.
+
+```sh
+cd ..
+# create a new project, and pick a pre-configured host
+npx create-remix@latest
+cd my-new-remix-app
+# remove the new project's app (not the old one!)
+rm -rf app
+# copy your app over
+cp -R ../my-old-remix-app/app app
+```
diff --git a/apps/remix-1-7/app/entry.client.tsx b/apps/remix-1-7/app/entry.client.tsx
@@ -0,0 +1,4 @@
+import { hydrate } from 'react-dom'
+import { RemixBrowser } from '@remix-run/react'
+
+hydrate(<RemixBrowser />, document)
diff --git a/apps/remix-1-7/app/entry.server.tsx b/apps/remix-1-7/app/entry.server.tsx
@@ -0,0 +1,21 @@
+import type { EntryContext } from '@remix-run/node'
+import { RemixServer } from '@remix-run/react'
+import { renderToString } from 'react-dom/server'
+
+export default function handleRequest(
+ request: Request,
+ responseStatusCode: number,
+ responseHeaders: Headers,
+ remixContext: EntryContext,
+) {
+ const markup = renderToString(
+ <RemixServer context={remixContext} url={request.url} />,
+ )
+
+ responseHeaders.set('Content-Type', 'text/html')
+
+ return new Response('<!DOCTYPE html>' + markup, {
+ status: responseStatusCode,
+ headers: responseHeaders,
+ })
+}
diff --git a/apps/remix-1-7/app/formAction.ts b/apps/remix-1-7/app/formAction.ts
@@ -0,0 +1,6 @@
+import { json, redirect } from '@remix-run/node'
+import { createFormAction } from 'remix-forms'
+
+const formAction = createFormAction({ redirect, json })
+
+export { formAction }
diff --git a/apps/remix-1-7/app/root.tsx b/apps/remix-1-7/app/root.tsx
@@ -0,0 +1,27 @@
+import {
+ Links,
+ LiveReload,
+ Meta,
+ Outlet,
+ Scripts,
+ ScrollRestoration,
+} from '@remix-run/react'
+
+export default function App() {
+ return (
+ <html lang="en">
+ <head>
+ <meta charSet="utf-8" />
+ <meta name="viewport" content="width=device-width,initial-scale=1" />
+ <Meta />
+ <Links />
+ </head>
+ <body>
+ <Outlet />
+ <ScrollRestoration />
+ <Scripts />
+ <LiveReload />
+ </body>
+ </html>
+ )
+}
diff --git a/apps/remix-1-7/app/routes/index.tsx b/apps/remix-1-7/app/routes/index.tsx
@@ -0,0 +1,23 @@
+import { makeDomainFunction } from 'domain-functions'
+import type { ActionArgs } from '@remix-run/node'
+import { z } from 'zod'
+import { formAction } from '../formAction'
+import { Form } from '../ui/form'
+
+const schema = z.object({
+ firstName: z.string().min(1),
+ email: z.string().min(1).email(),
+})
+
+const mutation = makeDomainFunction(schema)(async (values) => values)
+
+export function action({ request }: ActionArgs) {
+ return formAction({
+ request,
+ schema,
+ mutation,
+ successPath: '/success',
+ })
+}
+
+export default () => <Form schema={schema} />
diff --git a/apps/remix-1-7/app/routes/success.tsx b/apps/remix-1-7/app/routes/success.tsx
@@ -0,0 +1 @@
+export default () => <h1>Success!</h1>
diff --git a/apps/remix-1-7/app/ui/form.tsx b/apps/remix-1-7/app/ui/form.tsx
@@ -0,0 +1,16 @@
+import { createForm } from 'remix-forms'
+import {
+ Form as RemixForm,
+ useActionData,
+ useSubmit,
+ useTransition as useNavigation,
+} from '@remix-run/react'
+
+const Form = createForm({
+ component: RemixForm,
+ useNavigation,
+ useSubmit,
+ useActionData,
+})
+
+export { Form }
diff --git a/apps/remix-1-7/package.json b/apps/remix-1-7/package.json
@@ -0,0 +1,34 @@
+{
+ "name": "remix-forms-remix-1-7",
+ "private": true,
+ "sideEffects": false,
+ "scripts": {
+ "build": "remix build",
+ "dev": "PORT=3002 remix dev",
+ "start": "remix-serve build",
+ "lint": "eslint . --max-warnings=0",
+ "prelint": "prettier --check .",
+ "tsc": "tsc"
+ },
+ "dependencies": {
+ "@remix-run/node": "1.7.4",
+ "@remix-run/react": "1.7.4",
+ "@remix-run/serve": "1.7.4",
+ "domain-functions": "^2.6.0",
+ "isbot": "^5.1.6",
+ "react": "^18.3.1",
+ "react-dom": "^18.3.1",
+ "remix-forms": "*",
+ "zod": "^3.23.6"
+ },
+ "devDependencies": {
+ "@remix-run/dev": "1.7.4",
+ "@remix-run/eslint-config": "2.9.1",
+ "@types/react": "^18.3.1",
+ "@types/react-dom": "^18.3.0",
+ "typescript": "~5.4.5"
+ },
+ "engines": {
+ "node": ">=14"
+ }
+}
diff --git a/apps/remix-1-7/public/favicon.ico b/apps/remix-1-7/public/favicon.ico
diff --git a/apps/remix-1-7/remix.config.js b/apps/remix-1-7/remix.config.js
@@ -0,0 +1,15 @@
+/** @type {import('@remix-run/dev').AppConfig} */
+module.exports = {
+ ignoredRouteFiles: ['**/.*'],
+ // appDirectory: "app",
+ // assetsBuildDirectory: "public/build",
+ // serverBuildPath: "build/index.js",
+ // publicPath: "/build/",
+ future: {
+ v2_errorBoundary: true,
+ v2_meta: true,
+ v2_normalizeFormMethod: true,
+ v2_routeConvention: true,
+ },
+ devServerPort: 8004,
+}
diff --git a/apps/remix-1-7/remix.env.d.ts b/apps/remix-1-7/remix.env.d.ts
@@ -0,0 +1,2 @@
+/// <reference types="@remix-run/dev" />
+/// <reference types="@remix-run/node" />
diff --git a/apps/remix-1-7/tsconfig.json b/apps/remix-1-7/tsconfig.json
@@ -0,0 +1,22 @@
+{
+ "include": ["remix.env.d.ts", "**/*.ts", "**/*.tsx"],
+ "compilerOptions": {
+ "lib": ["DOM", "DOM.Iterable", "ES2019"],
+ "isolatedModules": true,
+ "esModuleInterop": true,
+ "jsx": "react-jsx",
+ "moduleResolution": "node",
+ "resolveJsonModule": true,
+ "target": "ES2019",
+ "strict": true,
+ "allowJs": true,
+ "forceConsistentCasingInFileNames": true,
+ "baseUrl": ".",
+ "paths": {
+ "~/*": ["./app/*"]
+ },
+ "skipLibCheck": true,
+ // Remix takes care of building everything in `remix build`.
+ "noEmit": true
+ }
+}