Merge branch 'infre-migrate-to-vite'

andriy-f · Feb 7, 2024 · 01423cc · 01423cc
2 parents 12d58fd + 98dffae
commit 01423cc
Show file tree

Hide file tree

Showing 35 changed files with 12,496 additions and 29,527 deletions.
diff --git a/.env b/.env
@@ -1,3 +1,3 @@
 PORT=9001
-REACT_APP_KCM_BACKEND_URL=http://localhost:3000
-REACT_APP_KCM_GOOGLE_TRACKING_ID=
+VITE_KCM_BACKEND_URL=http://localhost:3000
+VITE_KCM_GOOGLE_TRACKING_ID=
diff --git a/.eslintignore b/.eslintignore
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
@@ -0,0 +1,20 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react-hooks/recommended',
+  ],
+  ignorePatterns: ['dist', '.eslintrc.cjs'],
+  parser: '@typescript-eslint/parser',
+  plugins: ['react-refresh'],
+  rules: {
+    semi: ['warn', 'never'],
+    quotes: ['warn', 'single'],
+    'react-refresh/only-export-components': [
+      'warn',
+      { allowConstantExport: true },
+    ],
+  },
+}
diff --git a/.eslintrc.json b/.eslintrc.json
diff --git a/.gitignore b/.gitignore
@@ -9,8 +9,7 @@
 /coverage
 
 # production
-/build
-/buildServer
+/dist
 
 # misc
 .DS_Store

diff --git a/Dockerfile b/Dockerfile
@@ -1,4 +1,4 @@
-FROM node:18-alpine as base
+FROM node:20-alpine as base
 
 RUN apk add --no-cache su-exec tini
 
@@ -19,10 +19,14 @@ RUN set -ex; \
   apk del .gyp;
 
 COPY --chown=node:node tsconfig.json ./
-COPY --chown=node:node .eslintrc.json ./
+COPY --chown=node:node tsconfig.node.json ./
 COPY --chown=node:node nodemon-relay.json ./
-COPY --chown=node:node relay.config.js ./
+COPY --chown=node:node vite.config.ts ./
+COPY --chown=node:node myRelayPlugin.ts ./
+COPY --chown=node:node .eslintrc.cjs ./
+COPY --chown=node:node relay.config.json ./
 COPY --chown=node:node schema.graphql ./
+COPY --chown=node:node index.html ./
 COPY --chown=node:node assets ./assets
 COPY --chown=node:node public ./public
 COPY --chown=node:node scripts ./scripts
@@ -35,6 +39,7 @@ FROM base as development
 USER node
 EXPOSE 80
 ENV PORT 80
+ENV HOST 0.0.0.0
 ENTRYPOINT ["/sbin/tini", "--"]
 CMD ["npm", "run", "dev"]
 
@@ -63,7 +68,7 @@ WORKDIR /usr/share/nginx/html
 # Copy runtime data
 COPY docker-entrypoint /docker-entrypoint
 COPY default.conf /etc/nginx/conf.d/default.conf
-COPY --from=build /app/build ./
+COPY --from=build /app/dist ./
 RUN mv ./index.html ./index.html.template
 
 # Runtime config

diff --git a/docker-entrypoint b/docker-entrypoint
@@ -1,6 +1,6 @@
 #!/bin/sh
 DEST=/usr/share/nginx/html/index.html
 TEMPLATE=${DEST}.template
-envsubst '$REACT_APP_KCM_BACKEND_URL $REACT_APP_KCM_GOOGLE_TRACKING_ID' <${TEMPLATE} >${DEST}
+envsubst '$VITE_KCM_BACKEND_URL $VITE_KCM_GOOGLE_TRACKING_ID' <${TEMPLATE} >${DEST}
 
 exec "$@"
diff --git a/index.html b/index.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta
+      name="description"
+      content="Application for managing contacts."
+    />
+    <link rel="icon" href="/favicon.ico" />
+    <link rel="apple-touch-icon" type="image/png"
+      href="/logo192.png" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>K Contact Manager</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script>
+      window.kcm = {
+        apiUrl: "$VITE_KCM_BACKEND_URL"
+      };
+    </script>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/myRelayPlugin.ts b/myRelayPlugin.ts
@@ -0,0 +1,29 @@
+/* From https://github.com/oscartbeaumont/vite-plugin-relay */
+import type { PluginOption } from 'vite'
+import { transformSync } from '@babel/core'
+
+export default {
+  name: 'vite:relay',
+  transform(src, id) {
+    if (/.(t|j)sx?/.test(id) && src.includes('graphql`')) {
+      const out = transformSync(src, {
+        plugins: [['babel-plugin-relay']],
+        code: true,
+        filename: id,
+        sourceMaps: true,
+      })
+
+      if (!out?.code) {
+        throw new Error(`vite-plugin-relay: Failed to transform ${id}`)
+      }
+
+      const code = out.code
+      const map = out.map
+
+      return {
+        code,
+        map,
+      }
+    }
+  },
+} as PluginOption