Files
certifai/src/components/pricing_card.rs
Sharang Parnerkar d814e22f9d
All checks were successful
CI / Format (push) Successful in 3s
CI / Clippy (push) Successful in 3m4s
CI / Security Audit (push) Successful in 1m39s
CI / Tests (push) Successful in 4m26s
CI / Deploy (push) Successful in 5s
feat(i18n): add internationalization with DE, FR, ES, PT translations (#12)
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>

Co-authored-by: Sharang Parnerkar <parnerkarsharang@gmail.com>
Reviewed-on: #12
2026-02-22 16:48:51 +00:00

52 lines
1.6 KiB
Rust

use dioxus::prelude::*;
use crate::i18n::{t, tw, Locale};
use crate::models::PricingPlan;
/// Renders a pricing plan card with features list and call-to-action button.
///
/// # Arguments
///
/// * `plan` - The pricing plan data to render
/// * `on_select` - Callback fired when the CTA button is clicked
#[component]
pub fn PricingCard(plan: PricingPlan, on_select: EventHandler<String>) -> Element {
let locale = use_context::<Signal<Locale>>();
let l = *locale.read();
let card_class = if plan.highlighted {
"pricing-card pricing-card--highlighted"
} else {
"pricing-card"
};
let seats_label = match plan.max_seats {
Some(n) => tw(l, "common.up_to_seats", &[("n", &n.to_string())]),
None => t(l, "common.unlimited_seats"),
};
rsx! {
div { class: "{card_class}",
h3 { class: "pricing-card-name", "{plan.name}" }
div { class: "pricing-card-price",
span { class: "pricing-card-amount", "{plan.price_eur}" }
span { class: "pricing-card-period", " {t(l, \"common.eur_per_month\")}" }
}
p { class: "pricing-card-seats", "{seats_label}" }
ul { class: "pricing-card-features",
for feature in &plan.features {
li { "{feature}" }
}
}
button {
class: "pricing-card-cta",
onclick: {
let id = plan.id.clone();
move |_| on_select.call(id.clone())
},
"{t(l, \"common.get_started\")}"
}
}
}
}