Add dioxus components

examples/dioxus-desktop/Cargo.toml

@@ -37,3 +37,7 @@ features = ["orm-sqlite"]
 [dependencies.zino-model]
 path = "../../zino-model"
 version = "0.11.5"
+
+[dependencies.zino-dioxus]
+path = "../../zino-dioxus"
+version = "0.1.0"

examples/dioxus-desktop/src/view/layout.rs

@@ -2,116 +2,75 @@ use crate::router::Route;
 use dioxus::prelude::*;
 use dioxus_free_icons::{
     icons::{bs_icons::*, fa_brands_icons::FaRust, fa_solid_icons::FaCubes},
-    Icon,
+    Icon as SvgIcon,
 };
 use dioxus_router::prelude::*;
+use zino_dioxus::prelude::*;
 
 pub fn Wrapper(cx: Scope) -> Element {
-    let nav_item_classes = use_state(cx, || ["is-active", "", ""]);
     render! {
-        nav {
-            class: "navbar is-link",
-            div {
-                class: "navbar-menu is-active",
-                div {
-                    class: "navbar-start",
-                    Link {
-                        class: "navbar-item {nav_item_classes[0]}",
-                        to: Route::Overview {},
-                        onclick: move |_| {
-                            nav_item_classes.set(["is-active", "", ""]);
-                        },
+        Navbar {
+            NavbarStart {
+                NavbarLink {
+                    to: Route::Overview {},
+                    IconText {
                         Icon {
-                            width: 16,
-                            height: 16,
-                            icon: BsSpeedometer2,
-                        }
-                        span {
-                            class: "ml-1",
-                            "Overview"
+                            SvgIcon { icon: BsSpeedometer2 }
                         }
+                        span { "Overview" }
                     }
-                    Link {
-                        class: "navbar-item {nav_item_classes[1]}",
-                        to: Route::StargazerList {},
-                        onclick: move |_| {
-                            nav_item_classes.set(["", "is-active", ""]);
-                        },
+                }
+                NavbarLink {
+                    to: Route::StargazerList {},
+                    IconText {
                         Icon {
-                            width: 16,
-                            height: 16,
-                            icon: BsStars,
-                        }
-                        span {
-                            class: "ml-1",
-                            "Stargazers"
+                            SvgIcon { icon: BsStars }
                         }
+                        span { "Stargazers" }
                     }
-                    Link {
-                        class: "navbar-item {nav_item_classes[2]}",
-                        to: Route::DependencyList {},
-                        onclick: move |_| {
-                            nav_item_classes.set(["", "", "is-active"]);
-                        },
+                }
+                NavbarLink {
+                    to: Route::DependencyList {},
+                    IconText {
                         Icon {
-                            width: 16,
-                            height: 16,
-                            icon: BsBricks,
-                        }
-                        span {
-                            class: "ml-1",
-                            "Dependencies"
+                            SvgIcon { icon: BsBricks }
                         }
+                        span { "Dependencies" }
                     }
                 }
-                div {
-                    class: "navbar-end",
-                    a {
-                        class: "navbar-item",
-                        href: "https://github.com/photino/zino",
+            }
+            NavbarEnd {
+                NavbarLink {
+                    to: "https://github.com/photino/zino",
+                    IconText {
                         Icon {
-                            width: 16,
-                            height: 16,
-                            icon: BsGithub,
-                        }
-                        span {
-                            class: "ml-1",
-                            "github"
+                            SvgIcon { icon: BsGithub }
                         }
+                        span { "github" }
                     }
-                    a {
-                        class: "navbar-item",
-                        href: "https://crates.io/crates/zino",
+                }
+                NavbarLink {
+                    to: "https://crates.io/crates/zino",
+                    IconText {
                         Icon {
-                            width: 16,
-                            height: 16,
-                            icon: FaRust,
-                        }
-                        span {
-                            class: "ml-1",
-                            "crates.io"
+                            SvgIcon { icon: FaRust }
                         }
+                        span { "crates.io" }
                     }
-                    a {
-                        class: "navbar-item",
-                        href: "https://docs.rs/zino",
+                }
+                NavbarLink {
+                    to: "https://docs.rs/zino",
+                    IconText {
                         Icon {
-                            width: 16,
-                            height: 16,
-                            icon: FaCubes,
-                        }
-                        span {
-                            class: "ml-1",
-                            "docs.rs"
+                            SvgIcon { icon: FaCubes }
                         }
+                        span { "docs.rs" }
                     }
                 }
             }
         }
-        main {
-            class: "my-4 px-4",
+        MainContainer {
             Outlet::<Route> {}
         }
-        footer {}
     }
 }

examples/dioxus-desktop/src/view/overview.rs

@@ -49,12 +49,6 @@ pub fn Overview(cx: Scope) -> Element {
                             class: "mr-2",
                             src: "https://img.shields.io/github/languages/code-size/photino/zino",
                         }
-                        img {
-                            class: "mr-2",
-                            width: 123,
-                            height: 20,
-                            src: "https://tokei.rs/b1/github/photino/zino",
-                        }
                         a {
                             class: "mr-2",
                             href: "https://github.com/photino/zino/stargazers",

zino-core/Cargo.toml

@@ -144,7 +144,7 @@ dotenvy = "0.15.7"
 etag = "4.0.0"
 faster-hex = "0.8.1"
 fluent = "0.16.0"
-futures = "0.3.28"
+futures = "0.3.29"
 hkdf = "0.12.3"
 hmac = "0.12.1"
 http = "0.2.9"
@@ -239,6 +239,10 @@ optional = true
 version = "0.5.1"
 optional = true
 
+[dependencies.smallvec]
+version = "1.11.1"
+features = ["serde"]
+
 [dependencies.sqlx]
 version = "0.7.2"
 optional = true
@@ -290,11 +294,13 @@ features = [
 
 [dev-dependencies]
 anyhow = "1.0.75"
+arrayvec = "0.7.4"
 base64-simd = "0.8.0"
 criterion = "0.5.1"
 data-encoding = "2.4.0"
 libsm = "0.5.1"
 sm3 = "0.4.2"
+smallvec = "1.11.1"
 sonic-rs = "0.1.3"
 tinyvec = { version = "1.6.0", features = ["alloc"] }
 uuid-simd = "0.8.0"

zino-core/benches/hashmap_vec.rs

@@ -23,7 +23,18 @@ pub fn bench(c: &mut criterion::Criterion) {
     });
     c.bench_function("arrayvec_lookup", |b| {
         b.iter(|| {
-            let mut vec = tinyvec::ArrayVec::<[_; 3]>::new();
+            let mut vec = arrayvec::ArrayVec::<_, 3>::new();
+            vec.push(("en-US", "Welcome!"));
+            vec.push(("zh-CN", "欢迎！"));
+            vec.push(("zh-HK", "歡迎！"));
+            vec.iter()
+                .find_map(|(lang, text)| (lang == &"zh-CN").then_some(text))
+                .is_some()
+        })
+    });
+    c.bench_function("smallvec_lookup", |b| {
+        b.iter(|| {
+            let mut vec = smallvec::SmallVec::<[_; 3]>::new();
             vec.push(("en-US", "Welcome!"));
             vec.push(("zh-CN", "欢迎！"));
             vec.push(("zh-HK", "歡迎！"));

zino-core/src/orm/mod.rs

@@ -21,6 +21,7 @@
 
 use crate::{extension::TomlTableExt, state::State};
 use convert_case::{Case, Casing};
+use smallvec::SmallVec;
 use sqlx::{
     pool::{Pool, PoolOptions},
     Connection,
@@ -253,7 +254,7 @@ impl ConnectionPool {
 
 /// A list of database connection pools.
 #[derive(Debug)]
-struct ConnectionPools(Vec<ConnectionPool>);
+struct ConnectionPools(SmallVec<[ConnectionPool; 3]>);
 
 impl ConnectionPools {
     /// Returns a connection pool with the specific name.
@@ -274,7 +275,7 @@ impl ConnectionPools {
 static SHARED_CONNECTION_POOLS: LazyLock<ConnectionPools> = LazyLock::new(|| {
     let config = State::shared().config();
     let Some(database_config) = config.get_table("database") else {
-        return ConnectionPools(Vec::new());
+        return ConnectionPools(SmallVec::new());
     };
 
     // Database connection pools.

zino-core/src/response/mod.rs

@@ -15,6 +15,7 @@ use etag::EntityTag;
 use http::header::{self, HeaderName, HeaderValue};
 use http_body::Full;
 use serde::Serialize;
+use smallvec::SmallVec;
 use std::{
     marker::PhantomData,
     time::{Duration, Instant},
@@ -93,7 +94,7 @@ pub struct Response<S = StatusCode> {
     server_timing: ServerTiming,
     /// Custom headers.
     #[serde(skip)]
-    headers: Vec<(SharedString, String)>,
+    headers: SmallVec<[(SharedString, String); 5]>,
     /// Phantom type of response code.
     #[serde(skip)]
     phantom: PhantomData<S>,
@@ -121,7 +122,7 @@ impl<S: ResponseCode> Response<S> {
             content_type: None,
             trace_context: None,
             server_timing: ServerTiming::new(),
-            headers: Vec::new(),
+            headers: SmallVec::new(),
             phantom: PhantomData,
         };
         if success {
@@ -153,7 +154,7 @@ impl<S: ResponseCode> Response<S> {
             content_type: None,
             trace_context: None,
             server_timing: ServerTiming::new(),
-            headers: Vec::new(),
+            headers: SmallVec::new(),
             phantom: PhantomData,
         };
         if success {
@@ -598,7 +599,7 @@ impl<S: ResponseCode> Response<S> {
     }
 
     /// Consumes `self` and returns the custom headers.
-    pub fn finalize(mut self) -> Vec<(SharedString, String)> {
+    pub fn finalize(mut self) -> impl Iterator<Item = (SharedString, String)> {
         let request_id = self.request_id();
         if !request_id.is_nil() {
             self.insert_header("x-request-id", request_id.to_string());
@@ -612,7 +613,7 @@ impl<S: ResponseCode> Response<S> {
         self.record_server_timing("total", None, Some(duration));
         self.insert_header("server-timing", self.server_timing());
 
-        self.headers
+        self.headers.into_iter()
     }
 }
 

zino-core/src/trace/server_timing.rs

@@ -1,20 +1,21 @@
 use crate::trace::TimingMetric;
+use smallvec::SmallVec;
 use std::fmt;
 
 /// Performance metrics for the request-response cycle.
 /// See [the spec](https://w3c.github.io/server-timing).
 #[derive(Debug, Clone)]
 pub struct ServerTiming {
     /// Server timing metrics.
-    metrics: Vec<TimingMetric>,
+    metrics: SmallVec<[TimingMetric; 3]>,
 }
 
 impl ServerTiming {
     /// Creates a new instance.
     #[inline]
     pub fn new() -> Self {
         Self {
-            metrics: Vec::new(),
+            metrics: SmallVec::new(),
         }
     }
 

zino-core/src/trace/trace_state.rs

@@ -1,18 +1,21 @@
 use crate::SharedString;
+use smallvec::SmallVec;
 use std::fmt;
 
 /// A record of vendor-specific trace data across tracing systems.
 #[derive(Debug, Clone)]
 pub struct TraceState {
     /// Vendor-specific trace state.
-    states: Vec<(SharedString, String)>,
+    states: SmallVec<[(SharedString, String); 3]>,
 }
 
 impl TraceState {
     /// Creates a new instance.
     #[inline]
     pub fn new() -> Self {
-        Self { states: Vec::new() }
+        Self {
+            states: SmallVec::new(),
+        }
     }
 
     /// Constructs an instance from the `tracestate` header value.
@@ -25,7 +28,7 @@ impl TraceState {
                     .split_once('=')
                     .map(|(key, value)| (key.to_owned().into(), value.to_owned()))
             })
-            .collect::<Vec<_>>();
+            .collect();
         Self { states }
     }
 

zino-dioxus/Cargo.toml

@@ -13,3 +13,10 @@ readme = "README.md"
 
 [dependencies]
 dioxus = "0.4.0"
+dioxus-router = "0.4.1"
+dioxus-free-icons = "0.7.0"
+smallvec = "1.11.1"
+
+[dependencies.zino-core]
+path = "../zino-core"
+version = "0.14.5"

zino-dioxus/README.md

@@ -11,11 +11,12 @@ Dioxus components for [`zino`].
 # Design references
 
 The design of our components is inspired by [`Ant Design`], [`Bootstrap`], [`Bulma`],
-and [`Element Plus`].
+[`daisyUI`] and [`Element Plus`].
 
 [`zino`]: https://github.com/photino/zino
 [`Ant Design`]: https://ant.design/
 [`Bootstrap`]: https://getbootstrap.com/
 [`Bulma`]: https://bulma.io/
+[`daisyUI`]: https://daisyui.com/
 [`Element Plus`]: https://element-plus.org/