Skip to content

Commit 9394995

Browse files
dancixxdancixx
committed
fix: modal footer
1 parent c94a0f3 commit 9394995

File tree

2 files changed

+82
-164
lines changed

2 files changed

+82
-164
lines changed

‎src/modals/connection.rs‎

Lines changed: 51 additions & 122 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,57 @@ pub fn Connection(show: RwSignal<bool>) -> impl IntoView {
3838
});
3939

4040
view! {
41-
<Modal show=show title="Add new project">
41+
<Modal
42+
show=show
43+
title="Add new project"
44+
modal_footer=ModalFooter {
45+
children: ChildrenFn::to_children(move || Fragment::new(
46+
vec![
47+
view! {
48+
<div class="flex gap-2 justify-end">
49+
<button
50+
class="px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md"
51+
disabled=move || {
52+
project().is_empty() || db_user().is_empty()
53+
|| db_password().is_empty() || db_host().is_empty()
54+
|| db_port().is_empty()
55+
}
56+
57+
on:click=move |_| {
58+
let project_details = match driver() {
59+
Drivers::POSTGRESQL => {
60+
Project::POSTGRESQL(Postgresql {
61+
name: project(),
62+
driver: PostgresqlDriver::new(
63+
db_user(),
64+
db_password(),
65+
db_host(),
66+
db_port(),
67+
),
68+
..Postgresql::default()
69+
})
70+
}
71+
};
72+
save_project.dispatch(project_details);
73+
}
74+
>
75+
76+
Add
77+
</button>
78+
<button
79+
class="px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md"
80+
on:click=move |_| show.set(false)
81+
>
82+
Cancel
83+
</button>
84+
</div>
85+
}
86+
.into_view(),
87+
],
88+
)),
89+
}
90+
>
91+
4292
<div class="flex flex-col gap-2">
4393
<input
4494
class="border-1 border-neutral-200 p-1 rounded-md"
@@ -81,128 +131,7 @@ pub fn Connection(show: RwSignal<bool>) -> impl IntoView {
81131
/>
82132

83133
</div>
84-
// <ModalFooter>
85-
// <div class="flex gap-2 justify-end">
86-
// <button
87-
// class="px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md"
88-
// disabled=move || {
89-
// project.is_empty() || db_user.is_empty() || db_password.is_empty()
90-
// || db_host.is_empty() || db_port.is_empty()
91-
// }
92-
// on:click=move |_| {
93-
// let project_details = match driver() {
94-
// Drivers::POSTGRESQL => {
95-
// Project::POSTGRESQL(Postgresql {
96-
// name: project(),
97-
// driver: PostgresqlDriver::new(
98-
// db_user(),
99-
// db_password(),
100-
// db_host(),
101-
// db_port(),
102-
// ),
103-
// ..Postgresql::default()
104-
// })
105-
// }
106-
// };
107-
// save_project.dispatch(project_details);
108-
// }
109-
// >
110-
111-
// Add
112-
// </button>
113-
// <button
114-
// class="px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md"
115-
// on:click=move |_| show.set(false)
116-
// >
117-
// Cancel
118-
// </button>
119-
// </div>
120-
// </ModalFooter>
121134
</Modal>
122135
}
123-
// Modal(ModalProps {
124-
// show,
125-
// title: MaybeSignal::Static(String::from("Add new project")),
126-
// children: Children::to_children(move || {
127-
// Fragment::new(vec![div()
128-
// .classes("flex flex-col gap-2")
129-
// .child(
130-
// input()
131-
// .classes("border-1 border-neutral-200 p-1 rounded-md")
132-
// .prop("type", "text")
133-
// .prop("placeholder", "project")
134-
// .prop("value", project)
135-
// .on(ev::input, move |e| set_project(event_target_value(&e))),
136-
// )
137-
// .child(
138-
// input()
139-
// .classes("border-1 border-neutral-200 p-1 rounded-md")
140-
// .prop("type", "text")
141-
// .prop("value", db_user)
142-
// .prop("placeholder", "username")
143-
// .on(ev::input, move |e| set_db_user(event_target_value(&e))),
144-
// )
145-
// .child(
146-
// input()
147-
// .classes("border-1 border-neutral-200 p-1 rounded-md")
148-
// .prop("type", "password")
149-
// .prop("value", db_password)
150-
// .prop("placeholder", "password")
151-
// .on(ev::input, move |e| set_db_password(event_target_value(&e))),
152-
// )
153-
// .child(
154-
// input()
155-
// .classes("border-1 border-neutral-200 p-1 rounded-md")
156-
// .prop("type", "text")
157-
// .prop("value", db_host)
158-
// .prop("placeholder", "host")
159-
// .on(ev::input, move |e| set_db_host(event_target_value(&e))),
160-
// )
161-
// .child(
162-
// input()
163-
// .classes("border-1 border-neutral-200 p-1 rounded-md")
164-
// .prop("type", "text")
165-
// .prop("value", db_port)
166-
// .prop("placeholder", "port")
167-
// .on(ev::input, move |e| set_db_port(event_target_value(&e))),
168-
// )
169-
// .into_view()])
170-
// }),
171-
// modal_footer: Some(ModalFooter {
172-
// children: ChildrenFn::to_children(move || {
173-
// Fragment::new(vec![div()
174-
// .classes("flex gap-2 justify-end")
175-
// .child(
176-
// button()
177-
// .classes("px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md")
178-
// .child("Add")
179-
// .prop("disabled", move || {
180-
// project().is_empty()
181-
// || db_user().is_empty()
182-
// || db_password().is_empty()
183-
// || db_host().is_empty()
184-
// || db_port().is_empty()
185-
// })
186-
// .on(ev::click, move |_| {
187-
// let project_details = match driver() {
188-
// Drivers::POSTGRESQL => Project::POSTGRESQL(Postgresql {
189-
// name: project(),
190-
// driver: PostgresqlDriver::new(db_user(), db_password(), db_host(), db_port()),
191-
// ..Postgresql::default()
192-
// }),
193-
// };
194-
// save_project.dispatch(project_details);
195-
// }),
196-
// )
197-
// .child(
198-
// button()
199-
// .classes("px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md")
200-
// .child("Cancel")
201-
// .on(ev::click, move |_| show.set(false)),
202-
// )
203-
// .into_view()])
204-
// }),
205-
// }),
206-
// })
207136
}
208137

‎src/modals/custom_query.rs‎

Lines changed: 31 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -34,29 +34,38 @@ pub fn CustomQuery(show: RwSignal<bool>) -> impl IntoView {
3434
);
3535

3636
view! {
37-
<Modal show=show title="Save query!">
38-
// modal_footer= {
39-
// <ModalFooter>
40-
// <div class="flex gap-2 justify-end">
41-
// <button
42-
// class="px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md"
43-
// on:click=move |_| {
44-
// insert_query.dispatch((query_store, query_title(), project_name()));
45-
// show.set(false);
46-
// }
47-
// >
37+
<Modal
38+
show=show
39+
title="Save query!"
40+
modal_footer=ModalFooter {
41+
children: ChildrenFn::to_children(move || Fragment::new(
42+
vec![
43+
view! {
44+
<div class="flex gap-2 justify-end">
45+
<button
46+
class="px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md"
47+
on:click=move |_| {
48+
insert_query
49+
.dispatch((query_store, query_title(), project_name()));
50+
show.set(false);
51+
}
52+
>
4853

49-
// Save
50-
// </button>
51-
// <button
52-
// class="px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md"
53-
// on:click=move |_| show.set(false)
54-
// >
55-
// Cancel
56-
// </button>
57-
// </div>
58-
// </ModalFooter>
59-
// }
54+
Save
55+
</button>
56+
<button
57+
class="px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md"
58+
on:click=move |_| show.set(false)
59+
>
60+
Cancel
61+
</button>
62+
</div>
63+
}
64+
.into_view(),
65+
],
66+
)),
67+
}
68+
>
6069

6170
<div class="flex flex-col gap-2">
6271
<select
@@ -90,23 +99,3 @@ pub fn CustomQuery(show: RwSignal<bool>) -> impl IntoView {
9099
}
91100
}
92101

93-
// modal_footer=<ModalFooter>
94-
// <div class="flex gap-2 justify-end">
95-
// <button
96-
// class="px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md"
97-
// on:click=move |_| {
98-
// insert_query.dispatch((query_store, query_title(), project_name()));
99-
// show.set(false);
100-
// }
101-
// >
102-
// Save
103-
// </button>
104-
// <button
105-
// class="px-4 py-2 border-1 border-neutral-200 hover:bg-neutral-200 rounded-md"
106-
// on:click=move |_| show.set(false)
107-
// >
108-
// Cancel
109-
// </button>
110-
// </div>
111-
// </ModalFooter>
112-

0 commit comments

Comments
 (0)