-
-
Notifications
You must be signed in to change notification settings - Fork 890
Migrate to React 19, Vite, functional components and general modernize the UI #696
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Closed
Closed
Changes from 46 commits
Commits
Show all changes
52 commits
Select commit
Hold shift + click to select a range
bc896fa
Converted react-scripts to vite
mfechner 289f100
Use plugin-react instead of plugin-react-swc, as that will not work o…
mfechner 96d09ef
Small fixes on state management and vite configuration to make websoc…
mfechner a488460
Started to fix issues with state management (mobx)
mfechner 45821b4
Generate a `build/asset-manifest.json`
mfechner 7a778b5
Fix problem in change password and some other state management problems
mfechner 1ec8b23
Clean up changes to be consistent
mfechner 1200f7c
Make it possible to run tests with vitest
mfechner 560e3d9
Define global as it is required by react-codemirror2
mfechner 122ef6a
Upgrade react to 18.3.1
mfechner 1a5ca1f
Fix rimraf api changes
mfechner 8596883
Update all packages to current version including react 19
mfechner df5dd66
Fix problem with failed auto-login
mfechner d36a476
Fixed change password and logout in e2e tests
mfechner 921a488
Use a robuster way to determine the base url in production mode.
mfechner b2b7820
Simplified the auth reducer by defining a initial state for the user …
mfechner bb6292b
Use URL to construct the url for e2e tests
mfechner 6ec7e0b
Fixed most of the e2e tests
mfechner 10f2b73
Move the code to terminate the gotify application after an e2e test i…
mfechner 68e54d8
Fixed last failing tests for messages
mfechner 011160f
Fix automatic logout if client was removed
mfechner 4d5aabe
Do not load an image if it is null or undefined
mfechner df9a000
Fixed wrong display of messages (filter of selected App was not applied)
mfechner 1d30cd6
Display a snack message if a single message was deleted
mfechner dbed184
Hide the loading indicator if the fetch of messages fails, e.g. due t…
mfechner 0e4cf73
Finished rewrite of the Plugin details view to a functional component
mfechner 8f4982e
Make sure, the websocket is a singleton that message are not added to…
mfechner 932a521
Fixed Register user feature and use react 19 action instead of form o…
mfechner f1ff3f2
Removed unused code
mfechner 71709db
let vite listen not only on localhost so it can be started in a WSL2 …
mfechner 57383cc
Fixed direct loading of sub-pages like `/#/messages/3`
mfechner f25df9b
Make sure new Material uses some colors like the old material theme did
mfechner 70c8900
Fixed layout problem caused from Material upgrade
mfechner a055be0
Fixed passing of build related information to the react ui (like vers…
mfechner 3eb2848
Removed not need options due to vite usage
mfechner d8b1e9f
Replace the application that it does not change the order (which shou…
mfechner 23e5fde
Do not inline sourcemaps anymore to reduce the file size for producti…
mfechner 5fb3854
Remove TODO, we keep the name of the component like it is
mfechner 8d613bc
Use the same url while working in dev mode compared to production mode
mfechner 53f5ced
Fixed loading and refreshing of messages
mfechner e2c5fa0
Fix typo in test
mfechner 4952391
Reenable React Strict Mode
mfechner adf75a4
Remove the async sendRequest method
mfechner decfd41
Moved state/action definition from directory `store` into directory o…
mfechner daecf32
Remove obsolete files
mfechner 4d0f9bf
Added loading indicators
mfechner 06ca162
Removed install dep, is not used
mfechner c30027c
Removed react-window dep, is not used
mfechner 0dddf68
Use a redux middleware to trigger a data refetch if a broken server c…
mfechner c73cbdf
Make sure that a rerender of the Applications component does to remov…
mfechner fc642af
Handle the websocket connection for incoming message using a redux mi…
mfechner 5b1eadf
Readded a virtual section for messages
mfechner File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,115 @@ | ||
| import React, {useEffect} from 'react'; | ||
|
mfechner marked this conversation as resolved.
Outdated
|
||
| import {createHashRouter, RouterProvider} from 'react-router-dom'; | ||
| import Applications from './application/Applications.tsx'; | ||
|
mfechner marked this conversation as resolved.
|
||
| 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 PluginsRootLayout from './pages/plugins.tsx'; | ||
| import RootLayout from './pages/root'; | ||
| import PluginDetailView from './plugin/PluginDetailView.tsx'; | ||
| import Plugins from './plugin/Plugins.tsx'; | ||
| import * as Notifications from './snack/browserNotification.ts'; | ||
| import {useAppDispatch, useAppSelector} from './store'; | ||
| import {messageActions} from './message/message-slice.ts'; | ||
| import Login from './user/Login.tsx'; | ||
| import Users from './user/Users.tsx'; | ||
|
|
||
| const router = createHashRouter([ | ||
| { | ||
| 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: <PluginsRootLayout />, | ||
| loader: checkAuthLoader, | ||
| children: [ | ||
| { index: true, element: <Plugins /> }, | ||
| { | ||
| path: ':id', | ||
| element: <PluginDetailView />, | ||
| } | ||
| ], | ||
| }, | ||
| ], | ||
| }, | ||
| ]); | ||
|
|
||
| const ws = new WebSocketStore(); | ||
|
|
||
| const App = () => { | ||
| const dispatch = useAppDispatch(); | ||
| const loggedIn = useAppSelector((state) => state.auth.loggedIn); | ||
|
|
||
| useEffect(() => { | ||
| if (loggedIn) { | ||
|
mfechner marked this conversation as resolved.
Outdated
|
||
| ws.listen((message) => { | ||
| dispatch(messageActions.loading(true)); | ||
| 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> | ||
| */ | ||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading. Please reload this page.