纯 Rust 跨平台应用框架。 零 WebView，8 端 GPU 硬件直绘。

use gpux::prelude::*;
use gpux::ui::component::button::{Button, ButtonVariants as _};
use gpux::ui::theme::{ActiveTheme as _, Theme, ThemeMode};

pub struct ClusterMonitor {
    services: ServiceRegistry,
    store: Store<ClusterState>,
    router: Router<Route>,
}

impl Render for ClusterMonitor {
    fn render(&mut self, win: &mut Window, cx: &mut Context<Self>) -> impl IntoElement {
        let state = self.store.read();
        let theme = cx.theme();

        v_flex()
            .size_full().p_5().gap_4()
            .bg(theme.background).text_color(theme.foreground)
            .child(
                h_flex().justify_between().items_center()
                    .child(format!("活跃 GPU 节点: {} · P99: {:.2}ms", state.nodes, state.p99_ms))
                    .child(
                        Button::new("theme-btn").ghost().small()
                            .label("切换主题")
                            .on_click(cx.listener(|_, _, win, cx| {
                                Theme::change(ThemeMode::Dark, Some(win), cx);
                            })),
                    ),
            )
            .child(
                h_flex().gap_2()
                    .child(
                        Button::new("scale-up").primary()
                            .label("+ 扩容推理节点")
                            .on_click(cx.listener(|this, _, _, cx| {
                                this.store.update(|s| s.nodes += 1);
                                cx.notify();
                            })),
                    )
                    .child(
                        Button::new("inspect-rpc").outline()
                            .label("采样集群快照 (ServiceRegistry)")
                            .on_click(cx.listener(Self::on_sample_snapshot)),
                    ),
            )
    }
}

use gpux::prelude::*;
use serde::{Deserialize, Serialize};

#[derive(Debug, Serialize, Deserialize)]
pub struct InspectReq { pub region: String, pub include_vram: bool }

#[derive(Debug, Serialize, Deserialize)]
pub struct ClusterSnapshot {
    pub healthy_nodes: u32,
    pub vram_used_mb: f32,
    pub frame_budget_ms: f32,
}

// 1. 普通强类型 Rust 函数即可作为服务，无需过程宏标记
pub fn inspect_cluster(req: InspectReq) -> anyhow::Result<ClusterSnapshot> {
    Ok(ClusterSnapshot {
        healthy_nodes: 16,
        vram_used_mb: if req.include_vram { 24.8 } else { 0.0 },
        frame_budget_ms: 0.14,
    })
}

// 2. 在视图中以 1.2µs 极低延迟直接做类型安全调用
impl ClusterMonitor {
    fn on_sample_snapshot(&mut self, _: &ClickEvent, _: &mut Window, cx: &mut Context<Self>) {
        let req = InspectReq { region: "ap-east-1".into(), include_vram: true };
        if let Ok(snap) = self.services.call::<InspectReq, ClusterSnapshot>("cluster.inspect", &req) {
            self.store.update(|s| {
                s.nodes = snap.healthy_nodes;
                s.p99_ms = snap.frame_budget_ms;
            });
            cx.notify();
        }
    }
}

use gpux::prelude::*;

impl ClusterMonitor {
    pub fn render_adaptive_shell(&mut self, width: f32, height: f32) -> Div {
        // 根据视口宽度自动计算 Compact (<600px) / Medium / Expanded 断点
        let responsive = ResponsiveContext::from_viewport(width, height)
            .with_safe_area(if width < 600.0 {
                SafeAreaInsets::ios_notch() // top: 59pt, bottom: 34pt
            } else {
                SafeAreaInsets::zero()
            });

        let mut root = v_flex()
            .size_full()
            .pt(px(responsive.safe_area.top))
            .pb(px(responsive.safe_area.bottom));

        if responsive.is_mobile() {
            // 移动与小程序端：单列卡片流 + 底部手势返回路由栈
            root.px_4()
                .child(self.render_mobile_cards())
                .child(self.render_bottom_tab_bar(self.router.can_go_back()))
        } else {
            // 桌面与宽屏平板：左侧导航侧边栏 + 多列监控网格
            root.px_6().child(
                h_flex().size_full().gap_5()
                    .child(self.render_desktop_sidebar())
                    .child(self.render_telemetry_grid(responsive.breakpoint.recommended_columns())),
            )
        }
    }
}

use gpux::prelude::*;

pub fn build_app() -> gpux::App {
    App::from_manifest(AppManifest::default_for("GPUX Studio"))
        .title("GPUX Telemetry Studio")
        .size(1120.0, 720.0)
        .bind("cluster.inspect", inspect_cluster)
        .with_state(ClusterState::default())
}

// 桌面端入口 (macOS Metal / Linux Vulkan / Windows DX12)
pub fn run_desktop() -> anyhow::Result<()> {
    build_app().run_with_view(|services, win, cx| {
        ClusterMonitor::new(services, win, cx)
    })
}

// 移动端 C-ABI 导出 (iOS UIKit / Android NativeActivity / 鸿蒙 XComponent)
#[unsafe(no_mangle)]
pub extern "C" fn gpux_mobile_entry() -> i32 {
    match build_app().run_mobile() { Ok(_) => 0, Err(_) => -1 }
}

// Web (WASM) 与小程序端入口 (WebGPU / WebGL2 + CJK/Emoji 字体回退)
#[cfg(target_arch = "wasm32")]
#[wasm_bindgen::prelude::wasm_bindgen(start)]
pub fn wasm_main() -> Result<(), wasm_bindgen::JsValue> {
    build_app().run_web_with_view("gpux-canvas", |s, w, cx| ClusterMonitor::new(s, w, cx))
        .map_err(|e| wasm_bindgen::JsValue::from_str(&e.to_string()))
}