mirror of
https://github.com/logos-blockchain/lssa.git
synced 2026-02-20 13:23:06 +00:00
103 lines
3.5 KiB
Rust
103 lines
3.5 KiB
Rust
use leptos::prelude::*;
|
|
use leptos_meta::{Meta, Stylesheet, Title, provide_meta_context};
|
|
use leptos_router::{
|
|
ParamSegment, StaticSegment,
|
|
components::{Route, Router, Routes},
|
|
};
|
|
use pages::{AccountPage, BlockPage, MainPage, TransactionPage};
|
|
|
|
pub mod api;
|
|
mod components;
|
|
mod format_utils;
|
|
mod pages;
|
|
|
|
/// Main application component with routing setup.
|
|
///
|
|
/// # Routes
|
|
///
|
|
/// - `/` - Main page with search and recent blocks
|
|
/// - `/block/:id` - Block detail page (`:id` is the numeric block ID)
|
|
/// - `/transaction/:hash` - Transaction detail page (`:hash` is the hex-encoded transaction hash)
|
|
/// - `/account/:id` - Account detail page (`:id` is the hex-encoded account ID)
|
|
///
|
|
/// All other routes will show a 404 Not Found page.
|
|
#[component]
|
|
pub fn App() -> impl IntoView {
|
|
// Provides context that manages stylesheets, titles, meta tags, etc.
|
|
provide_meta_context();
|
|
|
|
view! {
|
|
<Stylesheet id="leptos" href="/explorer.css" />
|
|
<Title text="LEE Blockchain Explorer" />
|
|
<Meta name="description" content="Explore the blockchain - view blocks, transactions, and accounts" />
|
|
|
|
<Router>
|
|
<div class="app">
|
|
<header class="app-header">
|
|
<nav class="app-nav">
|
|
<a href="/" class="nav-logo">
|
|
"LEE Blockchain Explorer"
|
|
</a>
|
|
</nav>
|
|
</header>
|
|
|
|
<main class="app-main">
|
|
// Route definitions:
|
|
// - MainPage: Home with search and recent blocks
|
|
// - BlockPage: Detailed block view with all transactions
|
|
// - TransactionPage: Detailed transaction view
|
|
// - AccountPage: Account state and transaction history
|
|
<Routes fallback=|| view! { <NotFound /> }>
|
|
// Main page - search and recent blocks
|
|
<Route path=StaticSegment("") view=MainPage />
|
|
|
|
// Block detail page - /block/123
|
|
<Route path=(StaticSegment("block"), ParamSegment("id")) view=BlockPage />
|
|
|
|
// Transaction detail page - /transaction/0abc123...
|
|
<Route
|
|
path=(StaticSegment("transaction"), ParamSegment("hash"))
|
|
view=TransactionPage
|
|
/>
|
|
|
|
// Account detail page - /account/0def456...
|
|
<Route
|
|
path=(StaticSegment("account"), ParamSegment("id"))
|
|
view=AccountPage
|
|
/>
|
|
</Routes>
|
|
</main>
|
|
|
|
<footer class="app-footer">
|
|
<p>"LEE Blockchain Explorer © 2026"</p>
|
|
</footer>
|
|
</div>
|
|
</Router>
|
|
}
|
|
}
|
|
|
|
/// 404 Not Found page component.
|
|
///
|
|
/// Displayed when a user navigates to a route that doesn't exist.
|
|
#[component]
|
|
fn NotFound() -> impl IntoView {
|
|
view! {
|
|
<div class="not-found-page">
|
|
<h1>"404"</h1>
|
|
<p>"Page not found"</p>
|
|
<a href="/">"Go back to home"</a>
|
|
</div>
|
|
}
|
|
}
|
|
|
|
#[cfg(feature = "hydrate")]
|
|
#[wasm_bindgen::prelude::wasm_bindgen]
|
|
pub fn hydrate() {
|
|
use leptos::mount::hydrate_body;
|
|
|
|
console_error_panic_hook::set_once();
|
|
console_log::init_with_level(log::Level::Debug).expect("error initializing logger");
|
|
|
|
hydrate_body(App);
|
|
}
|