feat(openvpn-tunnel): update certs duration and add certs regeneration functionality #679
+746
−190
Conversation
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
m-dilorenzi
force-pushed
the
openvpn_certs_management
branch
from
f701321 to
b006289
Compare
Tbaile
requested changes
Jan 27, 2026
Comment on lines
45
to
68
| const fieldLabels = computed(() => { | ||
| const isTunnelClient = _itemToShow.value ? isClientTunnel(_itemToShow.value) : false | ||
|
|
||
| return { | ||
| bytes_received: t('standalone.openvpn_tunnel.bytes_received'), | ||
| bytes_sent: t('standalone.openvpn_tunnel.bytes_sent'), | ||
| cert_expiry_ts: isTunnelClient | ||
| ? t('standalone.openvpn_tunnel.client_cert_expiry') | ||
| : t('standalone.openvpn_tunnel.cert_expiry'), | ||
| connected: t('standalone.openvpn_tunnel.connection'), | ||
| enabled: t('standalone.openvpn_tunnel.status'), | ||
| id: 'Tunnel ID', | ||
| local_network: t('standalone.openvpn_tunnel.local_networks'), | ||
| ns_name: t('standalone.openvpn_tunnel.name'), | ||
| port: t('standalone.openvpn_tunnel.port'), | ||
| real_address: t('standalone.openvpn_tunnel.real_address'), | ||
| remote_network: t('standalone.openvpn_tunnel.remote_networks'), | ||
| since: t('standalone.openvpn_tunnel.since'), | ||
| topology: t('standalone.openvpn_tunnel.topology'), | ||
| virtual_address: t('standalone.openvpn_tunnel.virtual_address'), | ||
| vpn_network: t('standalone.openvpn_tunnel.vpn_network'), | ||
| remote_host: t('standalone.openvpn_tunnel.remote_host') | ||
| } | ||
| }) |
Collaborator
There was a problem hiding this comment.
Not liking this approach, since you're not re-using this, you can just replace every fieldLabels['X'] with the proper t('standalone.openvpn_tunnel.bytes_received')
Collaborator
Author
There was a problem hiding this comment.
Done, replaced the function usage with the proper label directly in the template
Comment on lines
70
to
103
| function formatFieldValue(key: string, value: any): string { | ||
| if (value === null || value === undefined || value === '') return '' | ||
|
|
||
| // Handle timestamps | ||
| if ((key === 'cert_expiry_ts' || key === 'since') && typeof value === 'number') { | ||
| const date = new Date(value * 1000) | ||
| return date.toLocaleString(locale.value) | ||
| } | ||
|
|
||
| // Handle boolean-like fields | ||
| if (key === 'connected') { | ||
| return value | ||
| ? t('standalone.openvpn_tunnel.connected') | ||
| : t('standalone.openvpn_tunnel.not_connected') | ||
| } | ||
|
|
||
| if (key === 'enabled') { | ||
| return value ? t('standalone.openvpn_tunnel.enabled') : t('standalone.openvpn_tunnel.disabled') | ||
| } | ||
|
|
||
| // Handle arrays | ||
| if (Array.isArray(value)) { | ||
| return value.join(', ') | ||
| } | ||
|
|
||
| return String(value) | ||
| } | ||
|
|
||
| function isFieldVisible(key: string, value: any): boolean { | ||
| // Check if field has a meaningful value | ||
| if (value === null || value === undefined || value === '') return false | ||
| if (Array.isArray(value) && value.length === 0) return false | ||
| return true | ||
| } |
Collaborator
There was a problem hiding this comment.
These too, we are not cycling through an unknown object, we know all values, you can remove this and add this logic directly in the template below
Collaborator
Author
There was a problem hiding this comment.
Done, replaced the function usage with the correct logic for each field directly in the template
…d streamline template rendering
…ecessary whitespace
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
This pull request introduces new features and usability improvements to the OpenVPN tunnel management UI, including two new modals for certificate regeneration and tunnel details, as well as enhancements to existing components. The changes also extend the tunnel data model to support new fields and improve button visibility and labeling for a more consistent user experience.
New modals and feature integration:
Added
RegenerateCertsModal.vueand integrated it intoTunnelManager.vueto allow users to regenerate certificates for tunnels, with error handling and feedback.Added
TunnelInfoModal.vueand integrated it intoTunnelManager.vueto display detailed information about a selected tunnel, including new fields like certificate expiry, bytes sent/received, and connection status.Tunnel data model extension:
ServerTunnelandClientTunneltypes inTunnelManager.vueto include optional fields:cert_expiry_ts,bytes_received,bytes_sent, andsince, enabling richer tunnel information displayUI and usability improvements:
Changed button kinds for adding tunnels and importing configurations from secondary to primary for better visibility in
TunnelManager.vueAdded helper text for tunnel name input in
CreateOrEditTunnelDrawer.vueand a cancel label for the delete modal inDeleteTunnelModal.vueto improve form clarity and consistencyCopyright updates:
These changes collectively improve the tunnel management experience by adding new capabilities, enhancing the UI, and ensuring the codebase remains up-to-date.
Refs: NethServer/nethsecurity#1481