Skip to content

Conversation

@m-dilorenzi
Copy link
Collaborator

This pull request updates the RoutesContent.vue component to improve icon usage, loading state handling, and UI consistency. The changes primarily focus on showing the system routes table even if no custom routes are defined.

Tables

  • removed && routes.length condition on the main <div> containing the two tables to allow the system routes table view even if no custom routes are defined.

Icon usage improvements:

  • Replaced all string-based FontAwesome icon references (e.g., ['fas', 'circle-info']) with imported icon variables (e.g., faCircleInfo, faTable, faPenToSquare, etc.), ensuring more consistent and type-safe icon handling throughout the component.

Loading state and error handling:

  • Added explicit loading.value = true and loading.value = false handling in the loadMainTable function to ensure the loading skeleton is displayed correctly during data fetching, and always hidden after completion or error.

UI and user experience enhancements:

  • Updated the display logic for skeleton loaders and empty states, moving them outside the main table container for better visual structure and adding spacing classes for improved layout.
  • Enhanced the visual feedback for route status icons by adding green/red color classes to the enabled/disabled icons, improving accessibility and clarity.

Closes: NethServer/nethsecurity#1447

@m-dilorenzi m-dilorenzi requested a review from Tbaile January 29, 2026 15:35
@m-dilorenzi m-dilorenzi self-assigned this Jan 29, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Routing page does not display routing table when no additional route is present

2 participants