Skip to content
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

feat(ui): add TTL support and expiration management #4504

Merged
merged 1 commit into from
Jan 20, 2025

Conversation

luannmoreira
Copy link
Member

Description

This PR introduces Time-To-Live (TTL) support and expiration management for tunnels. It includes updates to the API, frontend components, and tests to accommodate the new TTL feature. Users can now specify a tunnel's TTL when creating it and view its expiration details in the tunnel list.
Changes
API Updates

Added ttl field:
    CreateTunnelRequest and Tunnel interfaces now support ttl for tunnel creation.
    Backend API methods (listTunnels, createTunnel) updated to handle TTL and pagination (page, perPage).
New expiration fields:
    expires_in added to Tunnel to represent expiration details.

Frontend Updates

TunnelCreate.vue:
    Added a combobox for TTL selection with predefined timeouts (e.g., 1 minute, 1 hour, 1 week).
    Validates TTL input using yup.
TunnelList.vue:
    Displays expiration date (expires_in) in a new column.
    Highlights expired tunnels with a warning style.

Utilities

Used moment for expiration date formatting and expiration checks.

Tests

Updated TunnelCreate.spec.ts and TunnelList.spec.ts to verify TTL functionality.
Added snapshot updates for TunnelList.

How to Test

Create a tunnel with TTL:
    Navigate to the "Create Tunnel" modal and select a TTL value.
    Verify the tunnel is created with the specified TTL.

View tunnel expiration:
    Navigate to the "Tunnel List" page.
    Confirm expiration dates are displayed and expired tunnels are highlighted.

Run tests:
    Execute unit tests to ensure functionality (yarn test).

Checklist

  • Added TTL functionality to API and frontend.
  • Updated tests and snapshots.
  • Verified backward compatibility with existing features.
  • Added documentation or comments where necessary.

@luannmoreira luannmoreira added kind/feature New feature or request area/ui javascript Pull requests that update Javascript code status/ready-for-testing status/good-to-merge labels Jan 20, 2025
@luannmoreira luannmoreira self-assigned this Jan 20, 2025
@luannmoreira luannmoreira requested a review from a team as a code owner January 20, 2025 12:46
Updated CreateTunnelRequest and Tunnel interfaces to include ttl and
expires_in fields.

Extended backend APIs (listTunnels, createTunnel) to handle pagination
(page, perPage) and TTL functionality.

Added UI support in TunnelCreate.vue for selecting a timeout (ttl) via a
combobox.

Displayed expiration date in TunnelList.vue, highlighting expired tunnels.

Implemented validation and formatting logic for TTL and expiration date
handling using moment.

Updated tests for TunnelCreate and TunnelList components to verify TTL-related
functionality and new expiration fields.
Adjusted snapshot for TunnelList to reflect the new table header and rows.
@luannmoreira luannmoreira force-pushed the feat/tunnel-expiration branch from fa1712d to d1ca957 Compare January 20, 2025 13:09
@gustavosbarreto gustavosbarreto merged commit 15fca26 into master Jan 20, 2025
8 checks passed
@gustavosbarreto gustavosbarreto deleted the feat/tunnel-expiration branch January 20, 2025 13:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area/ui javascript Pull requests that update Javascript code kind/feature New feature or request status/good-to-merge status/ready-for-testing
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants