-
Notifications
You must be signed in to change notification settings - Fork 4
feat(openvpn-tunnel): update certs duration and add certs regeneration functionality #679
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Conversation
f701321 to
b006289
Compare
| 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') | ||
| } | ||
| }) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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')
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done, replaced the function usage with the proper label directly in the template
| 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 | ||
| } |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
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
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done, replaced the function usage with the correct logic for each field directly in the template
…d streamline template rendering
…ecessary whitespace
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