diff --git a/src/components/mod.rs b/src/components/mod.rs index 2ed3946..4c2ed38 100644 --- a/src/components/mod.rs +++ b/src/components/mod.rs @@ -14,3 +14,4 @@ pub mod nav_bar; pub mod new_widget; pub mod project_card; pub mod textfield; +pub mod single_media_picker; \ No newline at end of file diff --git a/src/components/single_media_picker.rs b/src/components/single_media_picker.rs new file mode 100644 index 0000000..4ccda47 --- /dev/null +++ b/src/components/single_media_picker.rs @@ -0,0 +1,108 @@ +use js_sys::Uint8Array; +use wasm_bindgen_futures::JsFuture; +use yew::prelude::*; + +use crate::{ + api, + components::textfield::{get_files_from_input_event}, +}; + +#[derive(PartialEq, Properties, Clone)] +pub struct SingleMediaPickerProps { + pub value: UseStateHandle, + pub onchange: Option>, + #[prop_or_default] + pub required: bool, + pub item: jl_types::dto::item::Item, +} + +#[function_component(SingleMediaPicker)] +pub fn single_media_picker(props: &SingleMediaPickerProps) -> Html { + let picked_handle = use_state(|| false); + + let onphoto_upload = { + let value_handle = props.value.clone(); + let onchange_cb = props.onchange.clone(); + let item = props.item.clone(); + let picked_handle = picked_handle.clone(); + Callback::from(move |e: InputEvent| { + match onchange_cb.clone() { + Some(cb) => cb.emit(String::new()), + None => {} + }; + let files_opt = get_files_from_input_event(e); + match files_opt { + Some(filelist) => { + match filelist.get(0) { + Some(file) => { + let value_handle = value_handle.clone(); + let picked_handle = picked_handle.clone(); + let item = item.clone(); + wasm_bindgen_futures::spawn_local(async move { + let array_buf = JsFuture::from(file.array_buffer()).await; + let array = Uint8Array::new(&array_buf.unwrap()); + let bytes: Vec = array.to_vec(); + // Upload to backend and retrieve url + match api::backend::upload_image(item, bytes).await { + Ok(url) => { + value_handle.set(url); + picked_handle.set(true); + } + Err(error) => { + log::error!("Error uploading image to backend: {error}") + } + }; + }); + } + None => { + log::error!("No files in first element of filelist...") + } + }; + } + None => { + log::error!("Something weird happened. No files after selecting files") + } + } + }) + }; + + html! { + <> +
{"Media del proyecto"}
+
+ { + if *picked_handle { + html! { +
+ +
cb.emit(String::new()), + None => {} + }; + picked_handle.set(false); + }) + }> + +
+
+ } + } else { + html! { +
+
+ +
+
+ } + } + } + +
+ + } +} + diff --git a/src/pages/admin/fields/agent.rs b/src/pages/admin/fields/agent.rs index 1cb8dd0..acf34b9 100644 --- a/src/pages/admin/fields/agent.rs +++ b/src/pages/admin/fields/agent.rs @@ -1,9 +1,8 @@ -use jl_types::domain::agent::Agent; -use uuid::Uuid; +use jl_types::domain::{agent::Agent, credential::CredentialType}; use yew::prelude::*; use yew_router::prelude::use_navigator; -use crate::pages::admin::edit::EditType; +use crate::{pages::admin::edit::{EditType}, components::{textfield::TextField, media_picker::MediaPicker, dropdown::DropDown, single_media_picker::SingleMediaPicker}, }; #[derive(Properties, PartialEq, Clone)] pub struct AgentFieldsProps { @@ -15,8 +14,27 @@ pub struct AgentFieldsProps { pub fn agent_fields(props: &AgentFieldsProps) -> Html { let navigator = use_navigator().unwrap(); let user_typed = use_state(|| false); + let agent_opt = props.agent.clone(); + let ontype_cb = { + let user_typed = user_typed.clone(); + Callback::from(move |_| { + user_typed.set(true); + }) + }; + + // Fields + let agent_name_handle = use_state(|| String::new()); + let agent_shortcode_handle = use_state(|| String::new()); + let profile_picture_url_handle = use_state(|| String::new()); + let credential = use_state(|| String::new()); + let credential_type = use_state(|| CredentialType::PhoneNumber); html! { - + <> + + // + + ///> + } } \ No newline at end of file