From caa9759e4445baba8ec473d71fd00809c66c1d85 Mon Sep 17 00:00:00 2001
From: Evan Almloff <evanalmloff@gmail.com>
Date: Thu, 31 Oct 2024 14:49:49 -0500
Subject: [PATCH] add a warning about using use_hook(RefCell) in the docs
 (#3151)

---
 packages/core/src/global_context.rs | 40 +++++++++++++++++++++++++++++
 packages/core/src/scope_context.rs  | 40 +++++++++++++++++++++++++++++
 2 files changed, 80 insertions(+)

diff --git a/packages/core/src/global_context.rs b/packages/core/src/global_context.rs
index 1930f155e..94f60ac38 100644
--- a/packages/core/src/global_context.rs
+++ b/packages/core/src/global_context.rs
@@ -222,6 +222,46 @@ pub fn remove_future(id: Task) {
 /// In order to clean up resources you would need to implement the [`Drop`] trait for an inner value stored in a RC or similar (Signals for instance),
 /// as these only drop their inner value once all references have been dropped, which only happens when the component is dropped.
 ///
+/// <div class="warning">
+///
+/// `use_hook` is not reactive. It just returns the value on every render. If you need state that will track changes, use [`use_signal`](dioxus::prelude::use_signal) instead.
+///
+/// ❌ Don't use `use_hook` with `Rc<RefCell<T>>` for state. It will not update the UI and other hooks when the state changes.
+/// ```rust
+/// use dioxus::prelude::*;
+/// use std::rc::Rc;
+/// use std::cell::RefCell;
+///
+/// pub fn Comp() -> Element {
+///     let count = use_hook(|| Rc::new(RefCell::new(0)));
+///
+///     rsx! {
+///         button {
+///             onclick: move |_| *count.borrow_mut() += 1,
+///             "{count.borrow()}"
+///         }
+///     }
+/// }
+/// ```
+///
+/// ✅ Use `use_signal` instead.
+/// ```rust
+/// use dioxus::prelude::*;
+///
+/// pub fn Comp() -> Element {
+///     let mut count = use_signal(|| 0);
+///
+///     rsx! {
+///         button {
+///             onclick: move |_| count += 1,
+///             "{count}"
+///         }
+///     }
+/// }
+/// ```
+///
+/// </div>
+///
 /// # Example
 ///
 /// ```rust, no_run
diff --git a/packages/core/src/scope_context.rs b/packages/core/src/scope_context.rs
index 9f77273bf..0750267b6 100644
--- a/packages/core/src/scope_context.rs
+++ b/packages/core/src/scope_context.rs
@@ -367,6 +367,46 @@ impl Scope {
     /// In order to clean up resources you would need to implement the [`Drop`] trait for an inner value stored in a RC or similar (Signals for instance),
     /// as these only drop their inner value once all references have been dropped, which only happens when the component is dropped.
     ///
+    /// <div class="warning">
+    ///
+    /// `use_hook` is not reactive. It just returns the value on every render. If you need state that will track changes, use [`use_signal`](dioxus::prelude::use_signal) instead.
+    ///
+    /// ❌ Don't use `use_hook` with `Rc<RefCell<T>>` for state. It will not update the UI and other hooks when the state changes.
+    /// ```rust
+    /// use dioxus::prelude::*;
+    /// use std::rc::Rc;
+    /// use std::cell::RefCell;
+    ///
+    /// pub fn Comp() -> Element {
+    ///     let count = use_hook(|| Rc::new(RefCell::new(0)));
+    ///
+    ///     rsx! {
+    ///         button {
+    ///             onclick: move |_| *count.borrow_mut() += 1,
+    ///             "{count.borrow()}"
+    ///         }
+    ///     }
+    /// }
+    /// ```
+    ///
+    /// ✅ Use `use_signal` instead.
+    /// ```rust
+    /// use dioxus::prelude::*;
+    ///
+    /// pub fn Comp() -> Element {
+    ///     let mut count = use_signal(|| 0);
+    ///
+    ///     rsx! {
+    ///         button {
+    ///             onclick: move |_| count += 1,
+    ///             "{count}"
+    ///         }
+    ///     }
+    /// }
+    /// ```
+    ///
+    /// </div>
+    ///
     /// # Example
     ///
     /// ```rust