added i18n

maccesch · maccesch · commit 26bd772afd60 · 2024-08-05T16:37:32.000+01:00
closes #49
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -36,6 +36,7 @@ jobs:
           - editable
           - generic
           - getter
+          - i18n
           - paginated_rest_datasource
           - pagination
           - selectable
diff --git a/.idea/leptos-struct-table.iml b/.idea/leptos-struct-table.iml
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,10 +1,12 @@
 # Changelog
 
-## [Unreleased]
+## [0.10.3] - 2024-08-05
 
 ### Features 🚀
 
+- Added i18n support via the `"i18n"` feature which uses `leptos-i18n`. See the `i18n` example for usage.
 - Added row reader to `TableComponent`
+- Added `default_th_sorting_style` to make it easier to write a custom thead cell render component.
 
 ## [0.10.2] - 2024-06-07
 
diff --git a/Cargo.toml b/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "leptos-struct-table"
-version = "0.10.2"
+version = "0.10.3"
 edition = "2021"
 authors = ["Marc-Stefan Cassola"]
 categories = ["gui", "web-programming"]
@@ -13,7 +13,7 @@ repository = "https://github.com/Synphonyte/leptos-struct-table"
 
 [dependencies]
 leptos = { version = "0.6" }
-leptos-struct-table-macro = { version = "0.11.0" }
+leptos-struct-table-macro = { version = "0.11.1", path = "../leptos-struct-table-macro" }
 leptos-use = "0.10"
 rust_decimal = { version = "1.35", optional = true }
 chrono = { version = "0.4", optional = true }
@@ -29,6 +29,7 @@ chrono = ["dep:chrono"]
 uuid = ["dep:uuid"]
 rust_decimal = ["dep:rust_decimal"]
 time = ["dep:time"]
+i18n = ["leptos-struct-table-macro/i18n"]
 
 [package.metadata."docs.rs"]
 all-features = true
diff --git a/README.md b/README.md
@@ -154,7 +154,7 @@ See:
 ## Classes Customization
 
 Classes can be easily customized by using the `classes_provider` attribute on the struct.
-You can specify any type that implements the trait [`TableClassesProvider`]. Please see the documentation for that trait for more information.
+You can specify any type that implementats the trait [`TableClassesProvider`]. Please see the documentation for that trait for more information.
 You can also look at [`TailwindClassesPreset`] for an example how this can be implemented.
 
 Example:
@@ -344,6 +344,14 @@ The following options are available. Check their docs for more details.
 
 Please have a look at the [pagination example](https://github.com/Synphonyte/leptos-struct-table/tree/master/examples/pagination/src/main.rs) for more information on how to use pagination.
 
+## I18n
+
+To translate the column titles of the table using `leptos-i18n` you can enable the `"i18n"`
+feature. The field names of the struct are used as keys.
+
+Please have a look at the
+[i18n example](https://github.com/Synphonyte/leptos-struct-table/tree/master/examples/i18n).
+
 ## Contribution
 
 All contributions are welcome. Please open an issue or a pull request if you have any ideas or problems.
@@ -352,9 +360,9 @@ All contributions are welcome. Please open an issue or a pull request if you hav
 
 ## Leptos Compatibility
 
-| Crate version       | Compatible Leptos version |
-|---------------------|---------------------------|
-| <= 0.2              | 0.3                       |
-| 0.3                 | 0.4                       |
-| 0.4, 0.5, 0.6       | 0.5                       |
-| 0.7, 0.8, 0.9, 0.10 | 0.6                       |
+| Crate version | Compatible Leptos version |
+|---------------|---------------------------|
+| <= 0.2        | 0.3                       |
+| 0.3           | 0.4                       |
+| 0.4, 0.5, 0.6 | 0.5                       |
+| 0.7 – 0.11    | 0.6                       |
diff --git a/examples/custom_renderers_svg/src/renderers.rs b/examples/custom_renderers_svg/src/renderers.rs
@@ -117,20 +117,7 @@ pub fn SvgHeadCellRenderer<F>(
 where
     F: Fn(TableHeadEvent) + 'static,
 {
-    let style = move || {
-        let sort = match sort_direction.get() {
-            ColumnSort::Ascending => "--sort-icon: '▲';",
-            ColumnSort::Descending => "--sort-icon: '▼';",
-            ColumnSort::None => "--sort-icon: '';",
-        };
-
-        let priority = match sort_priority.get() {
-            Some(priority) => format!("--sort-priority: '{}';", priority + 1),
-            None => "--sort-priority: '';".to_string(),
-        };
-
-        format!("{} {}", sort, &priority)
-    };
+    let style = default_th_sorting_style(sort_priority, sort_direction);
 
     let transform = transform_from_index(index, 0);
 
diff --git a/examples/i18n/Cargo.toml b/examples/i18n/Cargo.toml
@@ -0,0 +1,24 @@
+[package]
+name = "i18n"
+version = "0.1.0"
+edition = "2021"
+
+[dependencies]
+leptos = { version = "0.6", features = ["csr"] }
+leptos-struct-table = { path = "../..", features = ["chrono", "uuid", "time", "i18n"] }
+leptos_i18n = { version = "0.3", features = ["csr"] }
+chrono = { version = "0.4", features = [] }
+console_error_panic_hook = "0.1"
+time = { version = "0.3" }
+uuid = { version = "1.8", features = ["v4"] }
+console_log = "1"
+log = "0.4"
+
+[dev-dependencies]
+wasm-bindgen = "0.2"
+wasm-bindgen-test = "0.3.0"
+web-sys = "0.3"
+
+[package.metadata.leptos-i18n]
+default = "en"
+locales = ["en", "de"]
diff --git a/examples/i18n/README.md b/examples/i18n/README.md
@@ -0,0 +1,15 @@
+A simple table example showing how to integrate leptos-i18n to translate the titles.
+
+If you don't have it installed already, install [Trunk](https://trunkrs.dev/)
+as well as the wasm32-unknown-unknown target:
+
+```bash
+cargo install trunk
+rustup target add wasm32-unknown-unknown
+```
+
+Then, to run this example, execute in a terminal:
+
+```bash
+trunk serve --open
+```
diff --git a/examples/i18n/index.html b/examples/i18n/index.html
@@ -0,0 +1,5 @@
+<!DOCTYPE html>
+<html>
+  <head></head>
+  <body></body>
+</html>
diff --git a/examples/i18n/locales/de.json b/examples/i18n/locales/de.json
@@ -0,0 +1,9 @@
+{
+  "id": "ID",
+  "title": "Titel",
+  "author": "Autor",
+  "publish_date": "Veröffentlichungsdatum",
+  "read_date": "Lesedatum",
+  "description": "Beschreibung",
+  "click_to_change_lang": "Klicken um Sprache zu ändern"
+}
diff --git a/examples/i18n/locales/en.json b/examples/i18n/locales/en.json
@@ -0,0 +1,9 @@
+{
+  "id": "ID",
+  "title": "Title",
+  "author": "Author",
+  "publish_date": "Publish Date",
+  "read_date": "Read Date",
+  "description": "Description",
+  "click_to_change_lang": "Click to change language"
+}
diff --git a/examples/i18n/src/main.rs b/examples/i18n/src/main.rs
@@ -0,0 +1,94 @@
+leptos_i18n::load_locales!();
+use ::chrono::NaiveDate;
+use ::time::Date;
+use ::uuid::Uuid;
+use i18n::*;
+use leptos::*;
+use leptos_struct_table::*;
+
+/// This generates the component BookTable
+#[derive(TableRow, Clone)]
+#[table(sortable, impl_vec_data_provider)]
+pub struct Book {
+    /// Id of the entry.
+    pub id: Uuid,
+    /// Title of the book.
+    pub title: String,
+    /// Author of the book.
+    pub author: String,
+    /// Date when book has been published.
+    pub publish_date: Option<NaiveDate>,
+    /// Date when book was read
+    pub read_date: Option<Date>,
+    /// Description of the book. Optional.
+    #[table(none_value = "-")]
+    pub description: Option<String>,
+    /// Example on hidden member.
+    #[table(skip)]
+    pub hidden_field: String,
+}
+
+fn main() {
+    _ = console_log::init_with_level(log::Level::Debug);
+    console_error_panic_hook::set_once();
+
+    mount_to_body(|| {
+        let rows = vec![
+            Book {
+                id: Uuid::new_v4(),
+                title: "The Great Gatsby".to_string(),
+                author: "F. Scott Fitzgerald".to_string(),
+                publish_date: Some(NaiveDate::from_ymd_opt(1925, 4, 10).unwrap()),
+                read_date: Some(Date::from_calendar_date(2024, ::time::Month::January, 2).unwrap()),
+                description: Some(
+                    "A story of wealth, love, and the American Dream in the 1920s.".to_string(),
+                ),
+                hidden_field: "hidden".to_string(),
+            },
+            Book {
+                id: Uuid::new_v4(),
+                title: "The Grapes of Wrath".to_string(),
+                author: "John Steinbeck".to_string(),
+                publish_date: Some(NaiveDate::from_ymd_opt(1939, 4, 14).unwrap()),
+                read_date: None,
+                description: None,
+                hidden_field: "not visible in the table".to_string(),
+            },
+            Book {
+                id: Uuid::new_v4(),
+                title: "Nineteen Eighty-Four".to_string(),
+                author: "George Orwell".to_string(),
+                publish_date: Some(NaiveDate::from_ymd_opt(1949, 6, 8).unwrap()),
+                read_date: None,
+                description: None,
+                hidden_field: "hidden".to_string(),
+            },
+            Book {
+                id: Uuid::new_v4(),
+                title: "Ulysses".to_string(),
+                author: "James Joyce".to_string(),
+                publish_date: Some(NaiveDate::from_ymd_opt(1922, 2, 2).unwrap()),
+                read_date: None,
+                description: None,
+                hidden_field: "hidden".to_string(),
+            },
+        ];
+
+        let i18n = provide_i18n_context();
+
+        let on_switch = move |_| {
+            let new_lang = match i18n.get_locale() {
+                Locale::en => Locale::de,
+                Locale::de => Locale::en,
+            };
+            i18n.set_locale(new_lang);
+        };
+
+        view! {
+            <button on:click=on_switch>{t!(i18n, click_to_change_lang)}</button>
+            <table>
+                <TableContent rows=rows />
+            </table>
+        }
+    })
+}
diff --git a/src/components/thead.rs b/src/components/thead.rs
@@ -43,20 +43,7 @@ pub fn DefaultTableHeaderCellRenderer<F>(
 where
     F: Fn(TableHeadEvent) + 'static,
 {
-    let style = move || {
-        let sort = match sort_direction.get() {
-            ColumnSort::Ascending => "--sort-icon: '▲';",
-            ColumnSort::Descending => "--sort-icon: '▼';",
-            ColumnSort::None => "--sort-icon: '';",
-        };
-
-        let priority = match sort_priority.get() {
-            Some(priority) => format!("--sort-priority: '{}';", priority + 1),
-            None => "--sort-priority: '';".to_string(),
-        };
-
-        format!("{} {}", sort, &priority)
-    };
+    let style = default_th_sorting_style(sort_priority, sort_direction);
 
     view! {
         <th class=class
@@ -72,3 +59,26 @@ where
         </th>
     }
 }
+
+/// You can use this function to implement your own custom table header cell renderer.
+///
+/// See the implementation of [`DefaultTableHeaderCellRenderer`].
+pub fn default_th_sorting_style(
+    sort_priority: Signal<Option<usize>>,
+    sort_direction: Signal<ColumnSort>,
+) -> Signal<String> {
+    Signal::derive(move || {
+        let sort = match sort_direction.get() {
+            ColumnSort::Ascending => "--sort-icon: '▲';",
+            ColumnSort::Descending => "--sort-icon: '▼';",
+            ColumnSort::None => "--sort-icon: '';",
+        };
+
+        let priority = match sort_priority.get() {
+            Some(priority) => format!("--sort-priority: '{}';", priority + 1),
+            None => "--sort-priority: '';".to_string(),
+        };
+
+        format!("{} {}", sort, &priority)
+    })
+}
diff --git a/src/events.rs b/src/events.rs
@@ -33,37 +33,44 @@ pub struct TableHeadEvent {
     pub mouse_event: MouseEvent,
 }
 
-macro_rules! impl_event_handler {
+macro_rules! impl_default_rc_fn {
     (
         $(#[$meta:meta])*
         $name:ident<$($ty:ident),*>($($arg_name:ident: $arg_ty:ty),*)
+        $(-> $ret_ty:ty)?
+        $({ default $default_return:expr })?
     ) => {
         $(#[$meta])*
         #[derive(Clone)]
-        pub struct $name<$($ty),*>(Rc<dyn Fn($($arg_ty),*)>);
+        pub struct $name<$($ty),*>(Rc<dyn Fn($($arg_ty),*) $(-> $ret_ty)?>);
 
         impl<$($ty),*> Default for $name<$($ty),*> {
             fn default() -> Self {
-                Self(Rc::new(|$(_: $arg_ty),*| {}))
+                #[allow(unused_variables)]
+                Self(Rc::new(|$($arg_name: $arg_ty),*| {
+                    $($default_return)?
+                }))
             }
         }
 
         impl<F, $($ty),*> From<F> for $name<$($ty),*>
-            where F: Fn($($arg_ty),*) + 'static
+            where F: Fn($($arg_ty),*) $(-> $ret_ty)? + 'static
         {
             fn from(f: F) -> Self { Self(Rc::new(f)) }
         }
 
         impl<$($ty),*> $name<$($ty),*> {
-            pub fn run(&self, $($arg_name: $arg_ty),*) {
-                (self.0)($($arg_name),*);
+            pub fn run(&self, $($arg_name: $arg_ty),*) $(-> $ret_ty)? {
+                (self.0)($($arg_name),*)
             }
         }
     }
 }
 
-impl_event_handler!(
+impl_default_rc_fn!(
     /// New type wrapper of a closure that takes a parameter `T`. This allows the event handler props
     /// to be optional while being able to take a simple closure.
     EventHandler<T>(event: T)
 );
+
+pub(crate) use impl_default_rc_fn;
diff --git a/src/lib.rs b/src/lib.rs
diff --git a/src/row_reader.rs b/src/row_reader.rs
