eta357/LibreTunes-Nix-Test
1
0
Fork 0
Code Pull Requests Actions Activity

Implement basic upload dialog

Browse Source
This commit is contained in:
Ethan Girouard 2024-05-10 15:51:26 -04:00
parent 7abfbaf600
commit 8a959d530d
Signed by: eta357
GPG Key ID: 7BCDC36DFD11C146
4 changed files with 98 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/app.rs
View File

@ -46,18 +46,20 @@ use crate::components::sidebar::*;
use crate::components::dashboard::*;
use crate::components::search::*;
use crate::components::personal::*;
use crate::components::upload::*;
/// Renders the home page of your application.
#[component]
fn HomePage() -> impl IntoView {
let play_status = PlayStatus::default();
let play_status = create_rw_signal(play_status);
let upload_open = create_rw_signal(false);
let (dashboard_open, set_dashboard_open) = create_signal(true);
view! {
<div class="home-container">
<Sidebar setter=set_dashboard_open active=dashboard_open />
<Upload open=upload_open/>
<Sidebar setter=set_dashboard_open active=dashboard_open upload_open=upload_open />
<Show
when=move || {dashboard_open() == true}
fallback=move || view! { <Search /> }

1
src/components.rs
View File

@ -2,3 +2,4 @@ pub mod sidebar;
pub mod dashboard;
pub mod search;
pub mod personal;
pub mod upload;

6
src/components/sidebar.rs
View File

@ -1,9 +1,10 @@
use leptos::leptos_dom::*;
use leptos::*;
use leptos_icons::*;
use crate::components::upload::*;
#[component]
pub fn Sidebar(setter: WriteSignal<bool>, active: ReadSignal<bool>) -> impl IntoView {
pub fn Sidebar(setter: WriteSignal<bool>, active: ReadSignal<bool>, upload_open: RwSignal<bool>) -> impl IntoView {
let open_dashboard = move |_| {
setter.update(|value| *value = true);
log!("open dashboard");
@ -16,7 +17,10 @@ pub fn Sidebar(setter: WriteSignal<bool>, active: ReadSignal<bool>) -> impl Into
view! {
<div class="sidebar-container">
<div class="sidebar-top-container">
<div class="sidebar-top-header-container">
<h2 class="header">LibreTunes</h2>
<UploadBtn dialog_open=upload_open />
</div>
<div class="buttons" on:click=open_dashboard style={move || if active() {"color: #e1e3e1"} else {""}} >
<Icon icon=icondata::OcHomeFillLg />
<h1>Dashboard</h1>

86
src/components/upload.rs Normal file
View File

@ -0,0 +1,86 @@
use leptos::leptos_dom::*;
use leptos::*;
use leptos_icons::*;
use leptos_router::Form;
#[component]
pub fn UploadBtn(dialog_open: RwSignal<bool>) -> impl IntoView {
let open_dialog = move |_| {
dialog_open.set(true);
};
view! {
<button class="upload-btn" on:click=open_dialog>
<div class="add-sign">
<Icon icon=icondata::IoAddSharp />
</div>
Upload
</button>
}
}
#[component]
pub fn Upload(open: RwSignal<bool>) -> impl IntoView {
let close_dialog = move |ev: leptos::ev::MouseEvent| {
ev.prevent_default();
open.set(false);
};
let click_cancel_bubble = move |ev: leptos::ev::MouseEvent| {
ev.prevent_default();
ev.stop_propagation();
};
view! {
<Show when=open fallback=move || view! {}>
<div class="dialog-container" on:click=close_dialog>
<dialog open=open on:click=click_cancel_bubble>
<div class="dialog-header">
<button class="close-button" on:click=close_dialog><Icon icon=icondata::IoClose /></button>
<h1>Upload Song</h1>
</div>
<Form action="/api/upload" method="POST" enctype=String::from("multipart/form-data")>
<div class="input-box">
<input class="info" type="text" name="title" required/>
<span>Title</span>
<i></i>
</div>
<div class="input-box">
<input class="info" type="text" name="artist"/>
<span>Artist</span>
<i></i>
</div>
<div class="input-box">
<input class="info" type="text" name="album_id"/>
<span>Album</span>
<i></i>
</div>
<div class="input-box">
<input class="info" type="number" name="track_number"/>
<span>Track Number</span>
<i></i>
</div>
<div>
<input class="info" type="date" name="release_date"/>
<span>Release Date</span>
<i></i>
</div>
<div>
<input class="info" type="file" name="file"/>
<span>File</span>
<i></i>
</div>
<button type="submit">Upload</button>
</Form>
</dialog>
</div>
</Show>
}
}