feat(navigation): link app names on host detail to app detail with back button
- Host detail: application names are now clickable links to
/applications/:id?back=/hosts/:host_id
- Application detail: back button reads the ?back query param and
returns to the originating host page (label "← Host") or falls
back to /applications ("← Applications")
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -7,7 +7,7 @@
|
||||
// - Delete button : confirmation modal, then navigates back to /applications
|
||||
|
||||
use leptos::prelude::*;
|
||||
use leptos_router::hooks::{use_navigate, use_params_map};
|
||||
use leptos_router::hooks::{use_navigate, use_params_map, use_query_map};
|
||||
|
||||
use crate::api::applications::{
|
||||
AddPortToApplication, DeleteApplication, RemovePortFromApplication,
|
||||
@@ -66,6 +66,16 @@ pub fn ApplicationDetailPage() -> impl IntoView {
|
||||
.unwrap_or(0)
|
||||
};
|
||||
|
||||
let query = use_query_map();
|
||||
let back_url = move || {
|
||||
query.read().get("back")
|
||||
.map(|s| s.to_string())
|
||||
.unwrap_or_else(|| "/applications".to_string())
|
||||
};
|
||||
let back_label = move || {
|
||||
if back_url().starts_with("/hosts/") { "← Host" } else { "← Applications" }
|
||||
};
|
||||
|
||||
let update_action = ServerAction::<UpdateApplication>::new();
|
||||
let add_port_action = ServerAction::<AddPortToApplication>::new();
|
||||
let remove_port_action = ServerAction::<RemovePortFromApplication>::new();
|
||||
@@ -182,7 +192,9 @@ pub fn ApplicationDetailPage() -> impl IntoView {
|
||||
view! {
|
||||
// ── Page header ───────────────────────────────────
|
||||
<div class="page-header detail-page-header">
|
||||
<a class="back-btn" href="/applications">"← Applications"</a>
|
||||
<a class="back-btn" href=move || back_url()>
|
||||
{move || back_label()}
|
||||
</a>
|
||||
<h1 class="detail-page-title">{move || name_sig.get()}</h1>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -385,7 +385,10 @@ pub fn HostDetailPage() -> impl IntoView {
|
||||
let app_id = app.id;
|
||||
view! {
|
||||
<div class="app-row">
|
||||
<span class="app-row__name">{app.name}</span>
|
||||
<a class="table-link"
|
||||
href=format!("/applications/{}?back=/hosts/{}", app_id, id)>
|
||||
{app.name}
|
||||
</a>
|
||||
<button
|
||||
class="btn-danger"
|
||||
type="button"
|
||||
|
||||
Reference in New Issue
Block a user