hobbyhimmel/Project-Image-Uploader
8
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(frontend): remove broken sweetalert2 CDN tags, fix NavLink props, add RR v6 future flags

Browse Source 
- Remove hardcoded <script> and <link> tags for sweetalert2 from index.html
  (library is already bundled via npm, CDN paths caused 404 + MIME errors)
- Remove deprecated 'exact' prop and 'activeClassName' from NavLink in
  Navbar.js and NavbarUpload.js (not supported in React Router v6)
- Replace activeClassName with className={({ isActive }) => ...} pattern
- Add future flags to <BrowserRouter> in App.js:
  v7_startTransition and v7_relativeSplatPath to suppress RR v6 warnings
This commit is contained in:
Matthias Lotz 2026-04-01 17:30:46 +02:00
parent 04b13872c9
commit e75cde1a84
4 changed files with 5 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/public/index.html
View File

@ -20,7 +20,6 @@
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/fc1a4a5a71.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="@sweetalert2/theme-material-ui/material-ui.css">
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@100&display=swap" rel="stylesheet">
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
@ -28,7 +27,6 @@
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<script src="sweetalert2/dist/sweetalert2.min.js"></script>
<script src="%PUBLIC_URL%/env-config.js"></script>
<div id="root"></div>
</body>

2
frontend/src/App.js
View File

@ -55,7 +55,7 @@ function App() {
return (
<ErrorBoundary>
<AdminSessionProvider>
<Router>
<Router future={{ v7_startTransition: true, v7_relativeSplatPath: true }}>
<Suspense fallback={<LoadingFallback />}>
<Routes>
{/* Public Routes - immer verfügbar */}

6
frontend/src/Components/ComponentUtils/Headers/Navbar.js
View File

@ -22,7 +22,7 @@ function Navbar() {
<>
<header>
<div className="logo">
<NavLink className="logo" exact to="/">
<NavLink className="logo" to="/">
<img src={logo} className="imageNav" alt="Logo" />
<p className="logo">Upload your Project Images</p>
</NavLink>
@ -31,7 +31,7 @@ function Navbar() {
<ul className="nav__links">
<li><NavLink to="/groups" activeClassName="active">Groups</NavLink></li>
<li><NavLink to="/moderation" activeClassName="active"><LockIcon style={{ fontSize: 18, verticalAlign: 'text-bottom', marginRight: 6 }} aria-hidden="true" />Moderation</NavLink></li>
<li><NavLink className="cta" exact to="/" activeClassName="active">Upload</NavLink></li>
<li><NavLink className={({ isActive }) => isActive ? 'cta active' : 'cta'} to="/">Upload</NavLink></li>
{isManagementPage && (
<li><NavLink className="cta" to={location.pathname} activeClassName="active">Mein Upload</NavLink></li>
)}
@ -62,7 +62,7 @@ function Navbar() {
<NavLink to="/moderation" activeClassName="active" onClick={closeMenu}>
<LockIcon style={{ fontSize: 24, verticalAlign: 'text-bottom', marginRight: 12 }} aria-hidden="true" />Moderation
</NavLink>
<NavLink exact to="/" activeClassName="active" onClick={closeMenu}>Upload</NavLink>
<NavLink to="/" className={({ isActive }) => isActive ? 'active' : undefined} onClick={closeMenu}>Upload</NavLink>
{isManagementPage && (
<NavLink to={location.pathname} activeClassName="active" onClick={closeMenu}>Mein Upload</NavLink>
)}

2
frontend/src/Components/ComponentUtils/Headers/NavbarUpload.js
View File

@ -20,7 +20,7 @@ function Navbar() {
<>
<header>
<div className="logo">
<NavLink className="logo" exact to="/">
<NavLink className="logo" to="/">
<img src={logo} className="imageNav" alt="Logo" />
<p className="logo">Upload your Project Images</p>
</NavLink>