sparse-v2/sparse-server/src/users.rs

use chrono::{DateTime, offset::Utc};
use leptos::prelude::*;
use serde::{Serialize, Deserialize};
#[cfg(feature = "ssr")]
use {
    sqlx::SqlitePool
};

fn format_delta(time: chrono::TimeDelta) -> String {
    let seconds = time.num_seconds();

    match seconds {
        0..=59 => format!("{} second{} ago", seconds, if seconds == 1 {""} else {"s"}),
        60..=3599 => {
            let minutes = seconds / 60;
            format!("{} minute{} ago", minutes, if minutes == 1 {""} else {"s"})
        }
        3600..=86399 => {
            let hours = seconds / 3600;
            format!("{} hours{} ago", hours, if hours == 1 {""} else {"s"})
        }
        _ => {
            let days = seconds / 86400;
            format!("{} day{} ago", days, if days == 1 {""} else {"s"})
        }
    }
}

#[derive(Clone, Serialize, Deserialize)]
pub struct DbUser {
    user_id: i64,
    user_name: String,
    last_active: Option<i64>
}

#[derive(Clone, Serialize, Deserialize)]
pub struct PubUser {
    user_id: i64,
    user_name: String,
    last_active: Option<DateTime<Utc>>
}

#[server]
async fn delete_user(user_id: i64) -> Result<(), ServerFnError> {
    let pool = expect_context::<SqlitePool>();

    sqlx::query!(
        "DELETE FROM users WHERE user_id = ?",
        user_id
    )
        .execute(&pool)
        .await?;

    Ok(())
}

#[server]
async fn reset_password(user_id: i64, password: String) -> Result<(), ServerFnError> {
    let pool = expect_context::<SqlitePool>();

    crate::db::user::reset_password(&pool, user_id as i16, password).await?;

    Ok(())
}

#[component]
pub fn RenderUser(refresh_user_list: Action<(), ()>, user: PubUser) -> impl IntoView {
    use leptos_use::{use_interval, UseIntervalReturn};

    let UseIntervalReturn { counter, .. } = use_interval(1000);
    let (time_ago, set_time_ago) = signal(user.last_active.map(|active| format_delta(Utc::now() - active)));

    Effect::watch(
        move || counter.get(),
        move |_, _, _| {
            set_time_ago(user.last_active.map(|active| format_delta(Utc::now() - active)));
        },
        false
    );

    let dialog_ref = NodeRef::<leptos::html::Dialog>::new();
    let new_password = RwSignal::new("".to_owned());

    let error_dialog_ref = NodeRef::<leptos::html::Dialog>::new();
    let (error_msg, set_error_msg) = signal(None::<String>);
    let clear_error = move |_| {
        set_error_msg(None);
    };

    let handle_delete = Action::new(move |&id: &i64| async move {
        match delete_user(id).await {
            Ok(()) => {
                refresh_user_list.dispatch(());
            }
            Err(e) => {
                set_error_msg(Some(e.to_string()));
            }
        }
    });

    let handle_reset = Action::new(move |info: &(i64, String)| {
        let (id, password) = info.clone();

        async move {
            match reset_password(id, password).await {
                Ok(()) => {}
                Err(e) => {
                    set_error_msg(Some(e.to_string()));
                }
            }
        }
    });

    view! {
        <dialog
            node_ref=error_dialog_ref
            on:close=clear_error
        >
            {error_msg}
        </dialog>

        <li>
            {user.user_id}
            ": "
            {user.user_name}
            {move || time_ago.get().map(|active| view! {
                <span>
                    "(last activity: "
                    {active}
                    ")"
                </span>
            })}

            <button
                on:click=move |_| {
                    handle_delete.dispatch(user.user_id);
                }
            >
                "Delete"
            </button>

            <button
                on:click=move |_| {
                    if let Some(dialog) = dialog_ref.get() {
                        let _ = dialog.show_modal();
                    }
                }
            >
                "Reset password"
            </button>
            <dialog
                node_ref=dialog_ref
            >
                <form
                    on:submit=move |ev| {
                        let _ = ev.prevent_default();

                        handle_reset.dispatch((user.user_id, new_password.get()));

                        new_password.set("".to_owned());

                        if let Some(dialog) = dialog_ref.get() {
                            let _ = dialog.close();
                        }
                    }
                >
                    <fieldset>
                        <legend>"Reset password"</legend>
                        <label>
                            "New password"
                        </label>
                        <input
                            bind:value=new_password
                            type="password"
                        />
                        <div>
                        </div>
                        <input
                            value="Submit"
                            type="submit"
                        />
                    </fieldset>
                </form>
            </dialog>
        </li>
    }
}

#[server]
async fn list_users() -> Result<Vec<PubUser>, ServerFnError> {
    use futures::stream::StreamExt;

    let pool = expect_context::<SqlitePool>();

    let users = sqlx::query_as!(
        DbUser,
        "SELECT user_id, user_name, (SELECT MAX(expires) FROM sessions s WHERE s.user_id = u.user_id) as last_active FROM users u"
    )
        .fetch(&pool)
        .map(|user| user.map(|u| PubUser {
            user_id: u.user_id,
            user_name: u.user_name,
            last_active: u.last_active.map(|ts| DateTime::from_timestamp(ts, 0)).flatten()
        }))
        .collect::<Vec<Result<_, _>>>()
        .await;

    let users: Result<Vec<_>, _> = users.into_iter().collect();

    Ok(users?)
}

#[server]
async fn add_user(name: String, password: String) -> Result<(), ServerFnError> {
    let pool = expect_context::<SqlitePool>();

    crate::db::user::create_user(&pool, name, password).await?;

    Ok(())
}

#[component]
pub fn UserView() -> impl IntoView {
    let user_list = Resource::new(|| (), |_| async move { list_users().await });

    let modal_ref = NodeRef::<leptos::html::Dialog>::new();

    let new_user_name = RwSignal::new("".to_owned());
    let new_user_pass = RwSignal::new("".to_owned());
    let (user_add_error, set_user_add_error) = signal(None::<String>);
    let add_user_action = Action::new(move |_: &()| async move {
        if let Some(modal) = modal_ref.get() {
            let _ = modal.close();
        }

        match add_user(new_user_name.get(), new_user_pass.get()).await {
            Ok(()) => {
                user_list.refetch();
            }
            Err(e) => {
                set_user_add_error(Some(format!("Error adding user! {e:?}")));
            }
        };

        new_user_name.set("".to_owned());
        new_user_pass.set("".to_owned());
    });

    let refresh_user_list = Action::new(move |_: &()| async move {
        user_list.refetch();
    });

    view! {
        <main class="users">
            <input
                type="button"
                value="Add user"
                on:click=move |_| {
                    if let Some(modal) = modal_ref.get() {
                        let _ = modal.show_modal();
                    }
                }
            />
            <dialog node_ref=modal_ref>
                <form
                    on:submit=move |ev| {
                        let _ = ev.prevent_default();

                        add_user_action.dispatch(());
                    }
                >
                    <fieldset>
                        <legend>"Add user"</legend>
                        <label>
                            "New user name"
                        </label>
                        <input
                            bind:value=new_user_name
                        />
                        <label>
                            "New password"
                        </label>
                        <input
                            bind:value=new_user_pass
                            type="password"
                        />
                        <div>
                        </div>
                        <input
                            value="Submit"
                            type="submit"
                        />
                    </fieldset>
                </form>
            </dialog>
            {move || user_add_error.get().map(|err| view! {
                <p>
                    "Error adding user! "
                    {err}
                </p>
            })}

            <h2>"User list"</h2>
            <Suspense
                fallback=move || view! { <p>"Loading..."</p> }
            >
                <ErrorBoundary
                    fallback=|errors| view! {
                        <p>"Errors loading users!"</p>
                        <ul>
                            {move || errors.get()
                                .into_iter()
                                .map(|(_, e)| view! { <li>{e.to_string()}</li> })
                                .collect::<Vec<_>>()}
                        </ul>
                    }
                >
                    {move || Suspend::new(async move {
                        let users_res = user_list.await;

                        users_res.map(|users| view! {
                            <ul>
                                {users
                                    .into_iter()
                                    .map(|user| view! {
                                        <RenderUser
                                            refresh_user_list
                                            user
                                        />
                                    })
                                    .collect::<Vec<_>>()}
                            </ul>
                        })
                    })}
                </ErrorBoundary>
            </Suspense>
        </main>
    }
}