Skip to content

Commit f27efd4

Browse files
committed
feat: Extend A tag usage, wasm download related changes
1 parent e87341d commit f27efd4

36 files changed

+380
-301
lines changed

crates/frontend/src/app.rs

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ use leptos_meta::*;
33
use leptos_router::*;
44
use serde_json::json;
55

6-
use crate::hoc::layout::{use_org, CommonLayout, Layout};
6+
use crate::hoc::layout::{use_org, CommonLayout, Layout, Providers};
77
use crate::pages::compare_overrides::CompareOverrides;
88
use crate::pages::config_version::ConfigVersion;
99
use crate::pages::config_version_list::ConfigVersionList;
@@ -19,7 +19,6 @@ use crate::pages::{
1919
default_config::DefaultConfig, experiment::ExperimentPage, home::Home,
2020
organisations::Organisations, webhooks::Webhooks, workspace::Workspace,
2121
};
22-
use crate::providers::alert_provider::AlertProvider;
2322
use crate::types::Envs;
2423

2524
#[component]
@@ -93,7 +92,7 @@ pub fn app(app_envs: Envs) -> impl IntoView {
9392
<script type_="text/javascript">"__APP_ENVS=" {json!(app_envs).to_string()}</script>
9493
<Body class="h-screen m-0 flex bg-gray-50 overflow-y-hidden" />
9594
<Router base=service_prefix>
96-
<AlertProvider>
95+
<Providers>
9796
<Routes base=service_prefix.to_string()>
9897
<Route
9998
ssr=SsrMode::InOrder
@@ -181,7 +180,7 @@ pub fn app(app_envs: Envs) -> impl IntoView {
181180
// }
182181
// />
183182
</Routes>
184-
</AlertProvider>
183+
</Providers>
185184
</Router>
186185
}
187186
}

crates/frontend/src/components/button.rs

Lines changed: 60 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -2,34 +2,61 @@ use leptos::*;
22
use leptos_router::A;
33
use web_sys::MouseEvent;
44

5+
use crate::providers::csr_provider::use_client_side_ready;
6+
7+
pub enum ButtonStyle {
8+
Fill,
9+
Outline,
10+
}
11+
512
#[component]
6-
pub fn button<F: Fn(MouseEvent) + 'static>(
13+
pub fn button(
714
#[prop(into)] text: String,
8-
on_click: F,
15+
#[prop(into)] on_click: Callback<MouseEvent, ()>,
916
#[prop(into, default = String::new())] class: String,
1017
#[prop(into, default = String::new())] id: String,
1118
#[prop(into, default = String::from("ri-edit-2-line"))] icon_class: String,
1219
#[prop(default = false)] loading: bool,
20+
#[prop(default = ButtonStyle::Fill)] style: ButtonStyle,
21+
#[prop(into, optional)] force_style: Option<String>,
1322
) -> impl IntoView {
14-
let mut button_class = format!(
15-
"btn-purple px-5 py-2.5 flex justify-center items-center gap-2 font-medium text-sm text-center rounded-lg {class}"
16-
);
17-
if loading {
18-
button_class += "hover:cursor-not-allowed";
19-
}
20-
view! {
21-
<button class=button_class id=id on:click=on_click disabled=loading>
22-
{if loading {
23-
view! { <span class="loading loading-dots loading-sm" /> }.into_view()
24-
} else {
25-
view! {
26-
{text}
27-
<i class=icon_class />
28-
}
29-
.into_view()
30-
}}
23+
let client_side_ready = use_client_side_ready();
24+
let common_style =
25+
"flex justify-center items-center gap-2 font-medium text-sm text-center";
26+
let style = force_style.unwrap_or_else(|| {
27+
match style {
28+
ButtonStyle::Fill => "btn-purple px-5 py-2.5 rounded-lg",
29+
ButtonStyle::Outline => "btn btn-purple-outline",
30+
}
31+
.to_string()
32+
});
33+
34+
move || {
35+
let loading = loading || !*client_side_ready.get();
36+
let loading_class = if loading {
37+
"hover:cursor-not-allowed"
38+
} else {
39+
""
40+
};
3141

32-
</button>
42+
view! {
43+
<button
44+
class=format!("{common_style} {style} {class} {loading_class}")
45+
id=id.clone()
46+
on:click=move |e| on_click.call(e)
47+
disabled=loading
48+
>
49+
{if loading {
50+
view! { <span class="loading loading-dots loading-sm" /> }.into_view()
51+
} else {
52+
view! {
53+
{text.clone()}
54+
<i class=icon_class.clone() />
55+
}
56+
.into_view()
57+
}}
58+
</button>
59+
}
3360
}
3461
}
3562

@@ -41,20 +68,29 @@ pub fn button_anchor(
4168
#[prop(into, default = String::new())] id: String,
4269
#[prop(into, default = String::from("ri-edit-2-line"))] icon_class: String,
4370
#[prop(default = false)] loading: bool,
71+
#[prop(default = ButtonStyle::Fill)] style: ButtonStyle,
72+
#[prop(optional)] force_style: Option<String>,
4473
) -> impl IntoView {
45-
let mut button_class = format!("btn-purple px-5 py-2.5 flex justify-center items-center gap-2 font-medium text-sm text-center rounded-lg {class}");
74+
let common_style =
75+
"flex justify-center items-center gap-2 font-medium text-sm text-center";
76+
let style = force_style.unwrap_or_else(|| {
77+
match style {
78+
ButtonStyle::Fill => "btn-purple px-5 py-2.5 rounded-lg",
79+
ButtonStyle::Outline => "btn btn-purple-outline",
80+
}
81+
.to_string()
82+
});
4683

4784
if loading {
48-
button_class += "hover:cursor-not-allowed";
4985
view! {
50-
<div class=button_class id=id>
86+
<div class=format!("{common_style} {style} {class} hover:cursor-not-allowed") id=id>
5187
<span class="loading loading-dots loading-sm" />
5288
</div>
5389
}
5490
.into_view()
5591
} else {
5692
view! {
57-
<A class=button_class id=id href=href>
93+
<A class=format!("{common_style} {style} {class}") id=id href=href>
5894
{text}
5995
<i class=icon_class />
6096
</A>

crates/frontend/src/components/default_config_form.rs

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@ use superposition_types::{
1515
};
1616
use utils::try_update_payload;
1717
use wasm_bindgen::JsCast;
18+
use web_sys::MouseEvent;
1819

1920
use crate::{
2021
api::{fetch_functions, fetch_types, get_default_config},
@@ -492,7 +493,7 @@ pub fn default_config_form(
492493
class="self-end h-12 w-48"
493494
text="Submit"
494495
icon_class="ri-send-plane-line"
495-
on_click=move |ev| {
496+
on_click=move |ev: MouseEvent| {
496497
ev.prevent_default();
497498
on_submit.call(());
498499
}

crates/frontend/src/components/dimension_form.rs

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ use superposition_types::{
1313
};
1414
use types::{DimensionCreateReq, DimensionUpdateReq};
1515
use utils::{create_dimension, update_dimension};
16+
use web_sys::MouseEvent;
1617

1718
use crate::components::skeleton::SkeletonVariant;
1819
use crate::{
@@ -415,7 +416,7 @@ pub fn dimension_form(
415416
class="self-end h-12 w-48"
416417
text="Submit"
417418
icon_class="ri-send-plane-line"
418-
on_click=move |ev| {
419+
on_click=move |ev: MouseEvent| {
419420
ev.prevent_default();
420421
on_submit(());
421422
}

crates/frontend/src/components/drawer.rs

Lines changed: 15 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,11 @@
11
use leptos::*;
22

3-
use crate::utils::get_element_by_id;
43
use web_sys::MouseEvent;
54

5+
use crate::utils::get_element_by_id;
6+
7+
use super::button::{Button, ButtonStyle};
8+
69
pub fn open_drawer(id: &str) {
710
match get_element_by_id::<web_sys::HtmlInputElement>(id) {
811
Some(ele) => ele.set_checked(true),
@@ -21,37 +24,29 @@ pub fn close_drawer(id: &str) {
2124
};
2225
}
2326

24-
pub enum DrawerButtonStyle {
25-
Fill,
26-
Outline,
27-
}
28-
2927
#[component]
3028
pub fn drawer_btn(
3129
#[prop(into)] drawer_id: String,
32-
children: Children,
30+
#[prop(into)] text: String,
31+
#[prop(into)] icon_class: String,
3332
#[prop(into, default = Callback::new(|_| {}))] on_click: Callback<MouseEvent, ()>,
3433
#[prop(into, default = String::new())] class: String,
35-
#[prop(default = DrawerButtonStyle::Fill)] style: DrawerButtonStyle,
34+
#[prop(default = ButtonStyle::Fill)] style: ButtonStyle,
3635
) -> impl IntoView {
3736
let open_drawer_id = drawer_id.clone();
38-
let style = match style {
39-
DrawerButtonStyle::Fill => "btn-purple drawer-button px-5 py-2.5 font-medium rounded-lg text-sm text-center",
40-
DrawerButtonStyle::Outline => "btn btn-purple-outline w-[8rem] cursor-pointer",
41-
}.to_string();
4237

4338
view! {
44-
<button
45-
class=format!("{style} {class}")
46-
id=format!("{}-btn", drawer_id)
47-
on:click=move |e| {
39+
<Button
40+
style
41+
class
42+
id=format!("{drawer_id}-btn")
43+
on_click=move |e| {
4844
open_drawer(&open_drawer_id);
4945
on_click.call(e);
5046
}
51-
>
52-
53-
{children()}
54-
</button>
47+
text
48+
icon_class
49+
/>
5550
}
5651
}
5752

0 commit comments

Comments
 (0)