Skip to content

Commit

Permalink
Upgrade react to 18.3.1
Browse files Browse the repository at this point in the history
Rewrite all components to functional component using hooks
Upgrade react-router to 7.1.0
Use reduxjs/toolkit and react-redux for state management
Upgrade material to 6.3.0
Updated most dependencies to current versions
  • Loading branch information
mfechner committed Jan 1, 2025
1 parent 560e3d9 commit 3d6fca9
Show file tree
Hide file tree
Showing 62 changed files with 6,158 additions and 4,412 deletions.
101 changes: 49 additions & 52 deletions ui/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,28 +5,29 @@
"homepage": ".",
"proxy": "http://localhost:80",
"dependencies": {
"@material-ui/core": "^4.11.4",
"@material-ui/icons": "^4.9.1",
"axios": "^0.21.1",
"codemirror": "^5.61.1",
"detect-browser": "^5.2.0",
"js-base64": "^3.6.1",
"mobx": "^6.13.3",
"mobx-react": "^9.1.1",
"mobx-utils": "^6.1.0",
"notifyjs": "^3.0.0",
"prop-types": "^15.6.2",
"react": "^16.8.6",
"react-codemirror2": "^7.2.1",
"react-dom": "^16.8.6",
"react-infinite": "^0.13.0",
"react-markdown": "^6.0.2",
"react-router": "^5.2.0",
"react-router-dom": "^5.2.0",
"react-timeago": "^6.2.1",
"remark-gfm": "^1.0.0",
"remove-markdown": "^0.3.0",
"typeface-roboto": "1.1.13"
"@emotion/react": "11.14.0",
"@emotion/styled": "11.14.0",
"@fontsource/roboto": "5.1.1",
"@mui/icons-material": "6.3.0",
"@mui/material": "6.3.0",
"axios": "1.7.4",
"codemirror": "6.0.1",
"detect-browser": "5.3.0",
"js-base64": "3.7.7",
"notifyjs": "3.0.0",
"prop-types": "15.8.1",
"react": "18.3.1",
"react-codemirror2": "7.2.1",
"react-dom": "18.3.1",
"react-markdown": "9.0.1",
"react-redux": "9.2.0",
"react-router": "7.1.0",
"react-router-dom": "7.1.0",
"react-timeago": "7.2.0",
"react-window": "1.8.11",
"remark-gfm": "4.0.0",
"remove-markdown": "0.6.0",
"tss-react": "4.9.14"
},
"scripts": {
"start": "vite",
Expand All @@ -38,38 +39,34 @@
"testformat": "prettier \"src/**/*.{ts,tsx}\" --list-different"
},
"devDependencies": {
"@types/codemirror": "5.60.0",
"@types/detect-browser": "^4.0.0",
"@types/get-port": "^4.0.0",
"@types/jest": "^26.0.23",
"@types/js-base64": "^3.3.1",
"@types/node": "^15.12.2",
"@types/notifyjs": "^3.0.2",
"@types/puppeteer": "^5.4.6",
"@types/react": "^16.9.49",
"@types/react-dom": "^16.9.8",
"@types/react-infinite": "0.0.35",
"@types/react-router-dom": "^5.1.7",
"@types/remove-markdown": "^0.3.0",
"@types/rimraf": "^3.0.0",
"@reduxjs/toolkit": "2.5.0",
"@types/codemirror": "5.60.15",
"@types/detect-browser": "4.0.3",
"@types/js-base64": "3.3.1",
"@types/node": "22.10.3",
"@types/notifyjs": "3.0.5",
"@types/puppeteer": "7.0.4",
"@types/react": "18.3.18",
"@types/react-dom": "18.3.5",
"@types/react-router-dom": "5.3.3",
"@types/remove-markdown": "0.3.4",
"@typescript-eslint/eslint-plugin": "^4.1.0",
"@typescript-eslint/parser": "^4.1.0",
"@vitejs/plugin-react": "^4.3.2",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-import": "^2.22.0",
"eslint-plugin-jest": "^24.0.0",
"eslint-plugin-prefer-arrow": "^1.2.2",
"eslint-plugin-react": "^7.20.6",
"eslint-plugin-unicorn": "^21.0.0",
"get-port": "^5.1.1",
"prettier": "^2.3.1",
"puppeteer": "^17.1.3",
"rimraf": "^3.0.2",
"tree-kill": "^1.2.0",
"typescript": "4.0.2",
"vite": "^5.4.8",
"vitest": "^2.1.3",
"wait-on": "^5.3.0"
"@vitejs/plugin-react": "4.3.4",
"eslint-config-prettier": "9.1.0",
"eslint-plugin-import": "2.31.0",
"eslint-plugin-prefer-arrow": "1.2.3",
"eslint-plugin-react": "7.37.3",
"eslint-plugin-unicorn": "56.0.1",
"get-port": "7.1.0",
"prettier": "3.4.2",
"puppeteer": "23.11.1",
"rimraf": "6.0.1",
"tree-kill": "1.2.2",
"typescript": "5.6.3",
"vite": "6.0.6",
"vitest": "2.1.8",
"wait-on": "8.0.1"
},
"eslintConfig": {
"extends": "react-app"
Expand Down
111 changes: 111 additions & 0 deletions ui/src/App.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,111 @@
import React, {useEffect} from 'react';
import {createBrowserRouter, RouterProvider} from 'react-router-dom';
import Applications from './application/Applications.tsx';
import Clients from './client/Clients.tsx';
import {checkAuthLoader} from './common/Auth.ts';
import Messages from './message/Messages.tsx';
import {WebSocketStore} from './message/WebSocketStore.ts';
import RootLayout from './pages/root';
import Plugins from './plugin/Plugins.tsx';
import * as Notifications from './snack/browserNotification.ts';
import {useAppDispatch, useAppSelector} from './store';
import {messageActions} from './store/message-slice.ts';
import Login from './user/Login.tsx';
import Users from './user/Users.tsx';

const router = createBrowserRouter([
{
path: '/',
element: <RootLayout />,
children: [
{
index: true,
element: <Messages />,
loader: checkAuthLoader,
},
{
path: 'messages',
element: <Messages />,
loader: checkAuthLoader,
children: [
{
path: ':id',
element: <Messages />,
}
]
},
{
path: 'login',
element: <Login />,
},
{
path: 'applications',
element: <Applications />,
loader: checkAuthLoader,
},
{
path: 'users',
element: <Users />,
loader: checkAuthLoader,
},
{
path: 'clients',
element: <Clients />,
loader: checkAuthLoader,
},
{
path: 'plugins',
element: <Plugins />,
loader: checkAuthLoader,
children: [
{
path: ':id',
// TODO: fix problem in PluginDetailView
//element: <PluginDetailView />,
},
],
},
],
},
]);

const App = () => {
const dispatch = useAppDispatch();
const loggedIn = useAppSelector((state) => state.auth.loggedIn);
const ws = new WebSocketStore();

useEffect(() => {
if (loggedIn) {
ws.listen((message) => {
dispatch(messageActions.add(message));
Notifications.notifyNewMessage(message);
if (message.priority >= 4) {
const src = 'static/notification.ogg';
const audio = new Audio(src);
audio.play();
}
});
window.onbeforeunload = () => {
ws.close();
};
} else {
ws.close();
}
}, [dispatch, loggedIn]);


return (
<RouterProvider router={router} />
);
};

export default App;

/*
<Routes>
{authenticating ? (<Route path="/" element={<LoadingSpinner />} />) : null}
<Route path="/" element={<Messages />} />
<Route path="messages/:id" element={<Messages />} />
</Routes>
*/
Loading

0 comments on commit 3d6fca9

Please sign in to comment.