[PR #149] [MERGED] refactor: optimize UI button layout and fix dependency loop #216

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

📋 Pull Request Information

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

Base: mainHead: fix/button_placement


📝 Commits (1)

  • 7315f81 refactor: optimize UI button layout and fix dependency loop

📊 Changes

2 files changed (+22 additions, -15 deletions)

View changed files

📝 src/app/_components/InstalledScriptsTab.tsx (+18 -13)
📝 src/server/api/routers/installedScripts.ts (+4 -2)

📄 Description

Summary

This PR optimizes the UI button layout in the installed scripts table and fixes a dependency array loop issue.

Changes Made

UI Improvements

  • Added Open UI button next to IP:Port in the installed scripts table
  • Moved Re-detect button to Actions dropdown for better space usage and cleaner layout
  • Hide buttons for stopped containers to prevent invalid actions
  • Improved font consistency by removing monospace from IP:Port text
  • Enhanced auto-detect success message with LXC ID and hostname for better context

Bug Fixes

  • Fixed dependency array loop in fetchContainerStatuses useCallback that was causing infinite re-renders
  • Optimized button rendering to only show when container status is confirmed as running

UX Improvements

  • Better screen real estate usage with cleaner, more scannable layout
  • Logical button grouping with primary actions visible and utility functions in dropdown
  • Consistent styling across all action buttons

Testing

  • Buttons only appear for running containers
  • Open UI button works correctly
  • Re-detect button accessible via Actions dropdown
  • No more dependency loop causing performance issues
  • Enhanced success messages display properly

Screenshots

The interface now has a much cleaner layout with better space utilization and improved user experience.


🔄 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/149 **Author:** [@michelroegl-brunner](https://github.com/michelroegl-brunner) **Created:** 10/14/2025 **Status:** ✅ Merged **Merged:** 10/14/2025 **Merged by:** [@michelroegl-brunner](https://github.com/michelroegl-brunner) **Base:** `main` ← **Head:** `fix/button_placement` --- ### 📝 Commits (1) - [`7315f81`](https://github.com/community-scripts/ProxmoxVE-Local/commit/7315f81304362d4f3ffbe2de66c4d6b30c3f8bdb) refactor: optimize UI button layout and fix dependency loop ### 📊 Changes **2 files changed** (+22 additions, -15 deletions) <details> <summary>View changed files</summary> 📝 `src/app/_components/InstalledScriptsTab.tsx` (+18 -13) 📝 `src/server/api/routers/installedScripts.ts` (+4 -2) </details> ### 📄 Description ## Summary This PR optimizes the UI button layout in the installed scripts table and fixes a dependency array loop issue. ## Changes Made ### UI Improvements - **Added Open UI button** next to IP:Port in the installed scripts table - **Moved Re-detect button** to Actions dropdown for better space usage and cleaner layout - **Hide buttons for stopped containers** to prevent invalid actions - **Improved font consistency** by removing monospace from IP:Port text - **Enhanced auto-detect success message** with LXC ID and hostname for better context ### Bug Fixes - **Fixed dependency array loop** in fetchContainerStatuses useCallback that was causing infinite re-renders - **Optimized button rendering** to only show when container status is confirmed as running ### UX Improvements - **Better screen real estate usage** with cleaner, more scannable layout - **Logical button grouping** with primary actions visible and utility functions in dropdown - **Consistent styling** across all action buttons ## Testing - [x] Buttons only appear for running containers - [x] Open UI button works correctly - [x] Re-detect button accessible via Actions dropdown - [x] No more dependency loop causing performance issues - [x] Enhanced success messages display properly ## Screenshots The interface now has a much cleaner layout with better space utilization and improved user experience. --- <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:34 -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#216