[PR #98] [MERGED] fix: resolve Next.js warnings and SVG path errors #184

Closed
opened 2025-11-20 04:13:24 -05:00 by saavagebueno · 0 comments
Owner

📋 Pull Request Information

Original PR: https://github.com/community-scripts/ProxmoxVE-Local/pull/98
Author: @michelroegl-brunner
Created: 10/10/2025
Status: Merged
Merged: 10/10/2025
Merged by: @michelroegl-brunner

Base: mainHead: fix/small_fixes


📝 Commits (2)

  • e0d7ba4 fix: move viewport metadata to separate export
  • 9d34785 fix: resolve Next.js warnings and SVG path errors

📊 Changes

3 files changed (+32 additions, -3 deletions)

View changed files

📝 next.config.js (+24 -0)
📝 src/app/_components/CategorySidebar.tsx (+1 -1)
📝 src/app/layout.tsx (+7 -2)

📄 Description

Summary

This PR resolves several Next.js warnings and fixes SVG path errors in the application.

Changes Made

🔧 Next.js Viewport Warning Fix

  • File: src/app/layout.tsx
  • Issue: Unsupported metadata viewport configuration warning
  • Fix: Moved viewport configuration from metadata export to separate viewport export (Next.js 14+ compliance)

🎨 SVG Path Error Fix

  • File: src/app/_components/CategorySidebar.tsx
  • Issue: Malformed SVG arc command causing React DOM error
  • Fix: Corrected arc command from A6 6 0 1721 9z to A6 6 0 1 0 21 9z (added missing arc flags)

🌐 Cross-Origin Request Warning Fix

  • File: next.config.js
  • Issue: Cross-origin request warning from local network devices
  • Fix: Added allowedDevOrigins configuration supporting all private network ranges:
    • Localhost and loopback addresses
    • Class A private networks (10.x.x.x)
    • Class B private networks (172.16.x.x - 172.31.x.x)
    • Class C private networks (192.168.x.x)

Benefits

  • Eliminates Next.js console warnings
  • Fixes SVG rendering errors
  • Enables access from any local network device without hardcoding IPs
  • Maintains security by only allowing private network ranges
  • Future-proof configuration that works with any user's network setup

Testing

  • Verified viewport metadata warning is resolved
  • Confirmed SVG path renders correctly without console errors
  • Tested cross-origin access from local network devices

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/community-scripts/ProxmoxVE-Local/pull/98 **Author:** [@michelroegl-brunner](https://github.com/michelroegl-brunner) **Created:** 10/10/2025 **Status:** ✅ Merged **Merged:** 10/10/2025 **Merged by:** [@michelroegl-brunner](https://github.com/michelroegl-brunner) **Base:** `main` ← **Head:** `fix/small_fixes` --- ### 📝 Commits (2) - [`e0d7ba4`](https://github.com/community-scripts/ProxmoxVE-Local/commit/e0d7ba4b86bbc73be39881b435bd22597033961f) fix: move viewport metadata to separate export - [`9d34785`](https://github.com/community-scripts/ProxmoxVE-Local/commit/9d3478590e653622a1070614845de78734a3e4a8) fix: resolve Next.js warnings and SVG path errors ### 📊 Changes **3 files changed** (+32 additions, -3 deletions) <details> <summary>View changed files</summary> 📝 `next.config.js` (+24 -0) 📝 `src/app/_components/CategorySidebar.tsx` (+1 -1) 📝 `src/app/layout.tsx` (+7 -2) </details> ### 📄 Description ## Summary This PR resolves several Next.js warnings and fixes SVG path errors in the application. ## Changes Made ### 🔧 Next.js Viewport Warning Fix - **File**: `src/app/layout.tsx` - **Issue**: Unsupported metadata viewport configuration warning - **Fix**: Moved viewport configuration from metadata export to separate viewport export (Next.js 14+ compliance) ### 🎨 SVG Path Error Fix - **File**: `src/app/_components/CategorySidebar.tsx` - **Issue**: Malformed SVG arc command causing React DOM error - **Fix**: Corrected arc command from `A6 6 0 1721 9z` to `A6 6 0 1 0 21 9z` (added missing arc flags) ### 🌐 Cross-Origin Request Warning Fix - **File**: `next.config.js` - **Issue**: Cross-origin request warning from local network devices - **Fix**: Added `allowedDevOrigins` configuration supporting all private network ranges: - Localhost and loopback addresses - Class A private networks (10.x.x.x) - Class B private networks (172.16.x.x - 172.31.x.x) - Class C private networks (192.168.x.x) ## Benefits - ✅ Eliminates Next.js console warnings - ✅ Fixes SVG rendering errors - ✅ Enables access from any local network device without hardcoding IPs - ✅ Maintains security by only allowing private network ranges - ✅ Future-proof configuration that works with any user's network setup ## Testing - [x] Verified viewport metadata warning is resolved - [x] Confirmed SVG path renders correctly without console errors - [x] Tested cross-origin access from local network devices --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
saavagebueno added the pull-request label 2025-11-20 04:13:24 -05:00
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: SVI/ProxmoxVE-Local#184