1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113

use std::rc::Rc;

use yew::prelude::*;

use super::{use_mut_latest, use_timeout};

/// State handle for the [`use_throttle`] hook.
pub struct UseThrottleHandle {
    run: Rc<dyn Fn()>,
    cancel: Rc<dyn Fn()>,
}

impl UseThrottleHandle {
    /// Run the throttle.
    pub fn run(&self) {
        (self.run)();
    }

    /// Cancel the throttle.
    pub fn cancel(&self) {
        (self.cancel)();
    }
}

impl Clone for UseThrottleHandle {
    fn clone(&self) -> Self {
        Self {
            run: self.run.clone(),
            cancel: self.cancel.clone(),
        }
    }
}

/// A hook that throttles invoking a function, the function is only executed once every `millis`.
///
/// # Example
///
/// ```rust
/// # use yew::prelude::*;
/// #
/// use yew_hooks::prelude::*;
///
/// #[function_component(Throttle)]
/// fn throttle() -> Html {
///     let state = use_state(|| 0);
///
///     let throttle = {
///         let state = state.clone();
///         use_throttle(
///             move || {
///                 state.set(*state + 1);
///             },
///             2000,
///         )
///     };
///
///     let onclick = {
///         let throttle = throttle.clone();
///         Callback::from(move |_| throttle.run())
///     };
///
///     let oncancel = { Callback::from(move |_| throttle.cancel()) };
///
///     html! {
///         <>
///             <button {onclick}>{ "Click fast!" }</button>
///             <button onclick={oncancel}>{ "Cancel throttle" }</button>
///             <b>{ "State: " }</b> {*state}
///         </>
///     }
/// }
/// ```
#[hook]
pub fn use_throttle<Callback>(callback: Callback, millis: u32) -> UseThrottleHandle
where
    Callback: FnMut() + 'static,
{
    let throttled = use_mut_ref(|| false);
    let callback_ref = use_mut_latest(callback);
    let timeout = {
        let throttled = throttled.clone();
        use_timeout(
            move || {
                *throttled.borrow_mut() = false;
            },
            millis,
        )
    };

    let run = {
        let throttled = throttled.clone();
        let timeout = timeout.clone();
        Rc::new(move || {
            let throttled_value = *throttled.borrow();
            if !throttled_value {
                let callback_ref = callback_ref.current();
                let callback = &mut *callback_ref.borrow_mut();
                callback();
                *throttled.borrow_mut() = true;
                timeout.reset();
            }
        })
    };

    let cancel = {
        Rc::new(move || {
            timeout.cancel();
            *throttled.borrow_mut() = false;
        })
    };

    UseThrottleHandle { run, cancel }
}