All checks were successful
CI / Format (push) Successful in 30s
CI / Clippy (push) Successful in 2m36s
CI / Security Audit (push) Has been skipped
CI / Tests (push) Has been skipped
CI / Format (pull_request) Successful in 3s
CI / Clippy (pull_request) Successful in 2m15s
CI / Security Audit (pull_request) Has been skipped
CI / Tests (pull_request) Has been skipped
CI / Deploy (push) Has been skipped
CI / Deploy (pull_request) Has been skipped
Add a compile-time i18n system with 270 translation keys across 5 locales (EN, DE, FR, ES, PT). Translations are embedded via include_str! and parsed lazily into flat HashMaps with English fallback for missing keys. - Add src/i18n module with Locale enum, t()/tw() lookup functions, and tests - Add JSON translation files for all 5 locales under assets/i18n/ - Provide locale Signal via Dioxus context in App, persisted to localStorage - Replace all hardcoded UI strings across 33 component/page files - Add compact locale picker (globe icon + ISO alpha-2 code) in sidebar header - Add click-outside backdrop dismissal for locale dropdown Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
50 lines
1.6 KiB
Rust
50 lines
1.6 KiB
Rust
use dioxus::prelude::*;
|
|
|
|
use crate::i18n::{t, Locale};
|
|
use crate::models::McpTool;
|
|
|
|
/// Renders an MCP tool card with name, description, status indicator, and toggle.
|
|
///
|
|
/// # Arguments
|
|
///
|
|
/// * `tool` - The MCP tool data to render
|
|
/// * `on_toggle` - Callback fired when the enable/disable toggle is clicked
|
|
#[component]
|
|
pub fn ToolCard(tool: McpTool, on_toggle: EventHandler<String>) -> Element {
|
|
let locale = use_context::<Signal<Locale>>();
|
|
let l = *locale.read();
|
|
|
|
let status_class = format!("tool-status tool-status--{}", tool.status.css_class());
|
|
let toggle_class = if tool.enabled {
|
|
"tool-toggle tool-toggle--on"
|
|
} else {
|
|
"tool-toggle tool-toggle--off"
|
|
};
|
|
|
|
rsx! {
|
|
div { class: "tool-card",
|
|
div { class: "tool-card-header",
|
|
div { class: "tool-card-icon", "\u{2699}" }
|
|
span { class: "{status_class}", "" }
|
|
}
|
|
h3 { class: "tool-card-name", "{tool.name}" }
|
|
p { class: "tool-card-desc", "{tool.description}" }
|
|
div { class: "tool-card-footer",
|
|
span { class: "tool-card-category", "{tool.category.label()}" }
|
|
button {
|
|
class: "{toggle_class}",
|
|
onclick: {
|
|
let id = tool.id.clone();
|
|
move |_| on_toggle.call(id.clone())
|
|
},
|
|
if tool.enabled {
|
|
"{t(l, \"common.on\")}"
|
|
} else {
|
|
"{t(l, \"common.off\")}"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|