Fix typo(s) in use_callback docs (#2580)

* Fix typo in use-callback.mdx

* Fix the same typo in two more places 🤔

* Fix rest of typos

packages/yew/src/functional/hooks/use_callback.rs

@@ -17,7 +17,7 @@ use crate::functional::{hook, use_memo};
 ///     pub callback: Callback<String, String>,
 /// }
 ///
-/// #[function_component(MyComponennt)]
+/// #[function_component(MyComponent)]
 /// fn my_component(props: &Props) -> Html {
 ///     let greeting = props.callback.emit("Yew".to_string());
 ///
@@ -34,7 +34,7 @@ use crate::functional::{hook, use_memo};
 ///         Callback::from(move |_| counter.set(*counter + 1))
 ///     };
 ///
-///     // This callback depends on (), so it's created only once, then MyComponennt
+///     // This callback depends on (), so it's created only once, then MyComponent
 ///     // will be rendered only once even when you click the button mutiple times.
 ///     let callback = use_callback(
 ///         move |name| format!("Hello, {}!", name),
@@ -58,7 +58,7 @@ use crate::functional::{hook, use_memo};
 ///                 <b>{ "Current value: " }</b>
 ///                 { *counter }
 ///             </p>
-///             <MyComponennt {callback} />
+///             <MyComponent {callback} />
 ///         </div>
 ///     }
 /// }

packages/yew/tests/use_callback.rs

@@ -19,7 +19,7 @@ async fn use_callback_works() {
         callback: Callback<String, String>,
     }
 
-    #[function_component(MyComponennt)]
+    #[function_component(MyComponent)]
     fn my_component(props: &Props) -> Html {
         let greeting = props.callback.emit("Yew".to_string());
 
@@ -54,7 +54,7 @@ async fn use_callback_works() {
 
         html! {
             <div>
-                <MyComponennt {callback} />
+                <MyComponent {callback} />
             </div>
         }
     }

website/docs/concepts/function-components/hooks/use-callback.mdx

@@ -17,7 +17,7 @@ pub struct Props {
     pub callback: Callback<String, String>,
 }
 
-#[function_component(MyComponennt)]
+#[function_component(MyComponent)]
 fn my_component(props: &Props) -> Html {
     let greeting = props.callback.emit("Yew".to_string());
 
@@ -34,7 +34,7 @@ fn callback() -> Html {
         Callback::from(move |_| counter.set(*counter + 1))
     };
 
-    // This callback depends on (), so it's created only once, then MyComponennt
+    // This callback depends on (), so it's created only once, then MyComponent
     // will be rendered only once even when you click the button mutiple times.
     let callback = use_callback(
         move |name| format!("Hello, {}!", name),
@@ -58,7 +58,7 @@ fn callback() -> Html {
                 <b>{ "Current value: " }</b>
                 { *counter }
             </p>
-            <MyComponennt {callback} />
+            <MyComponent {callback} />
         </div>
     }
 }