Rewrite some components to use render method

jirs-client/src/components/styled_checkbox.rs

@@ -81,7 +81,7 @@ impl<'l> ChildBuilder<'l> {
     }
 }
 
-#[derive(Debug, Default)]
+#[derive(Debug)]
 pub struct StyledCheckbox<'l, Options>
 where
     Options: Iterator<Item = ChildBuilder<'l>>,
@@ -90,6 +90,18 @@ where
     pub class_list: &'l str,
 }
 
+impl<'l, Options> Default for StyledCheckbox<'l, Options>
+where
+    Options: Iterator<Item = ChildBuilder<'l>>,
+{
+    fn default() -> Self {
+        Self {
+            options: None,
+            class_list: "",
+        }
+    }
+}
+
 impl<'l, Options> StyledCheckbox<'l, Options>
 where
     Options: Iterator<Item = ChildBuilder<'l>>,

jirs-client/src/components/styled_editor.rs

@@ -49,15 +49,9 @@ impl<'l> Default for StyledEditor<'l> {
     }
 }
 
-impl<'l> ToNode for StyledEditor<'l> {
+impl<'l> StyledEditor<'l> {
     #[inline]
-    fn into_node(self) -> Node<Msg> {
+    pub fn render(self) -> Node<Msg> {
-        render(self)
-    }
-}
-
-#[inline]
-pub fn render(values: StyledEditor) -> Node<Msg> {
         let StyledEditor {
             id,
             initial_text,
@@ -65,7 +59,7 @@ pub fn render(values: StyledEditor) -> Node<Msg> {
             html,
             mode,
             update_event,
-    } = values;
+        } = self;
 
         let id = id.expect("Styled Editor requires ID");
         let on_editor_clicked = click_handler(id.clone(), Mode::Editor);
@@ -87,51 +81,49 @@ pub fn render(values: StyledEditor) -> Node<Msg> {
         }
         .into_node();
 
-    let (editor_radio_node, view_radio_node) = (
+        div![
+            C!["styledEditor"],
+            label![
+                C![
+                    "navbar viewTab activeTab",
+                    IF![mode == Mode::View => "activeTab"]
+                ],
+                attrs![At::For => view_id.as_str()],
+                "View",
+                on_view_clicked
+            ],
+            label![
+                C!["navbar editorTab", IF![mode == Mode::Editor => "activeTab"]],
+                attrs![At::For => editor_id.as_str()],
+                "Editor",
+                on_editor_clicked
+            ],
             seed::input![
                 id![editor_id.as_str()],
                 C!["editorRadio"],
                 attrs![At::Type => "radio"; At::Name => name.as_str(); At::Checked => true],
             ],
+            text_area,
             seed::input![
                 id![view_id.as_str()],
                 C!["viewRadio"],
                 attrs![ At::Type => "radio"; At::Name => name.as_str();],
                 IF![mode == Mode::View => attrs![At::Checked => true]]
             ],
-    );
-
-    div![
-        C!["styledEditor"],
-        label![
-            if mode == Mode::View {
-                C!["navbar viewTab activeTab"]
-            } else {
-                C!["navbar viewTab"]
-            },
-            attrs![At::For => view_id.as_str()],
-            "View",
-            on_view_clicked
-        ],
-        label![
-            if mode == Mode::Editor {
-                C!["navbar editorTab activeTab"]
-            } else {
-                C!["navbar editorTab"]
-            },
-            attrs![At::For => editor_id.as_str()],
-            "Editor",
-            on_editor_clicked
-        ],
-        editor_radio_node,
-        text_area,
-        view_radio_node,
             div![
                 C!["view"],
                 IF![mode == Mode::Editor => empty![]],
                 IF![mode == Mode::View => raw![html]],
             ],
         ]
+    }
+}
+
+impl<'l> ToNode for StyledEditor<'l> {
+    #[inline]
+    fn into_node(self) -> Node<Msg> {
+        self.render()
+    }
 }
 
 #[inline]

jirs-client/src/components/styled_field.rs

@@ -23,20 +23,15 @@ impl<'l> Default for StyledField<'l> {
     }
 }
 
-impl<'l> ToNode for StyledField<'l> {
+impl<'l> StyledField<'l> {
-    fn into_node(self) -> Node<Msg> {
+    pub fn render(self) -> Node<Msg> {
-        render(self)
-    }
-}
-
-pub fn render(values: StyledField) -> Node<Msg> {
         let StyledField {
             label,
             tip,
             input,
             class_list,
-    } = values;
+        } = self;
-    let tip_node = tip.map(|s| div![C!["styledTip"], s]).unwrap_or(empty![]);
+        let tip_node = tip.map_or_else(|| empty![], |s| div![C!["styledTip"], s]);
 
         div![
             C!["styledField", class_list],
@@ -44,4 +39,11 @@ pub fn render(values: StyledField) -> Node<Msg> {
             input,
             tip_node,
         ]
+    }
+}
+
+impl<'l> ToNode for StyledField<'l> {
+    fn into_node(self) -> Node<Msg> {
+        self.render()
+    }
 }

jirs-client/src/components/styled_form.rs

@@ -11,20 +11,14 @@ pub struct StyledForm<'l> {
     pub on_submit: Option<EventHandler<Msg>>,
 }
 
-impl<'l> ToNode for StyledForm<'l> {
+impl<'l> StyledForm<'l> {
     #[inline]
-    fn into_node(self) -> Node<Msg> {
+    pub fn render(self) -> Node<Msg> {
-        render(self)
-    }
-}
-
-#[inline]
-pub fn render(values: StyledForm) -> Node<Msg> {
         let StyledForm {
             heading,
             fields,
             on_submit,
-    } = values;
+        } = self;
         let handlers = match on_submit {
             Some(handler) => vec![handler],
             _ => vec![],
@@ -34,4 +28,12 @@ pub fn render(values: StyledForm) -> Node<Msg> {
             C!["styledForm"],
             div![C!["formElement"], div![C!["formHeading"], heading], fields],
         ]
+    }
+}
+
+impl<'l> ToNode for StyledForm<'l> {
+    #[inline]
+    fn into_node(self) -> Node<Msg> {
+        self.render()
+    }
 }

jirs-client/src/components/styled_icon.rs

@@ -271,11 +271,12 @@ impl<'l> Default for StyledIcon<'l> {
 
 impl<'l> ToNode for StyledIcon<'l> {
     fn into_node(self) -> Node<Msg> {
-        render(self)
+        self.render()
     }
 }
 
-pub fn render(values: StyledIcon) -> Node<Msg> {
+impl<'l> StyledIcon<'l> {
+    pub fn render(self) -> Node<Msg> {
         let StyledIcon {
             icon,
             size,
@@ -283,7 +284,7 @@ pub fn render(values: StyledIcon) -> Node<Msg> {
             class_list,
             style_list,
             on_click,
-    } = values;
+        } = self;
 
         let styles: Vec<Attrs> = vec![
             size.map(|s| {
@@ -320,4 +321,5 @@ pub fn render(values: StyledIcon) -> Node<Msg> {
             on_click,
             ""
         ]
+    }
 }

jirs-client/src/components/styled_image_input.rs

@@ -39,16 +39,17 @@ pub struct StyledImageInput<'l> {
 
 impl<'l> ToNode for StyledImageInput<'l> {
     fn into_node(self) -> Node<Msg> {
-        render(self)
+        self.render()
     }
 }
 
-fn render(values: StyledImageInput) -> Node<Msg> {
+impl<'l> StyledImageInput<'l> {
+    pub fn render(self) -> Node<Msg> {
         let StyledImageInput {
             id,
             class_list,
             url,
-    } = values;
+        } = self;
 
         let field_id = id.clone();
         let on_change = ev(Ev::Change, move |ev| {
@@ -81,4 +82,5 @@ fn render(values: StyledImageInput) -> Node<Msg> {
                 on_change
             ]
         ]
+    }
 }

jirs-client/src/components/styled_input.rs

@@ -163,11 +163,12 @@ impl<'l, 'm: 'l> StyledInput<'l, 'm> {
 impl<'l, 'm: 'l> ToNode for StyledInput<'l, 'm> {
     #[inline]
     fn into_node(self) -> Node<Msg> {
-        render(self)
+        self.render()
     }
 }
 
-pub fn render(values: StyledInput) -> Node<Msg> {
+impl<'l, 'm: 'l> StyledInput<'l, 'm> {
+    pub fn render(self) -> Node<Msg> {
         let StyledInput {
             id,
             icon,
@@ -179,11 +180,11 @@ pub fn render(values: StyledInput) -> Node<Msg> {
             variant,
             auto_focus,
             input_handlers,
-    } = values;
+        } = self;
         let id = id.expect("Input id is required");
 
         let icon_node = icon
-        .map(|icon| StyledIcon::from(icon).into_node())
+            .map(|icon| StyledIcon::from(icon).render())
             .unwrap_or(Node::Empty);
 
         let on_change = {
@@ -221,4 +222,5 @@ pub fn render(values: StyledInput) -> Node<Msg> {
                 input_handlers,
             ],
         ]
+    }
 }

jirs-client/src/components/styled_link.rs

@@ -14,16 +14,17 @@ pub struct StyledLink<'l> {
 
 impl<'l> ToNode for StyledLink<'l> {
     fn into_node(self) -> Node<Msg> {
-        render(self)
+        self.render()
     }
 }
 
-pub fn render(values: StyledLink) -> Node<Msg> {
+impl<'l> StyledLink<'l> {
+    pub fn render(self) -> Node<Msg> {
         let StyledLink {
             children,
             class_list,
             href,
-    } = values;
+        } = self;
 
         let on_click = {
             let href = href.to_string();
@@ -46,4 +47,5 @@ pub fn render(values: StyledLink) -> Node<Msg> {
             on_click,
             children,
         ]
+    }
 }

jirs-client/src/components/styled_modal.rs

@@ -63,30 +63,20 @@ impl<'l> StyledModal<'l> {
 
 impl<'l> ToNode for StyledModal<'l> {
     fn into_node(self) -> Node<Msg> {
-        render(self)
+        self.render()
     }
 }
 
-#[inline]
+impl<'l> StyledModal<'l> {
-pub fn render(values: StyledModal) -> Node<Msg> {
+    #[inline]
+    pub fn render(self) -> Node<Msg> {
         let StyledModal {
             variant,
             width,
             with_icon,
             children,
             class_list,
-    } = values;
+        } = self;
-
-    let icon = if with_icon {
-        StyledIcon {
-            icon: Icon::Close,
-            class_list: variant.to_icon_class_name(),
-            ..Default::default()
-        }
-        .into_node()
-    } else {
-        empty![]
-    };
 
         let close_handler = mouse_ev(Ev::Click, |ev| {
             ev.stop_propagation();
@@ -99,7 +89,6 @@ pub fn render(values: StyledModal) -> Node<Msg> {
             None as Option<Msg>
         });
 
-    let clickable_class = format!("clickableOverlay {}", variant.to_class_name());
         let styled_modal_style = match width {
             Some(0) => "".to_string(),
             Some(n) => format!("max-width: {width}px", width = n),
@@ -108,15 +97,21 @@ pub fn render(values: StyledModal) -> Node<Msg> {
         div![
             C!["modal"],
             div![
-            C![clickable_class],
+                C!["clickableOverlay", variant.to_class_name()],
                 close_handler,
                 div![
                     C![class_list, "styledModal", variant.to_class_name()],
                     attrs![At::Style => styled_modal_style],
                     body_handler,
-                icon,
+                    IF![with_icon => StyledIcon {
+                        icon: Icon::Close,
+                        class_list: variant.to_icon_class_name(),
+                        ..Default::default()
+                    }
+                    .render()],
                     children
                 ]
             ]
         ]
+    }
 }

jirs-client/src/components/styled_select.rs

@@ -246,30 +246,6 @@ where
         vec![]
     };
 
-    let option_list = match (opened, children.is_empty()) {
-        (false, _) => empty![],
-        (_, true) => seed::div![C!["noOptions"], "No results"],
-        _ => seed::div![C!["options"], children],
-    };
-
-    let value: Vec<Node<Msg>> = if is_multi {
-        let add_icon = StyledIcon::from(Icon::Plus).into_node();
-        let mut children: Vec<Node<Msg>> = selected
-            .into_iter()
-            .map(|m| into_multi_value(m, id.clone()))
-            .collect();
-
-        if !children.is_empty() {
-            children.push(div![C!["addMore"], add_icon, "Add more"]);
-        } else {
-            children.push(div![C!["placeholder"], "Select"]);
-        }
-
-        vec![div![C!["valueMulti"], children]]
-    } else {
-        selected.into_iter().map(|m| m.render_value()).collect()
-    };
-
     seed::div![
         C!["styledSelect", variant.to_str(), IF![!valid => "invalid"]],
         attrs![At::Style => dropdown_style.as_str()],
@@ -280,7 +256,21 @@ where
         div![
             C!["valueContainer", variant.to_str()],
             on_handler,
-            value,
+            match is_multi {
+                true => vec![div![
+                    C!["valueMulti"],
+                    selected
+                        .into_iter()
+                        .map(|m| into_multi_value(m, id.clone()))
+                        .collect::<Vec<Node<Msg>>>(),
+                    IF![children.is_empty() => div![C!["placeholder"], "Select"]],
+                    IF![!children.is_empty() => div![C!["addMore"], StyledIcon::from(Icon::Plus).render(), "Add more"]],
+                ]],
+                false => selected
+                    .into_iter()
+                    .map(|m| m.render_value())
+                    .collect::<Vec<Node<Msg>>>(),
+            },
             action_icon,
         ],
         div![
@@ -296,7 +286,11 @@ where
                 ],
                 on_text,
             ]],
-            option_list
+            match (opened, children.is_empty()) {
+                (false, _) => empty![],
+                (_, true) => seed::div![C!["noOptions"], "No results"],
+                _ => seed::div![C!["options"], children],
+            }
         ]
     ]
 }