From 0cec591dd5d007ce005b28c0b335cfec3c1a351e Mon Sep 17 00:00:00 2001
From: "Richard T. Carback III" <rick.carback@gmail.com>
Date: Wed, 5 Feb 2025 17:01:29 -0500
Subject: [PATCH] Convert from nextjs to vite. This leaves a number of
unresolved bugs. Most we will need to address before release.
---
.gitignore | 11 ++++++++++
README.md | 37 ++++++++++++++-----------------
package.json | 55 +++++++++++++++++++++++++++-------------------
postcss.config.js | 6 ++---
tailwind.config.js | 16 +++++++++++++-
tsconfig.json | 14 +++++-------
6 files changed, 83 insertions(+), 56 deletions(-)
diff --git a/.gitignore b/.gitignore
index 30204822..712ad9d0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -39,3 +39,14 @@ next-env.d.ts
# Ignore Jetbrains IDE folder
.idea/*
+
+# Ignore emacs temporary files
+*~
+*#
+
+# Vite files
+dist/
+
+# Bun
+bun.lockb
+
diff --git a/README.md b/README.md
index 6a552e20..40d13138 100644
--- a/README.md
+++ b/README.md
@@ -1,23 +1,22 @@
-This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+Haven is a vite app.
## Getting Started
First, run the development server:
```bash
+npm install
npm run dev
# or
+yarn install
yarn dev
+# or
+bun install
+bun run dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
-You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
-
-[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
-
-The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
-
## ICP Cannister HOWTO
https://internetcomputer.org/docs/current/developer-docs/web-apps/application-frontends/existing-frontend
@@ -44,17 +43,15 @@ Deploy
dfx deploy --network ic --identity icp_prod
```
-## Learn More
-
-To learn more about Next.js, take a look at the following resources:
-
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
-
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+# Production
-## Deploy on Vercel
-
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
-
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
+```
+npm run build
+npm run preview
+# or
+yarn build
+yarn preview
+# or
+bun run build
+bun run preview
+```
diff --git a/package.json b/package.json
index f45bb997..f9516ed9 100644
--- a/package.json
+++ b/package.json
@@ -2,17 +2,17 @@
"name": "haven-web",
"version": "0.3.22",
"private": true,
+ "type": "module",
"scripts": {
- "dev": "next dev",
+ "dev": "vite",
"dev:ts": "yarn dev & yarn ts:watch",
"ts": "tsc --noEmit --incremental",
"ts:watch": "yarn ts --watch",
- "build": "next build",
- "build:analyze": "ANALYZE=true next build",
- "start": "npx serve out",
- "lint": "next lint",
+ "build": "tsc && vite build",
+ "preview": "vite preview",
+ "lint": "eslint",
"format": "prettier --write \"**/*.{ts,tsx,md}\"",
- "lint:fix": "next lint --fix",
+ "lint:fix": "eslint --fix",
"test": "cypress",
"see-cy-coverage": "open ./cypress-coverage/lcov-report/index.html"
},
@@ -27,10 +27,13 @@
"@react-oauth/google": "^0.9.0",
"@react-spring/web": "^9.5.5",
"@reduxjs/toolkit": "^1.9.1",
+ "@vitejs/plugin-react": "^4.3.4",
+ "@windmillcode/quill-emoji": "^2.0.3000",
"body-scroll-lock": "^4.0.0-beta.0",
"classnames": "^2.3.1",
"contrast-color": "^1.0.1",
"copy-to-clipboard": "^3.3.2",
+ "date-fns": "^4.1.0",
"dayjs": "^1.11.9",
"delay": "^5.0.0",
"dexie": "^3.2.2",
@@ -45,21 +48,22 @@
"js-cookie": "^3.0.1",
"lodash": "^4.17.21",
"lucide-react": "^0.453.0",
- "next": "^14.2.16",
- "next-seo": "^5.11.1",
+ "pako": "^2.1.0",
"parchment": "^2.0.1",
- "quill": "^1.3.7",
+ "quill": "^2.0.3",
"quill-auto-detect-url": "^0.2.1",
- "quill-mention": "^3.1.0",
+ "quill-mention": "6.0.2",
"react": "18.3.1",
"react-dom": "18.3.1",
"react-error-boundary": "^3.1.4",
+ "react-helmet-async": "^2.0.5",
"react-hot-toast": "^2.4.1",
"react-i18next": "^12.2.0",
"react-moment": "^1.1.2",
"react-multiline-clamp": "^2.0.0",
"react-quill": "^2.0.0",
"react-redux": "^8.0.5",
+ "react-router-dom": "^7.1.5",
"react-spring": "^9.5.2",
"react-tailwindcss-select": "^1.6.0",
"react-tooltip": "^5.7.4",
@@ -68,15 +72,15 @@
"redux-localstorage": "^0.4.1",
"serve": "^14.2.4",
"ts.data.json": "^2.2.0",
- "use-sound": "^4.0.1",
+ "use-sound": "^4.0.3",
"usehooks-ts": "^2.9.1",
"uuid": "^9.0.0",
+ "vite": "^6.0.11",
"xxdk-wasm": "^0.3.21"
},
"devDependencies": {
"@cypress/code-coverage": "^3.13.4",
"@cypress/webpack-preprocessor": "^6.0.2",
- "@next/bundle-analyzer": "^15.0.2",
"@testing-library/cypress": "^10.0.2",
"@types/contrast-color": "^1.0.0",
"@types/dompurify": "^2.3.4",
@@ -87,33 +91,38 @@
"@types/js-cookie": "^3.0.2",
"@types/lodash": "^4.14.185",
"@types/node": "18.7.14",
- "@types/react": "18.3.11",
- "@types/react-dom": "18.3.0",
+ "@types/pako": "^2.0.3",
+ "@types/react": "^18.2.43",
+ "@types/react-dom": "^18.2.17",
"@types/react-draft-wysiwyg": "^1.13.4",
"@types/testing-library__cypress": "^5.0.9",
"@types/uuid": "^8.3.4",
- "@typescript-eslint/eslint-plugin": "^5.45.0",
+ "@typescript-eslint/eslint-plugin": "^latest",
+ "@typescript-eslint/parser": "^latest",
+ "@vitejs/plugin-react-swc": "^3.5.0",
"autoprefixer": "^10.4.20",
"babel-plugin-istanbul": "^6.1.1",
"cypress": "^13.15.1",
- "eslint": "8.23.0",
+ "eslint": "^latest",
"eslint-config-airbnb-typescript": "^17.0.0",
- "eslint-config-next": "^13.0.6",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-import-newlines": "^1.3.0",
"eslint-plugin-prettier": "^5.2.1",
- "eslint-plugin-react-hooks": "^4.6.0",
+ "eslint-plugin-react": "^latest",
+ "eslint-plugin-react-hooks": "^latest",
"eslint-plugin-simple-import-sort": "^8.0.0",
"eslint-plugin-sort-destructure-keys": "^1.4.0",
- "next-build-id": "^3.0.0",
"nyc": "^15.1.0",
"postcss": "^8.4.47",
"prettier": "^3.3.3",
"prettier-plugin-tailwindcss": "^0.4.1",
- "sass": "^1.80.5",
"tailwindcss": "^3.4.14",
- "typed-scss-modules": "^8.0.1",
- "typescript": "4.8.2"
- }
+ "typescript": "^5.7.3",
+ "vite-plugin-eslint": "^1.8.1"
+ },
+ "trustedDependencies": [
+ "@swc/core",
+ "core-js-pure"
+ ]
}
diff --git a/postcss.config.js b/postcss.config.js
index 5cbc2c7d..cb9b0aaa 100644
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -1,6 +1,6 @@
-module.exports = {
+export default {
plugins: {
tailwindcss: {},
- autoprefixer: {}
+ autoprefixer: {},
}
-};
+}
diff --git a/tailwind.config.js b/tailwind.config.js
index 69ad3d09..72d6dc29 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,6 +1,8 @@
/** @type {import('tailwindcss').Config} */
module.exports = {
- content: ['./src/**/*.{js,ts,jsx,tsx}'],
+ content: [
+ "./src/**/*.{js,jsx,ts,tsx}",
+ ],
theme: {
colors: {
primary: 'var(--primary)',
@@ -35,6 +37,18 @@ module.exports = {
lg: '1280px',
xl: '1280px',
'2xl': '1560px'
+ },
+ keyframes: {
+ draw: {
+ '0%, 66%, 100%': {
+ fill: 'rgb(96, 165, 250)', // blue-400 lighter
+ transform: 'translate(0, 0)'
+ },
+ '33%': {
+ fill: 'rgb(59, 130, 246)', // blue-500 darker
+ transform: 'translate(-1px, -1px)'
+ }
+ }
}
}
},
diff --git a/tsconfig.json b/tsconfig.json
index cc6c4ce5..9ad0a263 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -17,16 +17,12 @@
"incremental": true,
"allowSyntheticDefaultImports": true,
"paths": {
- "@assets/*": ["src/assets/*"],
- "@utils/*": ["src/utils/*"],
- "@layouts": ["src/layouts"],
- "@layouts/*": ["src/layouts/*"],
- "@components/*": ["src/components/*"],
+ "@/*": ["src/*"],
+ "src/*": ["src/*"],
"@contexts/*": ["src/contexts/*"],
- "@types": ["src/types"],
- "@utils": ["src/utils/index"],
- "@utils/hooks/*": ["src/utils/hooks/*"],
- "@sdk/*": ["sdk-utils/*"]
+ "@components/*": ["src/components/*"],
+ "@assets/*": ["src/assets/*"],
+ "@utils/*": ["src/utils/*"]
}
},
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "src/quill/constants.js"],
--
GitLab