Lodash debounce with inertia.get and Svelte

[mosfetish]

This currently works:

import debounce from "lodash/debounce";    

let search = "";

const doSearch = debounce(function (e) {
    Inertia.get(
        "/users",
        { search: search },
    );
}, 300);

<div>
    <h3>Users</h3>
    <input bind:value={search} type="text" on:input={doSearch} />
</div>

But it seems like I should be able to simplify this slightly by using Svelte's reactive statements.

Something like this:

import debounce from "lodash/debounce";    

let search = "";

$: debounce(function (e) {
    Inertia.get(
        "/users",
        { search: search },
    );
}, 300);

<div>
    <h3>Users</h3>
    <input bind:value={search} type="text"  />
</div>

But it doesn't work and I get no errors. I appreciate my construction may not be exactly correct but I've tried a few variations.

Doing the get without it being wrapped in a debounce works just fine, viz:

let search = "";

$: Inertia.get(
        "/users",
        { search: search },
    );

<div>
    <h3>Users</h3>
    <input bind:value={search} type="text"  />
</div>

Any ideas how I can implement debounce via a reactive statement?

[mosfetish]

Well, I can do this:

const getUsers = debounce((search) => {
    Inertia.get(
        "/users",
        { search: search },
    );
}, 300);

$: getUsers(search);

And I can include the whole thing in one reactive block with:

$: {
    ...
}

But there seems little benefit in that, and perhaps a downside, as the getUsers function is being declared over and over instead of just once.

But any other suggestions are welcome.