From 531aa74f2342c395add1d0c8bf6a79a3336f6d7c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sebastian=20Vitters=C3=B8?= Date: Tue, 5 Nov 2024 08:21:26 +0100 Subject: [PATCH] refactor: replace react-scripts (cra) with vite, and make necessary changes --- index.html | 17 +++++++++++++++++ package.json | 23 ++++++++++++----------- public/index.html | 13 ------------- src/{index.js => index.jsx} | 9 ++++++--- tests/auth-util.test.ts | 2 +- vite.config.ts | 6 ++++++ 6 files changed, 42 insertions(+), 28 deletions(-) create mode 100644 index.html delete mode 100644 public/index.html rename src/{index.js => index.jsx} (94%) create mode 100644 vite.config.ts diff --git a/index.html b/index.html new file mode 100644 index 0000000..1f5342a --- /dev/null +++ b/index.html @@ -0,0 +1,17 @@ + + + + + + + + React App + + + + + +
+ + + \ No newline at end of file diff --git a/package.json b/package.json index 95070e5..62f52f8 100644 --- a/package.json +++ b/package.json @@ -2,27 +2,28 @@ "name": "package-development", "version": "0.1.0", "scripts": { - "start": "ESLINT_NO_DEV_ERRORS='true' react-scripts start", - "build": "react-scripts build", + "start": "vite", + "build": "vite build", "test": "jest --silent", "test:watch": "jest --silent --watch" }, "dependencies": { "react": "18.3.1", - "react-dom": "18.3.1", - "react-scripts": ">=5.0.1" + "react-dom": "18.3.1" }, "devDependencies": { - "@testing-library/dom": "^10.1.0", - "@testing-library/jest-dom": "^6.4.5", - "@testing-library/react": "^15.0.7", + "@testing-library/dom": "^10.4.0", + "@testing-library/jest-dom": "^6.6.3", + "@testing-library/react": "^16.0.1", "@testing-library/user-event": "^14.5.2", - "@types/jest": "^29.5.12", - "@types/react": "18.3.1", + "@types/jest": "^29.5.14", + "@types/react": "18.3.12", + "@vitejs/plugin-react": "^4.3.3", "jest": "^29.7.0", "jest-environment-jsdom": "^29.7.0", - "ts-jest": "^29.1.2", - "typescript": "5.4.5" + "ts-jest": "^29.2.5", + "typescript": "5.6.3", + "vite": "^5.4.10" }, "browserslist": { "production": [">0.2%", "not dead", "not op_mini all"], diff --git a/public/index.html b/public/index.html deleted file mode 100644 index 24fadb6..0000000 --- a/public/index.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - React App - - - -
- - diff --git a/src/index.js b/src/index.jsx similarity index 94% rename from src/index.js rename to src/index.jsx index dc1d50f..aecea65 100644 --- a/src/index.js +++ b/src/index.jsx @@ -1,3 +1,5 @@ +/// + // ########################################## // NOTE: This file is not part of the package. // It's only function is to help development in testing and debugging. @@ -15,7 +17,7 @@ const authConfig = { authorizationEndpoint: 'https://keycloak.ofstad.xyz/realms/master/protocol/openid-connect/auth', tokenEndpoint: 'https://keycloak.ofstad.xyz/realms/master/protocol/openid-connect/token', logoutEndpoint: 'https://keycloak.ofstad.xyz/realms/master/protocol/openid-connect/logout', - redirectUri: 'http://localhost:3000/', + redirectUri: 'http://localhost:5173/', onRefreshTokenExpire: (event) => event.logIn('', {}, 'popup'), preLogin: () => console.log('Logging in...'), postLogin: () => console.log('Logged in!'), @@ -45,10 +47,10 @@ function LoginInfo() { {token ? ( <> - + Access token will expire at:{' '} - {new Date(localStorage.getItem('ROCP_tokenExpire') * 1000).toLocaleTimeString()} + {new Date(Number(localStorage.getItem('ROCP_tokenExpire')) * 1000).toLocaleTimeString()}
@@ -110,6 +112,7 @@ function LoginInfo() { } const container = document.getElementById('root') +if (!container) throw new Error('No container found') const root = createRoot(container) root.render( diff --git a/tests/auth-util.test.ts b/tests/auth-util.test.ts index 14705ce..999d682 100644 --- a/tests/auth-util.test.ts +++ b/tests/auth-util.test.ts @@ -10,7 +10,7 @@ const authConfig: TInternalConfig = { clientId: 'myClientID', authorizationEndpoint: 'myAuthEndpoint', tokenEndpoint: 'myTokenEndpoint', - redirectUri: 'http://localhost:3000/', + redirectUri: 'http://localhost:5173/', scope: 'someScope openid', clearURL: false, storage: 'local', diff --git a/vite.config.ts b/vite.config.ts new file mode 100644 index 0000000..ae74518 --- /dev/null +++ b/vite.config.ts @@ -0,0 +1,6 @@ +import react from '@vitejs/plugin-react' +import { defineConfig } from 'vite' + +export default defineConfig({ + plugins: [react()], +})