Improve anonymous participation and confirmation

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2020-10-07 17:05:15 +02:00
parent 4ee6457f09
commit 09089f1db9
7 changed files with 92 additions and 65 deletions

View File

@ -1,33 +1,35 @@
<template>
<section class="section container">
<h1 class="title" v-if="loading">{{ $t("Your participation is being validated") }}</h1>
<h1 class="title" v-if="loading">{{ $t("Your participation request is being validated") }}</h1>
<div v-else>
<div v-if="failed">
<b-message :title="$t('Error while validating participation')" type="is-danger">
<b-message :title="$t('Error while validating participation request')" type="is-danger">
{{
$t(
"Either the participation has already been validated, either the validation token is incorrect."
"Either the participation request has already been validated, either the validation token is incorrect."
)
}}
</b-message>
</div>
<div v-else>
<h1 class="title">{{ $t("Your participation has been validated") }}</h1>
<form @submit.prevent="askToSaveParticipation">
<b-field>
<b-checkbox v-model="saveParticipation">
<b>{{ $t("Remember my participation in this browser") }}</b>
<p>
{{
$t(
"Will allow to display and manage your participation status on the event page when using this device. Uncheck if you're using a public device."
)
}}
<h1 class="title">{{ $t("Your participation request has been validated") }}</h1>
<p class="content" v-if="participation.event.joinOptions == EventJoinOptions.RESTRICTED">
{{ $t("Your participation still has to be approved by the organisers.") }}
</p>
</b-checkbox>
</b-field>
<b-button native-type="submit" type="is-primary">{{ $t("Visit event page") }}</b-button>
</form>
<div class="columns has-text-centered">
<div class="column">
<router-link
native-type="button"
tag="a"
class="button is-primary is-large"
:to="{
name: RouteName.EVENT,
params: { uuid: this.participation.event.uuid },
}"
>{{ $t("Go to the event page") }}</router-link
>
</div>
</div>
</div>
</div>
</section>
@ -35,11 +37,9 @@
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { SnackbarProgrammatic as Snackbar } from "buefy";
import RouteName from "../../router/name";
import { IParticipant } from "../../types/event.model";
import { EventJoinOptions, IParticipant } from "../../types/event.model";
import { CONFIRM_PARTICIPATION } from "../../graphql/event";
import { confirmLocalAnonymousParticipation } from "../../services/AnonymousParticipationStorage";
@Component
export default class ConfirmParticipation extends Vue {
@ -51,7 +51,9 @@ export default class ConfirmParticipation extends Vue {
participation!: IParticipant;
saveParticipation = true;
EventJoinOptions = EventJoinOptions;
RouteName = RouteName;
async created(): Promise<void> {
await this.validateAction();
@ -74,30 +76,10 @@ export default class ConfirmParticipation extends Vue {
}
} catch (err) {
console.error(err);
Snackbar.open({ message: err.message, type: "is-danger", position: "is-bottom" });
this.failed = true;
} finally {
this.loading = false;
}
}
askToSaveParticipation(): void {
if (this.saveParticipation) {
this.saveParticipationInBrowser();
}
this.forwardToEventPage();
}
async saveParticipationInBrowser(): Promise<void> {
await confirmLocalAnonymousParticipation(this.participation.event.uuid);
}
async forwardToEventPage(): Promise<void> {
await this.$router.replace({
name: RouteName.EVENT,
params: { uuid: this.participation.event.uuid },
});
}
}
</script>

View File

@ -2,7 +2,7 @@
<section class="container section hero is-fullheight">
<div class="hero-body" v-if="event">
<div class="container">
<form @submit.prevent="joinEvent">
<form @submit.prevent="joinEvent" v-if="!formSent">
<p>
{{
$t(
@ -18,11 +18,11 @@
}}
</b-message>
<b-message type="is-danger" v-if="error">{{ error }}</b-message>
<b-field :label="$t('Email')">
<b-field :label="$t('Email address')">
<b-input
type="email"
v-model="anonymousParticipation.email"
placeholder="Your email"
:placeholder="$t('Your email')"
required
></b-input>
</b-field>
@ -42,13 +42,32 @@
:required="event.joinOptions === EventJoinOptions.RESTRICTED"
></b-input>
</b-field>
<b-button type="is-primary" native-type="submit">{{ $t("Send email") }}</b-button>
<b-field>
<b-checkbox v-model="anonymousParticipation.saveParticipation">
<b>{{ $t("Remember my participation in this browser") }}</b>
<p>
{{
$t(
"Will allow to display and manage your participation status on the event page when using this device. Uncheck if you're using a public device."
)
}}
</p>
</b-checkbox>
</b-field>
<b-button :disabled="sendingForm" type="is-primary" native-type="submit">{{
$t("Send email")
}}</b-button>
<div class="has-text-centered">
<b-button native-type="button" tag="a" type="is-text" @click="$router.go(-1)">{{
$t("Back to previous page")
}}</b-button>
</div>
</form>
<div v-else>
<h1 class="title">{{ $t("Request for participation confirmation sent") }}</h1>
<p class="content">{{ $t("Check your inbox (and your junk mail folder).") }}</p>
<p class="content">{{ $t("You may now close this window.") }}</p>
</div>
</div>
</div>
</section>
@ -89,9 +108,10 @@ import RouteName from "../../router/name";
export default class ParticipationWithoutAccount extends Vue {
@Prop({ type: String, required: true }) uuid!: string;
anonymousParticipation: { email: string; message: string } = {
anonymousParticipation: { email: string; message: string; saveParticipation: boolean } = {
email: "",
message: "",
saveParticipation: true,
};
event!: IEvent;
@ -100,10 +120,15 @@ export default class ParticipationWithoutAccount extends Vue {
error: string | boolean = false;
formSent = false;
sendingForm = false;
EventJoinOptions = EventJoinOptions;
async joinEvent(): Promise<Route> {
async joinEvent(): Promise<void> {
this.error = false;
this.sendingForm = true;
try {
const { data } = await this.$apollo.mutate<{ joinEvent: IParticipant }>({
mutation: JOIN_EVENT,
@ -150,7 +175,11 @@ export default class ParticipationWithoutAccount extends Vue {
},
});
console.log("finished with store", data);
if (data && data.joinEvent.metadata.cancellationToken) {
if (
data &&
data.joinEvent.metadata.cancellationToken &&
this.anonymousParticipation.saveParticipation
) {
await addLocalUnconfirmedAnonymousParticipation(
this.event,
data.joinEvent.metadata.cancellationToken
@ -160,10 +189,8 @@ export default class ParticipationWithoutAccount extends Vue {
} catch (e) {
this.error = e.message;
}
return this.$router.push({
name: RouteName.EVENT,
params: { uuid: this.event.uuid },
});
this.sendingForm = false;
this.formSent = true;
}
}
</script>

View File

@ -472,7 +472,9 @@ export const CONFIRM_PARTICIPATION = gql`
id
}
event {
id
uuid
joinOptions
}
role
}

View File

@ -111,13 +111,13 @@
"Either on the {instance} instance or on another instance.": "Either on the {instance} instance or on another instance.",
"Either the account is already validated, either the validation token is incorrect.": "Either the account is already validated, either the validation token is incorrect.",
"Either the email has already been changed, either the validation token is incorrect.": "Either the email has already been changed, either the validation token is incorrect.",
"Either the participation has already been validated, either the validation token is incorrect.": "Either the participation has already been validated, either the validation token is incorrect.",
"Either the participation request has already been validated, either the validation token is incorrect.": "Either the participation request has already been validated, either the validation token is incorrect.",
"Email": "Email",
"Ends on…": "Ends on…",
"Enter the link URL": "Enter the link URL",
"Error while changing email": "Error while changing email",
"Error while validating account": "Error while validating account",
"Error while validating participation": "Error while validating participation",
"Error while validating participation request": "Error while validating participation request",
"Event already passed": "Event already passed",
"Event cancelled": "Event cancelled",
"Event creation": "Event creation",
@ -419,8 +419,8 @@
"Your participation has been confirmed": "Your participation has been confirmed",
"Your participation has been rejected": "Your participation has been rejected",
"Your participation has been requested": "Your participation has been requested",
"Your participation has been validated": "Your participation has been validated",
"Your participation is being validated": "Your participation is being validated",
"Your participation request has been validated": "Your participation has been validated",
"Your participation request is being validated": "Your participation is being validated",
"Your participation status has been changed": "Your participation status has been changed",
"[This comment has been deleted]": "[This comment has been deleted]",
"[deleted]": "[deleted]",
@ -767,7 +767,6 @@
"<b>{contact}</b> will be displayed as contact.": "<b>{contact}</b> will be displayed as contact.|<b>{contact}</b> will be displayed as contacts.",
"and {number} groups": "and {number} groups",
"Will allow to display and manage your participation status on the event page when using this device. Uncheck if you're using a public device.": "Will allow to display and manage your participation status on the event page when using this device. Uncheck if you're using a public device.",
"Visit event page": "Visit event page",
"Remember my participation in this browser": "Remember my participation in this browser",
"Organized by": "Organized by",
"Report this group": "Report this group",
@ -793,5 +792,11 @@
"Instance languages": "Instance languages",
"Main languages you/your moderators speak": "Main languages you/your moderators speak",
"Select languages": "Select languages",
"No languages found": "No languages found"
"No languages found": "No languages found",
"Your participation still has to be approved by the organisers.": "Your participation still has to be approved by the organisers.",
"Your email": "Your email",
"Go to the event page": "Go to the event page",
"Request for participation confirmation sent": "Request for participation confirmation sent",
"Check your inbox (and your junk mail folder).": "Check your inbox (and your junk mail folder).",
"You may now close this window.": "You may now close this window."
}

View File

@ -205,7 +205,7 @@
"Either on the {instance} instance or on another instance.": "Sur l'instance {instance} ou bien sur une autre instance.",
"Either the account is already validated, either the validation token is incorrect.": "Soit le compte est déjà validé, soit le jeton de validation est incorrect.",
"Either the email has already been changed, either the validation token is incorrect.": "Soit l'adresse email a déjà été modifiée, soit le jeton de validation est incorrect.",
"Either the participation has already been validated, either the validation token is incorrect.": "Soit la participation a déjà été validée, soit le jeton de validation est incorrect.",
"Either the participation request has already been validated, either the validation token is incorrect.": "Soit la demande de participation a déjà été validée, soit le jeton de validation est incorrect.",
"Email": "Email",
"Email address": "Adresse email",
"Email notifications": "Notifications par email",
@ -223,7 +223,7 @@
"Error while reporting group {groupTitle}": "Erreur lors du signalement du groupe {groupTitle}",
"Error while saving report.": "Erreur lors de l'enregistrement du signalement.",
"Error while validating account": "Erreur lors de la validation du compte",
"Error while validating participation": "Erreur lors de la validation de la participation",
"Error while validating participation request": "Erreur lors de la validation de la demande de participation",
"Event": "Événement",
"Event already passed": "Événement déjà passé",
"Event cancelled": "Événement annulé",
@ -765,8 +765,8 @@
"Your participation has been confirmed": "Votre participation a été confirmée",
"Your participation has been rejected": "Votre participation a été rejettée",
"Your participation has been requested": "Votre participation a été demandée",
"Your participation has been validated": "Votre participation a été validée",
"Your participation is being validated": "Votre participation est en cours de validation",
"Your participation request has been validated": "Votre demande de participation a été validée",
"Your participation request is being validated": "Votre demande de participation est en cours de validation",
"Your participation status has been changed": "Le statut de votre participation a été mis à jour",
"Your profile will be shown as contact.": "Votre profil sera affiché en tant que contact.",
"Your timezone is currently set to {timezone}.": "Votre fuseau horaire est actuellement défini à {timezone}.",
@ -835,5 +835,11 @@
"Instance languages": "Langues de l'instance",
"Main languages you/your moderators speak": "Principales langues parlées par vous / vos modérateurs",
"Select languages": "Choisissez une langue",
"No languages found": "Aucune langue trouvée"
"No languages found": "Aucune langue trouvée",
"Your participation still has to be approved by the organisers.": "Votre participation doit encore être approuvée par les organisateur·ices.",
"Your email": "Votre adresse e-mail",
"Go to the event page": "Aller à la page de l'événement",
"Request for participation confirmation sent": "Demande de confirmation de participation envoyée",
"Check your inbox (and your junk mail folder).": "Vérifiez votre boîte de réception (et votre dossier des indésirables)",
"You may now close this window.": "Vous pouvez maintenant fermer cette fenêtre."
}

View File

@ -107,6 +107,9 @@
<b-tag v-else-if="props.row.role === ParticipantRole.PARTICIPANT">
{{ $t("Participant") }}
</b-tag>
<b-tag v-else-if="props.row.role === ParticipantRole.NOT_CONFIRMED">
{{ $t("Not confirmed") }}
</b-tag>
<b-tag type="is-warning" v-else-if="props.row.role === ParticipantRole.NOT_APPROVED">
{{ $t("Not approved") }}
</b-tag>

View File

@ -8,6 +8,7 @@ defmodule Mobilizon.GraphQL.API.Participations do
alias Mobilizon.Events.{Event, Participant}
alias Mobilizon.Federation.ActivityPub
alias Mobilizon.Federation.ActivityPub.Activity
alias Mobilizon.Service.Notifications.Scheduler
alias Mobilizon.Web.Email.Participation
@spec join(Event.t(), Actor.t(), map()) :: {:ok, Activity.t(), Participant.t()}
@ -39,6 +40,7 @@ defmodule Mobilizon.GraphQL.API.Participations do
def update(%Participant{} = participation, %Actor{} = _moderator, :not_approved) do
with {:ok, %Participant{} = participant} <-
Events.update_participant(participation, %{role: :not_approved}) do
Scheduler.pending_participation_notification(participation.event)
{:ok, nil, participant}
end
end