Rick/cds-web
2
0
Fork 0
Code Issues 6 Pull requests Activity

feat(group): add leave and join

Browse source
This commit is contained in:
rick 2022-10-29 23:14:51 +02:00
parent 52fb59cc01
commit 3be7ac3336
Signed by: Rick
GPG key ID: 4A6223D66294EB20
1 changed files with 108 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

125
front/src/components/list_groups.rs
View file

@ -1,6 +1,6 @@
use gloo_net::http::Request; use gloo_net::http::Request;
use gloo_net::Error; use gloo_net::Error;
use patternfly_yew::{Button, Card, Flex, FlexModifier, Icon, Modal, ModalVariant, Title, ToastViewer, ToFlexItems, Variant, WithBreakpointExt}; use yew::prelude::*; use patternfly_yew::{Button, Card, Flex, FlexModifier, Gallery, Icon, Modal, ModalVariant, Title, ToastViewer, ToFlexItems, Variant, WithBreakpointExt}; use yew::prelude::*;
use crate::components::{Group, Home, TestMessage, ToastFields, ToastType}; use crate::components::{Group, Home, TestMessage, ToastFields, ToastType};
@ -11,6 +11,7 @@ pub struct ListGroups {
free_groups: Vec<Group>, free_groups: Vec<Group>,
nb_show: usize, nb_show: usize,
selected_group: usize, selected_group: usize,
quit_group: Option<usize>,
join: bool, join: bool,
} }
@ -21,20 +22,29 @@ pub struct PropGroups {
#[derive(PartialEq)] #[derive(PartialEq)]
pub enum MsgListGroups { pub enum MsgListGroups {
/// Rafraichi la page
Refresh,
/// Tous les groupes ont été récupéré /// Tous les groupes ont été récupéré
Done(Vec<Group>), Done(Vec<Group>),
/// Tous les groupes sans l'utilisateur ont été récupéré /// Tous les groupes sans l'utilisateur ont été récupéré
DoneFree(Vec<Group>), DoneFree(Vec<Group>),
/// Quitte un groupe
Leave(usize),
FinishLeave(usize),
/// Confirmation du retrait du groupe
//ConfirmLeave,
/// Afficher plus de groupes /// Afficher plus de groupes
More, More,
/// Afficher ou cacher la fenetre pour rejoindre des groupes /// Afficher ou cacher la fenetre pour rejoindre des groupes
ToggleJoin, ToggleJoin,
/// Annuler la sélection de nouveaux groupes /// Annuler la sélection de nouveaux groupes
CancelJoin, CancelJoin,
/// Lorsque l'utilisateur clique sur un groupe, on l'enregistre au vu de /// Lorsque l'utilisateur clique sur un groupe, on l'enregistre au vu de
/// son ajout futur /// son ajout futur
SelectGroup(usize), SelectGroup(usize),
/// Sélection du nouveau groupe faite, envoie d'un requete en back /// Sélection du nouveau groupe faite, envoie d'un requete en back
SendJoin,
/// Requete en back fini
FinishJoin, FinishJoin,
/// Popup d'informations /// Popup d'informations
Info(String, String), Info(String, String),
@ -117,13 +127,14 @@ impl Component for ListGroups {
let more = ctx.link().callback(|_| MsgListGroups::More); let more = ctx.link().callback(|_| MsgListGroups::More);
let join = ctx.link().callback(|_| MsgListGroups::ToggleJoin); let join = ctx.link().callback(|_| MsgListGroups::ToggleJoin);
let cancel_join = ctx.link().callback(|_| MsgListGroups::CancelJoin); let cancel_join = ctx.link().callback(|_| MsgListGroups::CancelJoin);
let finish_join = ctx.link().callback(|_| MsgListGroups::FinishJoin); let finish_join = ctx.link().callback(|_| MsgListGroups::SendJoin);
let groups: Vec<Html> = self.groups[..self.nb_show].iter().map(|group| { html!{ let groups: Vec<Html> = self.groups[..self.nb_show].iter().enumerate().map(|(id, group)| { html!{
<div> <Card>
<h1>{ group.name.clone() }</h1> <h1>{ group.name.clone() }</h1>
<h2>{ group.game.clone() }</h2> <h2>{ group.game.clone() }</h2>
</div> <Button onclick={ ctx.link().callback(move |_| MsgListGroups::Leave(id)) }variant={Variant::DangerSecondary}>{ "Quitter" }</Button>
</Card>
}}).collect::<Vec<Html>>(); }}).collect::<Vec<Html>>();
let mut groups_final: Vec<Html> = Vec::new(); let mut groups_final: Vec<Html> = Vec::new();
@ -138,8 +149,10 @@ impl Component for ListGroups {
<Button onclick={join} icon={Some(Icon::PlusCircleIcon)}>{ "Rejoindre un groupe" }</Button> <Button onclick={join} icon={Some(Icon::PlusCircleIcon)}>{ "Rejoindre un groupe" }</Button>
if self.join { if self.join {
<Modal onclose={cancel_join} variant={ ModalVariant::Medium }> <Modal onclose={cancel_join} variant={ ModalVariant::Medium }>
<br />
<Gallery gutter=true>
{ self.free_groups.iter().enumerate().map(|(id, group)| { { self.free_groups.iter().enumerate().map(|(id, group)| {
html! { html! {
<Card <Card
onclick={ctx.link().callback(move |_| MsgListGroups::SelectGroup(id))} onclick={ctx.link().callback(move |_| MsgListGroups::SelectGroup(id))}
selectable=true selectable=true
@ -148,8 +161,9 @@ impl Component for ListGroups {
{group.name.clone()} {group.name.clone()}
</Card> </Card>
} }
}).collect::<Html>() } }).collect::<Vec<Html>>() }
<Button onclick={finish_join}>{ "Valider" }</Button> </Gallery>
<Button variant={Variant::Primary} onclick={finish_join}>{ "Valider" }</Button>
</Modal> </Modal>
} }
@ -186,6 +200,8 @@ impl Component for ListGroups {
body, body,
}))) })))
} }
false
} }
MsgListGroups::Error(title, body) => { MsgListGroups::Error(title, body) => {
if let Some(parent) = ctx.link().get_parent() { if let Some(parent) = ctx.link().get_parent() {
@ -196,6 +212,8 @@ impl Component for ListGroups {
body, body,
}))) })))
} }
false
} }
MsgListGroups::Done(groups) => { MsgListGroups::Done(groups) => {
let len = groups.len(); let len = groups.len();
@ -206,37 +224,110 @@ impl Component for ListGroups {
3 3
}; };
return true; true
} }
MsgListGroups::DoneFree(groups) => { MsgListGroups::DoneFree(groups) => {
let len = groups.len(); let len = groups.len();
self.free_groups = groups; self.free_groups = groups;
return true; true
} }
MsgListGroups::ToggleJoin => { MsgListGroups::ToggleJoin => {
self.join = !self.join; self.join = !self.join;
return true; true
} }
MsgListGroups::CancelJoin => { MsgListGroups::CancelJoin => {
self.join = false; self.join = false;
return true; true
}
MsgListGroups::SendJoin => {
if let Some(group) = self.free_groups.get(self.selected_group) {
let id = group.id.clone();
ctx.link().send_future(async move {
match Request::put(&format!("/api/groups/{}/join", id)).send().await {
Ok(resp) => {
if resp.ok() {
MsgListGroups::FinishJoin
} else {
MsgListGroups::Error(
String::from("Erreur"),
String::from("Pas de réponse 200")
)
}
}
Err(_) => {
MsgListGroups::Error(
String::from("Erreur"),
String::from("Bruh")
)
}
}
});
} else {
ctx.link().send_message(MsgListGroups::Error(
String::from("Erreur"),
String::from("Contactez nous si vous êtes tombés sur cette erreur.")
));
}
false
} }
MsgListGroups::FinishJoin => { MsgListGroups::FinishJoin => {
return false; self.groups.push(self.free_groups.remove(self.selected_group));
if self.nb_show < 3 {
self.nb_show += 1;
}
true
}MsgListGroups::FinishLeave(id) => {
self.free_groups.push(self.groups.remove(id));
if self.nb_show > 0 && id <= self.nb_show {
self.nb_show -= 1;
}
true
} }
MsgListGroups::SelectGroup(id) => { MsgListGroups::SelectGroup(id) => {
self.selected_group = id; self.selected_group = id;
return true; true
} }
MsgListGroups::Leave(id_group) => {
if let Some(group) = self.groups.get(id_group) {
let id = group.id.clone();
ctx.link().send_future(async move {
match Request::put(&format!("/api/groups/{}/leave", id)).send().await {
Ok(resp) => {
if resp.ok() {
MsgListGroups::FinishLeave(id_group)
} else {
MsgListGroups::Error(
String::from("Erreur"),
String::from("Pas de réponse 200")
)
}
}
Err(_) => {
MsgListGroups::Error(
String::from("Erreur"),
String::from("Bruh")
)
}
}
});
} else {
ctx.link().send_message(MsgListGroups::Error(
String::from("Erreur"),
String::from("Contactez nous si vous êtes tombés sur cette erreur.")
));
}
false
}
MsgListGroups::Refresh => return true,
MsgListGroups::More => { MsgListGroups::More => {
self.nb_show += 3; self.nb_show += 3;
if self.nb_show > self.groups.len() { if self.nb_show > self.groups.len() {
self.nb_show -= self.nb_show - self.groups.len(); self.nb_show -= self.nb_show - self.groups.len();
} }
return true; true
} }
} }
false
} }
} }