user-auth store frontend v2

This commit is contained in:
2022-12-31 16:51:12 +05:30
parent fbd35658ec
commit 08bfc0f99e

View File

@@ -7,7 +7,7 @@ use serde_json;
use sycamore::futures::spawn_local;
use sycamore::prelude::*;
//use sycamore::suspense::Suspense;
use sycamore_router::Route;
//use sycamore_router::Route;
use wasm_bindgen::JsCast;
use web_sys::{Event, HtmlInputElement, KeyboardEvent}; // 0.3.5
use dotenv_codegen::dotenv;
@@ -80,19 +80,11 @@ pub struct AppState {
pub deleterequest: RcSignal<bool>,
pub userlist: RcSignal<HashMap<String, i32>>,
pub userid: RcSignal<i32>,
pub useridloggedin: RcSignal<i32>,
pub userscreen: RcSignal<bool>,
pub loggedin: RcSignal<bool>,
pub editmode: RcSignal<bool>,
}
#[derive(Route)]
enum AppRoutes {
#[to("/")]
Home,
#[to("/hello-server")]
HelloServer,
#[not_found]
NotFound,
pub dropdownselect: RcSignal<bool>,
}
/* TODO
@@ -297,24 +289,14 @@ pub fn Header<G: Html>(cx: Scope) -> View<G> {
}
};
let click_addbulk = |_| {
let mut task = value3.get().as_ref().clone();
task = task.trim().to_string();
if !task.is_empty() {
spawn_local(async move {
let _temp = add_books_isbns(task).await.unwrap();
});
}
};
let click_logout = |_| {
spawn_local(async move {
logout_user().await.unwrap();
});
app_state.loggedin.set(false);
app_state.editmode.set(false);
};
let click_userscreen = |_| {
@@ -323,8 +305,19 @@ pub fn Header<G: Html>(cx: Scope) -> View<G> {
let toggle_editmode = |_| {
app_state.editmode.set(*editchecked.get());
app_state.userid.set(*app_state.useridloggedin.get());
};
let dropdown_userselect = |_| {
spawn_local(async move {
app_state.userlist.set(list_users()
.await.expect("Couldn't list user"));
});
app_state.dropdownselect.set(true);
};
let users = create_memo(cx, || app_state.userlist.get().keys().cloned().collect::<Vec<String>>());
view! { cx,
header(class="header") {
div(class="header-button"){
@@ -344,7 +337,7 @@ pub fn Header<G: Html>(cx: Scope) -> View<G> {
}
})
}
(if *app_state.loggedin.get() == false {
(if *app_state.editmode.get() == true {
view!{ cx,
div(class="header-column"){
input(ref=input_ref,
@@ -359,6 +352,27 @@ pub fn Header<G: Html>(cx: Scope) -> View<G> {
})
div(class="header-column"){
(if *app_state.editmode.get() == false {
view!{ cx,
button(on:click=dropdown_userselect) { "Select User" }
(if *app_state.dropdownselect.get() == true {
view!{ cx,
div(class="dropdown-content") {
Keyed(
iterable=users,
view=move |cx, x| view! { cx,
DropDownUser(user=x)
},
key =|x| x )
}
}
} else {
view!{cx, ""}
})
}} else {
view!{cx, ""}
})
button(on:click=click_listall) { "All books" }
input(ref=input_ref2,
class="new-todo",
@@ -368,7 +382,7 @@ pub fn Header<G: Html>(cx: Scope) -> View<G> {
)
}
(if *app_state.editmode.get() == false {
(if *app_state.editmode.get() == true {
view!{ cx,
div(class="header-column"){
@@ -379,7 +393,6 @@ pub fn Header<G: Html>(cx: Scope) -> View<G> {
bind:value=value3,
on:keyup=handle_submit_addbulk,
)
button(on:click=click_addbulk) { "Add bulk ISBNs" }
}
} } else {
view!{cx, ""}
@@ -392,6 +405,20 @@ pub fn Header<G: Html>(cx: Scope) -> View<G> {
}
}
#[component(inline_props)]
pub fn DropDownUser<G: Html>(cx: Scope, user: String) -> View<G> {
let app_state = use_context::<AppState>(cx);
let handle_select_user = move |_| {
app_state.userid.set( *(*app_state.userlist.get()).get(&(user).clone()).unwrap_or(&0));
app_state.dropdownselect.set(false);
};
view! { cx,
button(class="delete", on:click=handle_select_user){ format!("{}",user) }
}
}
#[component]
async fn ListDB<G: Html>(cx: Scope<'_>) -> View<G> {
let app_state = use_context::<AppState>(cx);
@@ -467,7 +494,18 @@ async fn ListDB<G: Html>(cx: Scope<'_>) -> View<G> {
let docs = create_memo(cx, || app_state.books.get().iter().cloned().collect::<Vec<_>>());
view! {cx,
p {
(if *app_state.openlibrary.get() == false {
(if *app_state.openlibrary.get() == false && *app_state.editmode.get() == false {
view!{ cx,
ul {
Keyed(
iterable=docs,
view=|cx, x| view! { cx,
BookDB_View(bookitem=x)
},
key =|x| x.id )
}
}
} else if *app_state.openlibrary.get() == false && *app_state.editmode.get() == true {
view!{ cx,
ul {
Keyed(
@@ -567,6 +605,55 @@ pub fn BookDB<G: Html>(cx: Scope, bookitem: BookUIProp) -> View<G> {
}
}
#[component(inline_props)]
pub fn BookDB_View<G: Html>(cx: Scope, bookitem: BookUIProp) -> View<G> {
let app_state = use_context::<AppState>(cx);
let bookdisplay = bookitem.bookitem.clone();
let loctitle = bookitem.bookitem.clone().title.clone();
let locauthors = bookitem.bookitem.clone().author_name.clone().unwrap_or(vec!["".to_string()]).join(", ");
let locdesc = bookitem.bookitem.clone().description.unwrap_or("".to_string());
let locloc = bookitem.bookitem.clone().location.unwrap_or("".to_string());
let coverurl = bookdisplay.clone().cover.clone().unwrap_or("None".to_string());
let handle_display = move |_| {
app_state.displaying.set(true);
app_state.updating.set(false);
//info!("Setting displaying book {:?}",bookdisplay);
app_state.displayingbook.set(bookdisplay.clone());
};
view! { cx,
div(class="column"){
div(class="card"){
div(class="card-buttons"){
button(class="info", on:click=handle_display){ "INFO+" }
}
div(class="card-main"){
img(src=coverurl,width="100")
div(class="card-title"){
(format!("{}",loctitle))
}
div(class="card-authors"){
(format!("{}",locauthors))
}
//div(class="card-image"){
//}
}
div(class="card-desc"){
(format!("{}",locloc))
br{}br{}
(format!("{}",locdesc))
}
}
}
}
}
#[component]
async fn ListOL<G: Html>(cx: Scope<'_>) -> View<G> {
let app_state = use_context::<AppState>(cx);
@@ -1083,6 +1170,7 @@ async fn LoginScreenUI<G: Html>(cx: Scope<'_>) -> View<G> {
let input_refP = create_node_ref(cx);
let handle_register = move |_| {
let app_state = app_state.clone();
let user = AxumUser{
id: 0,
name: (*userval.get()).clone(),
@@ -1092,6 +1180,10 @@ async fn LoginScreenUI<G: Html>(cx: Scope<'_>) -> View<G> {
register_user(user)
.await.expect("Couldn't register user");
});
spawn_local(async move {
app_state.userlist.set(list_users()
.await.expect("Couldn't list user"));
});
app_state.userscreen.set(false);
};
@@ -1105,6 +1197,9 @@ async fn LoginScreenUI<G: Html>(cx: Scope<'_>) -> View<G> {
login_user(user)
.await.expect("Couldn't login user");
});
app_state.loggedin.set(true);
app_state.useridloggedin.set( *(*app_state.userlist.get()).get(&(*userval.get()).clone()).unwrap_or(&0));
app_state.userid.set( *(*app_state.userlist.get()).get(&(*userval.get()).clone()).unwrap_or(&0));
app_state.userscreen.set(false);
};
@@ -1152,11 +1247,15 @@ fn App<G: Html>(cx: Scope) -> View<G> {
deleterequest: create_rc_signal(bool::default()),
userlist: create_rc_signal(HashMap::new()),
userid: create_rc_signal(0),
useridloggedin: create_rc_signal(0),
userscreen: create_rc_signal(bool::default()),
loggedin: create_rc_signal(bool::default()),
editmode: create_rc_signal(bool::default()),
dropdownselect: create_rc_signal(bool::default()),
};
provide_context(cx, app_state);
view! {
cx,
div {