Merge branch 'improve-participation-button' into 'master'
Improve participation button Closes #470 See merge request framasoft/mobilizon!741
This commit is contained in:
Thomas Citharel
commit
39cf73dba8
@ -1,11 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 248.16 46.78">
|
|
||||||
<title>Mobilizon Logo</title>
|
|
||||||
<g data-name="header">
|
|
||||||
<path d="M0 45.82l3.18-40.8a29.88 29.88 0 015.07-.36 27.74 27.74 0 014.95.36l4.86 17.16a92.19 92.19 0 012.34 10.08h.36a92.19 92.19 0 012.34-10.08L28 5.02a29.23 29.23 0 015-.36 29.23 29.23 0 015 .36l3.18 40.8a13.61 13.61 0 01-3.63.42 23.41 23.41 0 01-3.63-.24l-1.2-19.92q-.36-5.52-.48-12.84h-.44l-7.32 26.51a25.62 25.62 0 01-4 .3 23.36 23.36 0 01-3.84-.3L9.36 13.24H9q-.3 8.94-.48 12.84L7.26 46a22.47 22.47 0 01-3.6.24A13.75 13.75 0 010 45.82zM74 31.06q0 8-4.26 12.3a12.21 12.21 0 01-9 3.42 12.21 12.21 0 01-9-3.42q-4.26-4.26-4.26-12.3t4.24-12.31a12.21 12.21 0 019-3.42 12.21 12.21 0 019 3.42Q74 23.02 74 31.06zM60.75 20.98q-5.67 0-5.67 10.08t5.67 10.08q5.67 0 5.67-10.08t-5.67-10.08zM103.2 19.75q2.7 4.11 2.7 11.28T102 42.31a13.18 13.18 0 01-10 4.11 31.41 31.41 0 01-11.34-2V2.2l.4-.45h2.76A4 4 0 0187 2.83a5.38 5.38 0 01.93 3.57v11.94a12.08 12.08 0 017.56-2.7 8.71 8.71 0 017.71 4.11zm-9.72 2a7.28 7.28 0 00-5.58 2.82v16a15 15 0 004.08.54 5.25 5.25 0 004.68-2.67q1.68-2.67 1.68-7.59 0-9.03-4.86-9.1zM121 22v23.94a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3V24.75q0-3.24-2.7-3.24h-.72a9.32 9.32 0 01-.3-2.58 10.7 10.7 0 01.3-2.7 39.63 39.63 0 014.38-.24h1a5.19 5.19 0 014 1.62A6.27 6.27 0 01121 22z" />
|
|
||||||
<path d="M119.82.84a7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.93 7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.93z" fill="#fff" />
|
|
||||||
<path d="M139.08 40.42h2a10.23 10.23 0 01.6 3.18 9.24 9.24 0 01-.18 2.1 38.47 38.47 0 01-5.64.54q-6.48 0-6.48-7v-37l.36-.42h2.88a3.94 3.94 0 013.12 1.05 5.52 5.52 0 01.9 3.57v31.31q-.02 2.67 2.44 2.67zM155.94 22v23.94a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3V24.75q0-3.24-2.7-3.24h-.72a9.32 9.32 0 01-.3-2.58 10.7 10.7 0 01.3-2.7 39.63 39.63 0 014.38-.24h1a5.19 5.19 0 014.05 1.62 6.27 6.27 0 011.43 4.39z" />
|
|
||||||
<path d="M154.8 2.84a7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.93 7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.93z" fill="#fff" />
|
|
||||||
<path d="M163.08 39.22l8.76-11.82q1.32-1.8 4.8-5.7l-.18-.3a63.09 63.09 0 01-7.74.42H163a9.79 9.79 0 01-.24-2.34 15.8 15.8 0 01.42-3.3h20.4a16.31 16.31 0 011 4.26 4.1 4.1 0 01-.78 2.34L175 34.66a64.65 64.65 0 01-4.56 5.7l.18.24q3.12-.3 5.22-.3h2.58a15.35 15.35 0 006.12-.9 9.4 9.4 0 01.72 3.12q0 3.42-4.32 3.42h-18a14.27 14.27 0 01-.9-3.93 5.08 5.08 0 011.04-2.79zM215.88 31.06q0 8-4.26 12.3a13.63 13.63 0 01-18.06 0q-4.26-4.26-4.26-12.3t4.26-12.31a13.63 13.63 0 0118.06 0q4.26 4.27 4.26 12.31zm-13.29-10.08q-5.67 0-5.67 10.08t5.67 10.08q5.67 0 5.67-10.08t-5.67-10.08zM247 25.84v13.32a11 11 0 001.2 5.64 7 7 0 01-4.41 1.56q-2.43 0-3.33-1.14a5.69 5.69 0 01-.9-3.54V27.4a7.74 7.74 0 00-.72-3.87 2.78 2.78 0 00-2.58-1.17 8.62 8.62 0 00-6.3 3v20.58a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3v-29.7l.42-.36h2.76q3.42 0 4.08 3.6 4.38-3.84 8.73-3.84t6.42 2.82a12.17 12.17 0 012.07 7.38z" />
|
|
||||||
<path d="M57.26 10.75a7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.84 7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.84zM198.26 10.75a7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.84 7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.84z" fill="#fff" />
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 3.4 KiB |
@ -39,10 +39,13 @@
|
|||||||
<b-notification v-else :closable="false">{{
|
<b-notification v-else :closable="false">{{
|
||||||
$t("The organiser has chosen to close comments.")
|
$t("The organiser has chosen to close comments.")
|
||||||
}}</b-notification>
|
}}</b-notification>
|
||||||
<transition name="comment-empty-list" mode="out-in">
|
<p
|
||||||
<p v-if="$apollo.queries.comments.loading" class="loading">
|
v-if="$apollo.queries.comments.loading"
|
||||||
{{ $t("Loading…") }}
|
class="loading has-text-centered"
|
||||||
|
>
|
||||||
|
{{ $t("Loading comments…") }}
|
||||||
</p>
|
</p>
|
||||||
|
<transition name="comment-empty-list" mode="out-in" v-else>
|
||||||
<transition-group
|
<transition-group
|
||||||
name="comment-list"
|
name="comment-list"
|
||||||
v-if="comments.length"
|
v-if="comments.length"
|
||||||
|
|||||||
@ -1,19 +1,36 @@
|
|||||||
<template>
|
<template>
|
||||||
<mobilizon-logo />
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 248.16 46.78">
|
||||||
|
<title>Mobilizon Logo</title>
|
||||||
|
<g data-name="header">
|
||||||
|
<path
|
||||||
|
d="M0 45.82l3.18-40.8a29.88 29.88 0 015.07-.36 27.74 27.74 0 014.95.36l4.86 17.16a92.19 92.19 0 012.34 10.08h.36a92.19 92.19 0 012.34-10.08L28 5.02a29.23 29.23 0 015-.36 29.23 29.23 0 015 .36l3.18 40.8a13.61 13.61 0 01-3.63.42 23.41 23.41 0 01-3.63-.24l-1.2-19.92q-.36-5.52-.48-12.84h-.44l-7.32 26.51a25.62 25.62 0 01-4 .3 23.36 23.36 0 01-3.84-.3L9.36 13.24H9q-.3 8.94-.48 12.84L7.26 46a22.47 22.47 0 01-3.6.24A13.75 13.75 0 010 45.82zM74 31.06q0 8-4.26 12.3a12.21 12.21 0 01-9 3.42 12.21 12.21 0 01-9-3.42q-4.26-4.26-4.26-12.3t4.24-12.31a12.21 12.21 0 019-3.42 12.21 12.21 0 019 3.42Q74 23.02 74 31.06zM60.75 20.98q-5.67 0-5.67 10.08t5.67 10.08q5.67 0 5.67-10.08t-5.67-10.08zM103.2 19.75q2.7 4.11 2.7 11.28T102 42.31a13.18 13.18 0 01-10 4.11 31.41 31.41 0 01-11.34-2V2.2l.4-.45h2.76A4 4 0 0187 2.83a5.38 5.38 0 01.93 3.57v11.94a12.08 12.08 0 017.56-2.7 8.71 8.71 0 017.71 4.11zm-9.72 2a7.28 7.28 0 00-5.58 2.82v16a15 15 0 004.08.54 5.25 5.25 0 004.68-2.67q1.68-2.67 1.68-7.59 0-9.03-4.86-9.1zM121 22v23.94a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3V24.75q0-3.24-2.7-3.24h-.72a9.32 9.32 0 01-.3-2.58 10.7 10.7 0 01.3-2.7 39.63 39.63 0 014.38-.24h1a5.19 5.19 0 014 1.62A6.27 6.27 0 01121 22z"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M119.82.84a7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.93 7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.93z"
|
||||||
|
fill="#fff"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M139.08 40.42h2a10.23 10.23 0 01.6 3.18 9.24 9.24 0 01-.18 2.1 38.47 38.47 0 01-5.64.54q-6.48 0-6.48-7v-37l.36-.42h2.88a3.94 3.94 0 013.12 1.05 5.52 5.52 0 01.9 3.57v31.31q-.02 2.67 2.44 2.67zM155.94 22v23.94a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3V24.75q0-3.24-2.7-3.24h-.72a9.32 9.32 0 01-.3-2.58 10.7 10.7 0 01.3-2.7 39.63 39.63 0 014.38-.24h1a5.19 5.19 0 014.05 1.62 6.27 6.27 0 011.43 4.39z"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M154.8 2.84a7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.93 7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.93z"
|
||||||
|
fill="#fff"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M163.08 39.22l8.76-11.82q1.32-1.8 4.8-5.7l-.18-.3a63.09 63.09 0 01-7.74.42H163a9.79 9.79 0 01-.24-2.34 15.8 15.8 0 01.42-3.3h20.4a16.31 16.31 0 011 4.26 4.1 4.1 0 01-.78 2.34L175 34.66a64.65 64.65 0 01-4.56 5.7l.18.24q3.12-.3 5.22-.3h2.58a15.35 15.35 0 006.12-.9 9.4 9.4 0 01.72 3.12q0 3.42-4.32 3.42h-18a14.27 14.27 0 01-.9-3.93 5.08 5.08 0 011.04-2.79zM215.88 31.06q0 8-4.26 12.3a13.63 13.63 0 01-18.06 0q-4.26-4.26-4.26-12.3t4.26-12.31a13.63 13.63 0 0118.06 0q4.26 4.27 4.26 12.31zm-13.29-10.08q-5.67 0-5.67 10.08t5.67 10.08q5.67 0 5.67-10.08t-5.67-10.08zM247 25.84v13.32a11 11 0 001.2 5.64 7 7 0 01-4.41 1.56q-2.43 0-3.33-1.14a5.69 5.69 0 01-.9-3.54V27.4a7.74 7.74 0 00-.72-3.87 2.78 2.78 0 00-2.58-1.17 8.62 8.62 0 00-6.3 3v20.58a20.85 20.85 0 01-3.66.3 23 23 0 01-3.78-.3v-29.7l.42-.36h2.76q3.42 0 4.08 3.6 4.38-3.84 8.73-3.84t6.42 2.82a12.17 12.17 0 012.07 7.38z"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M57.26 10.75a7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.84 7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.84zM198.26 10.75a7.37 7.37 0 01-.6-3 7.37 7.37 0 01.6-3 8.09 8.09 0 013.87-.84 7.05 7.05 0 013.69.84 7.37 7.37 0 01.6 3 7.37 7.37 0 01-.6 3 7.46 7.46 0 01-3.87.84 6.49 6.49 0 01-3.69-.84z"
|
||||||
|
fill="#fff"
|
||||||
|
/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { Component, Prop, Vue } from "vue-property-decorator";
|
import { Component, Prop, Vue } from "vue-property-decorator";
|
||||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
|
||||||
// @ts-ignore
|
|
||||||
import MobilizonLogo from "../assets/mobilizon_logo.svg";
|
|
||||||
// TODO: Jest does not like the ?inline after the import path
|
|
||||||
|
|
||||||
@Component({
|
@Component
|
||||||
components: {
|
|
||||||
MobilizonLogo,
|
|
||||||
},
|
|
||||||
})
|
|
||||||
export default class Logo extends Vue {
|
export default class Logo extends Vue {
|
||||||
@Prop({ type: Boolean, required: false, default: false }) invert!: boolean;
|
@Prop({ type: Boolean, required: false, default: false }) invert!: boolean;
|
||||||
}
|
}
|
||||||
|
|||||||
240
js/src/components/Participation/ParticipationSection.vue
Normal file
240
js/src/components/Participation/ParticipationSection.vue
Normal file
@ -0,0 +1,240 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div
|
||||||
|
class="event-participation has-text-right"
|
||||||
|
v-if="isEventNotAlreadyPassed"
|
||||||
|
>
|
||||||
|
<participation-button
|
||||||
|
v-if="shouldShowParticipationButton"
|
||||||
|
:participation="participation"
|
||||||
|
:event="event"
|
||||||
|
:current-actor="currentActor"
|
||||||
|
@join-event="(actor) => $emit('join-event', actor)"
|
||||||
|
@join-modal="$emit('join-modal')"
|
||||||
|
@join-event-with-confirmation="
|
||||||
|
(actor) => $emit('join-event-with-confirmation', actor)
|
||||||
|
"
|
||||||
|
@confirm-leave="$emit('confirm-leave')"
|
||||||
|
/>
|
||||||
|
<b-button
|
||||||
|
type="is-text"
|
||||||
|
v-if="!actorIsParticipant && anonymousParticipation !== null"
|
||||||
|
@click="$emit('cancel-anonymous-participation')"
|
||||||
|
>{{ $t("Cancel anonymous participation") }}</b-button
|
||||||
|
>
|
||||||
|
<small v-if="!actorIsParticipant && anonymousParticipation">
|
||||||
|
{{ $t("You are participating in this event anonymously") }}
|
||||||
|
<b-tooltip :label="$t('Click for more information')">
|
||||||
|
<span
|
||||||
|
class="is-clickable"
|
||||||
|
@click="isAnonymousParticipationModalOpen = true"
|
||||||
|
>
|
||||||
|
<b-icon size="is-small" icon="information-outline" />
|
||||||
|
</span>
|
||||||
|
</b-tooltip>
|
||||||
|
</small>
|
||||||
|
<small
|
||||||
|
v-else-if="!actorIsParticipant && anonymousParticipation === false"
|
||||||
|
>
|
||||||
|
{{
|
||||||
|
$t(
|
||||||
|
"You are participating in this event anonymously but didn't confirm participation"
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
<b-tooltip
|
||||||
|
:label="
|
||||||
|
$t(
|
||||||
|
'This information is saved only on your computer. Click for details'
|
||||||
|
)
|
||||||
|
"
|
||||||
|
>
|
||||||
|
<router-link :to="{ name: RouteName.TERMS }">
|
||||||
|
<b-icon size="is-small" icon="help-circle-outline" />
|
||||||
|
</router-link>
|
||||||
|
</b-tooltip>
|
||||||
|
</small>
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
<button class="button is-primary" type="button" slot="trigger" disabled>
|
||||||
|
<template>
|
||||||
|
<span>{{ $t("Event already passed") }}</span>
|
||||||
|
</template>
|
||||||
|
<b-icon icon="menu-down" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<b-modal
|
||||||
|
:active.sync="isAnonymousParticipationModalOpen"
|
||||||
|
has-modal-card
|
||||||
|
ref="anonymous-participation-modal"
|
||||||
|
>
|
||||||
|
<div class="modal-card">
|
||||||
|
<header class="modal-card-head">
|
||||||
|
<p class="modal-card-title">
|
||||||
|
{{ $t("About anonymous participation") }}
|
||||||
|
</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<section class="modal-card-body">
|
||||||
|
<b-notification
|
||||||
|
type="is-primary"
|
||||||
|
:closable="false"
|
||||||
|
v-if="event.joinOptions === EventJoinOptions.RESTRICTED"
|
||||||
|
>
|
||||||
|
{{
|
||||||
|
$t(
|
||||||
|
"As the event organizer has chosen to manually validate participation requests, your participation will be really confirmed only once you receive an email stating it's being accepted."
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</b-notification>
|
||||||
|
<p>
|
||||||
|
{{
|
||||||
|
$t(
|
||||||
|
"Your participation status is saved only on this device and will be deleted one month after the event's passed."
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</p>
|
||||||
|
<p v-if="isSecureContext">
|
||||||
|
{{
|
||||||
|
$t(
|
||||||
|
"You may clear all participation information for this device with the buttons below."
|
||||||
|
)
|
||||||
|
}}
|
||||||
|
</p>
|
||||||
|
<div class="buttons" v-if="isSecureContext">
|
||||||
|
<b-button
|
||||||
|
type="is-danger is-outlined"
|
||||||
|
@click="clearEventParticipationData"
|
||||||
|
>
|
||||||
|
{{ $t("Clear participation data for this event") }}
|
||||||
|
</b-button>
|
||||||
|
<b-button type="is-danger" @click="clearAllParticipationData">
|
||||||
|
{{ $t("Clear participation data for all events") }}
|
||||||
|
</b-button>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</b-modal>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import { EventJoinOptions, EventStatus, ParticipantRole } from "@/types/enums";
|
||||||
|
import { IParticipant } from "@/types/participant.model";
|
||||||
|
import { Component, Prop, Vue } from "vue-property-decorator";
|
||||||
|
import RouteName from "@/router/name";
|
||||||
|
import { IEvent } from "@/types/event.model";
|
||||||
|
import { CURRENT_ACTOR_CLIENT } from "@/graphql/actor";
|
||||||
|
import { IPerson } from "@/types/actor";
|
||||||
|
import { IConfig } from "@/types/config.model";
|
||||||
|
import { CONFIG } from "@/graphql/config";
|
||||||
|
import {
|
||||||
|
removeAllAnonymousParticipations,
|
||||||
|
removeAnonymousParticipation,
|
||||||
|
} from "@/services/AnonymousParticipationStorage";
|
||||||
|
import ParticipationButton from "../Event/ParticipationButton.vue";
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
apollo: {
|
||||||
|
currentActor: CURRENT_ACTOR_CLIENT,
|
||||||
|
config: CONFIG,
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
ParticipationButton,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
export default class ParticipationSection extends Vue {
|
||||||
|
@Prop({ required: true }) participation!: IParticipant;
|
||||||
|
|
||||||
|
@Prop({ required: true }) event!: IEvent;
|
||||||
|
|
||||||
|
@Prop({ required: true, default: null }) anonymousParticipation!:
|
||||||
|
| boolean
|
||||||
|
| null;
|
||||||
|
|
||||||
|
currentActor!: IPerson;
|
||||||
|
|
||||||
|
config!: IConfig;
|
||||||
|
|
||||||
|
RouteName = RouteName;
|
||||||
|
|
||||||
|
EventJoinOptions = EventJoinOptions;
|
||||||
|
|
||||||
|
isAnonymousParticipationModalOpen = false;
|
||||||
|
|
||||||
|
get actorIsParticipant(): boolean {
|
||||||
|
if (this.actorIsOrganizer) return true;
|
||||||
|
|
||||||
|
return (
|
||||||
|
this.participation &&
|
||||||
|
this.participation.role === ParticipantRole.PARTICIPANT
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
get actorIsOrganizer(): boolean {
|
||||||
|
return (
|
||||||
|
this.participation && this.participation.role === ParticipantRole.CREATOR
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
get shouldShowParticipationButton(): boolean {
|
||||||
|
// If we have an anonymous participation, don't show the participation button
|
||||||
|
if (
|
||||||
|
this.config &&
|
||||||
|
this.config.anonymous.participation.allowed &&
|
||||||
|
this.anonymousParticipation
|
||||||
|
) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// So that people can cancel their participation
|
||||||
|
if (this.actorIsParticipant) return true;
|
||||||
|
|
||||||
|
// You can participate to draft or cancelled events
|
||||||
|
if (this.event.draft || this.event.status === EventStatus.CANCELLED)
|
||||||
|
return false;
|
||||||
|
|
||||||
|
// Organizer can't participate
|
||||||
|
if (this.actorIsOrganizer) return false;
|
||||||
|
|
||||||
|
// If capacity is OK
|
||||||
|
if (this.eventCapacityOK) return true;
|
||||||
|
|
||||||
|
// Else
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
get eventCapacityOK(): boolean {
|
||||||
|
if (this.event.draft) return true;
|
||||||
|
if (!this.event.options.maximumAttendeeCapacity) return true;
|
||||||
|
return (
|
||||||
|
this.event.options.maximumAttendeeCapacity >
|
||||||
|
this.event.participantStats.participant
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
get isEventNotAlreadyPassed(): boolean {
|
||||||
|
return new Date(this.endDate) > new Date();
|
||||||
|
}
|
||||||
|
|
||||||
|
get endDate(): Date {
|
||||||
|
return this.event.endsOn !== null && this.event.endsOn > this.event.beginsOn
|
||||||
|
? this.event.endsOn
|
||||||
|
: this.event.beginsOn;
|
||||||
|
}
|
||||||
|
|
||||||
|
// eslint-disable-next-line class-methods-use-this
|
||||||
|
get isSecureContext(): boolean {
|
||||||
|
return window.isSecureContext;
|
||||||
|
}
|
||||||
|
|
||||||
|
async clearEventParticipationData(): Promise<void> {
|
||||||
|
await removeAnonymousParticipation(this.event.uuid);
|
||||||
|
window.location.reload();
|
||||||
|
}
|
||||||
|
|
||||||
|
// eslint-disable-next-line class-methods-use-this
|
||||||
|
clearAllParticipationData(): void {
|
||||||
|
removeAllAnonymousParticipations();
|
||||||
|
window.location.reload();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@ -800,5 +800,15 @@
|
|||||||
"Mobilizon is a federated software, meaning you can interact - depending on your admin's federation settings - with content from other instances, such as joining groups or events that were created elsewhere.": "Mobilizon is a federated software, meaning you can interact - depending on your admin federation settings - with content from other instances, such as joining groups or events that were created elsewhere.",
|
"Mobilizon is a federated software, meaning you can interact - depending on your admin's federation settings - with content from other instances, such as joining groups or events that were created elsewhere.": "Mobilizon is a federated software, meaning you can interact - depending on your admin federation settings - with content from other instances, such as joining groups or events that were created elsewhere.",
|
||||||
"This instance, <b>{instanceName} ({domain})</b>, hosts your profile, so remember its name.": "This instance, <b>{instanceName} ({domain})</b>, hosts your profile, so remember its name.",
|
"This instance, <b>{instanceName} ({domain})</b>, hosts your profile, so remember its name.": "This instance, <b>{instanceName} ({domain})</b>, hosts your profile, so remember its name.",
|
||||||
"If you are being asked for your federated indentity, it's composed of your username and your instance. For instance, the federated identity for your first profile is:": "If you are being asked for your federated indentity, it's composed of your username and your instance. For instance, the federated identity for your first profile is:",
|
"If you are being asked for your federated indentity, it's composed of your username and your instance. For instance, the federated identity for your first profile is:": "If you are being asked for your federated indentity, it's composed of your username and your instance. For instance, the federated identity for your first profile is:",
|
||||||
"Uploaded media size": "Uploaded media size"
|
"Uploaded media size": "Uploaded media size",
|
||||||
|
"Loading comments…": "Loading comments…",
|
||||||
|
"Tentative": "Tentative",
|
||||||
|
"Cancelled": "Cancelled",
|
||||||
|
"Click for more information": "Click for more information",
|
||||||
|
"About anonymous participation": "About anonymous participation",
|
||||||
|
"As the event organizer has chosen to manually validate participation requests, your participation will be really confirmed only once you receive an email stating it's being accepted.": "As the event organizer has chosen to manually validate participation requests, your participation will be really confirmed only once you receive an email stating it's being accepted.",
|
||||||
|
"Your participation status is saved only on this device and will be deleted one month after the event's passed.": "Your participation status is saved only on this device and will be deleted one month after the event's passed.",
|
||||||
|
"You may clear all participation information for this device with the buttons below.": "You may clear all participation information for this device with the buttons below.",
|
||||||
|
"Clear participation data for this event": "Clear participation data for this event",
|
||||||
|
"Clear participation data for all events": "Clear participation data for all events"
|
||||||
}
|
}
|
||||||
|
|||||||
@ -888,5 +888,15 @@
|
|||||||
"Mobilizon is a federated software, meaning you can interact - depending on your admin's federation settings - with content from other instances, such as joining groups or events that were created elsewhere.": "Mobilizon est un logiciel fédéré, ce qui signifie que vous pouvez interagir - en fonction des paramètres de fédération de votre administrateur·ice - avec du contenu d'autres instances, comme par exemple rejoindre des groupes ou des événements ayant été créés ailleurs.",
|
"Mobilizon is a federated software, meaning you can interact - depending on your admin's federation settings - with content from other instances, such as joining groups or events that were created elsewhere.": "Mobilizon est un logiciel fédéré, ce qui signifie que vous pouvez interagir - en fonction des paramètres de fédération de votre administrateur·ice - avec du contenu d'autres instances, comme par exemple rejoindre des groupes ou des événements ayant été créés ailleurs.",
|
||||||
"This instance, <b>{instanceName} ({domain})</b>, hosts your profile, so remember its name.": "Cette instance, <b>{instanceName} ({domain})</b>, héberge votre profil, donc notez bien son nom.",
|
"This instance, <b>{instanceName} ({domain})</b>, hosts your profile, so remember its name.": "Cette instance, <b>{instanceName} ({domain})</b>, héberge votre profil, donc notez bien son nom.",
|
||||||
"If you are being asked for your federated indentity, it's composed of your username and your instance. For instance, the federated identity for your first profile is:": "Si l'on vous demande votre identité fédérée, elle est composée de votre nom d'utilisateur·ice et de votre instance. Par exemple, l'identité fédérée de votre premier profil est :",
|
"If you are being asked for your federated indentity, it's composed of your username and your instance. For instance, the federated identity for your first profile is:": "Si l'on vous demande votre identité fédérée, elle est composée de votre nom d'utilisateur·ice et de votre instance. Par exemple, l'identité fédérée de votre premier profil est :",
|
||||||
"Uploaded media size": "Taille des médias téléversés"
|
"Uploaded media size": "Taille des médias téléversés",
|
||||||
|
"Loading comments…": "Chargement des commentaires…",
|
||||||
|
"Tentative": "Provisoire",
|
||||||
|
"Cancelled": "Annulé",
|
||||||
|
"Click for more information": "Cliquez pour plus d'informations",
|
||||||
|
"About anonymous participation": "À propos de la participation anonyme",
|
||||||
|
"As the event organizer has chosen to manually validate participation requests, your participation will be really confirmed only once you receive an email stating it's being accepted.": "L'organisateur de l'événement ayant choisi de valider manuellement les demandes de participation, votre participation ne sera réellement confirmée que lorsque vous recevrez un courriel indiquant qu'elle est acceptée.",
|
||||||
|
"Your participation status is saved only on this device and will be deleted one month after the event's passed.": "Le statut de votre participation est enregistré uniquement sur cet appareil et sera supprimé un mois après la fin de l'événement.",
|
||||||
|
"You may clear all participation information for this device with the buttons below.": "Vous pouvez effacer toutes les informations de participation pour cet appareil avec les boutons ci-dessous.",
|
||||||
|
"Clear participation data for this event": "Effacer mes données de participation pour cet événement",
|
||||||
|
"Clear participation data for all events": "Effacer mes données de participation pour tous les événements"
|
||||||
}
|
}
|
||||||
|
|||||||
@ -160,11 +160,16 @@ async function removeAnonymousParticipation(eventUUID: string): Promise<void> {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function removeAllAnonymousParticipations(): void {
|
||||||
|
localStorage.removeItem(ANONYMOUS_PARTICIPATIONS_LOCALSTORAGE_KEY);
|
||||||
|
}
|
||||||
|
|
||||||
export {
|
export {
|
||||||
addLocalUnconfirmedAnonymousParticipation,
|
addLocalUnconfirmedAnonymousParticipation,
|
||||||
confirmLocalAnonymousParticipation,
|
confirmLocalAnonymousParticipation,
|
||||||
getLeaveTokenForParticipation,
|
getLeaveTokenForParticipation,
|
||||||
isParticipatingInThisEvent,
|
isParticipatingInThisEvent,
|
||||||
removeAnonymousParticipation,
|
removeAnonymousParticipation,
|
||||||
|
removeAllAnonymousParticipations,
|
||||||
AnonymousParticipationNotFoundError,
|
AnonymousParticipationNotFoundError,
|
||||||
};
|
};
|
||||||
|
|||||||
@ -47,7 +47,7 @@
|
|||||||
<table class="table is-fullwidth">
|
<table class="table is-fullwidth">
|
||||||
<tr>
|
<tr>
|
||||||
<td>{{ $t("Instance languages") }}</td>
|
<td>{{ $t("Instance languages") }}</td>
|
||||||
<td :title="this.config.languages.join(', ')">
|
<td :title="this.config ? this.config.languages.join(', ') : ''">
|
||||||
{{ formattedLanguageList }}
|
{{ formattedLanguageList }}
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
@ -105,7 +105,7 @@ import langs from "../../i18n/langs.json";
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
skip() {
|
skip() {
|
||||||
return !this.config.languages;
|
return !this.config || !this.config.languages;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
@ -126,9 +126,12 @@ export default class AboutInstance extends Vue {
|
|||||||
}
|
}
|
||||||
|
|
||||||
get formattedLanguageList(): string {
|
get formattedLanguageList(): string {
|
||||||
|
if (this.languages) {
|
||||||
const list = this.languages.map(({ name }) => name);
|
const list = this.languages.map(({ name }) => name);
|
||||||
return formatList(list);
|
return formatList(list);
|
||||||
}
|
}
|
||||||
|
return "";
|
||||||
|
}
|
||||||
|
|
||||||
// eslint-disable-next-line class-methods-use-this
|
// eslint-disable-next-line class-methods-use-this
|
||||||
getLanguageNameForCode(code: string): string {
|
getLanguageNameForCode(code: string): string {
|
||||||
|
|||||||
@ -104,80 +104,16 @@
|
|||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="column is-3-tablet">
|
<div class="column is-3-tablet">
|
||||||
<div>
|
<participation-section
|
||||||
<div
|
|
||||||
class="event-participation has-text-right"
|
|
||||||
v-if="new Date(endDate) > new Date()"
|
|
||||||
>
|
|
||||||
<participation-button
|
|
||||||
v-if="shouldShowParticipationButton"
|
|
||||||
:participation="participations[0]"
|
:participation="participations[0]"
|
||||||
:event="event"
|
:event="event"
|
||||||
:current-actor="currentActor"
|
:anonymousParticipation="anonymousParticipation"
|
||||||
@join-event="joinEvent"
|
@join-event="joinEvent"
|
||||||
@join-modal="isJoinModalActive = true"
|
@join-modal="isJoinModalActive = true"
|
||||||
@join-event-with-confirmation="joinEventWithConfirmation"
|
@join-event-with-confirmation="joinEventWithConfirmation"
|
||||||
@confirm-leave="confirmLeave"
|
@confirm-leave="confirmLeave"
|
||||||
|
@cancel-anonymous-participation="cancelAnonymousParticipation"
|
||||||
/>
|
/>
|
||||||
<b-button
|
|
||||||
type="is-text"
|
|
||||||
v-if="
|
|
||||||
!actorIsParticipant && anonymousParticipation !== null
|
|
||||||
"
|
|
||||||
@click="cancelAnonymousParticipation"
|
|
||||||
>{{ $t("Cancel anonymous participation") }}</b-button
|
|
||||||
>
|
|
||||||
<small v-if="!actorIsParticipant && anonymousParticipation">
|
|
||||||
{{ $t("You are participating in this event anonymously") }}
|
|
||||||
<b-tooltip
|
|
||||||
:label="
|
|
||||||
$t(
|
|
||||||
'This information is saved only on your computer. Click for details'
|
|
||||||
)
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<router-link :to="{ name: RouteName.TERMS }">
|
|
||||||
<b-icon size="is-small" icon="help-circle-outline" />
|
|
||||||
</router-link>
|
|
||||||
</b-tooltip>
|
|
||||||
</small>
|
|
||||||
<small
|
|
||||||
v-else-if="
|
|
||||||
!actorIsParticipant && anonymousParticipation === false
|
|
||||||
"
|
|
||||||
>
|
|
||||||
{{
|
|
||||||
$t(
|
|
||||||
"You are participating in this event anonymously but didn't confirm participation"
|
|
||||||
)
|
|
||||||
}}
|
|
||||||
<b-tooltip
|
|
||||||
:label="
|
|
||||||
$t(
|
|
||||||
'This information is saved only on your computer. Click for details'
|
|
||||||
)
|
|
||||||
"
|
|
||||||
>
|
|
||||||
<router-link :to="{ name: RouteName.TERMS }">
|
|
||||||
<b-icon size="is-small" icon="help-circle-outline" />
|
|
||||||
</router-link>
|
|
||||||
</b-tooltip>
|
|
||||||
</small>
|
|
||||||
</div>
|
|
||||||
<div v-else>
|
|
||||||
<button
|
|
||||||
class="button is-primary"
|
|
||||||
type="button"
|
|
||||||
slot="trigger"
|
|
||||||
disabled
|
|
||||||
>
|
|
||||||
<template>
|
|
||||||
<span>{{ $t("Event already passed") }}</span>
|
|
||||||
</template>
|
|
||||||
<b-icon icon="menu-down" />
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="has-text-right">
|
<div class="has-text-right">
|
||||||
<template class="visibility" v-if="!event.draft">
|
<template class="visibility" v-if="!event.draft">
|
||||||
<p v-if="event.visibility === EventVisibility.PUBLIC">
|
<p v-if="event.visibility === EventVisibility.PUBLIC">
|
||||||
@ -646,7 +582,7 @@ import { IReport } from "../../types/report.model";
|
|||||||
import { CREATE_REPORT } from "../../graphql/report";
|
import { CREATE_REPORT } from "../../graphql/report";
|
||||||
import EventMixin from "../../mixins/event";
|
import EventMixin from "../../mixins/event";
|
||||||
import IdentityPicker from "../Account/IdentityPicker.vue";
|
import IdentityPicker from "../Account/IdentityPicker.vue";
|
||||||
import ParticipationButton from "../../components/Event/ParticipationButton.vue";
|
import ParticipationSection from "../../components/Participation/ParticipationSection.vue";
|
||||||
import RouteName from "../../router/name";
|
import RouteName from "../../router/name";
|
||||||
import { Address } from "../../types/address.model";
|
import { Address } from "../../types/address.model";
|
||||||
import CommentTree from "../../components/Comment/CommentTree.vue";
|
import CommentTree from "../../components/Comment/CommentTree.vue";
|
||||||
@ -676,7 +612,7 @@ import { IParticipant } from "../../types/participant.model";
|
|||||||
DateCalendarIcon,
|
DateCalendarIcon,
|
||||||
ReportModal,
|
ReportModal,
|
||||||
IdentityPicker,
|
IdentityPicker,
|
||||||
ParticipationButton,
|
ParticipationSection,
|
||||||
CommentTree,
|
CommentTree,
|
||||||
Tag,
|
Tag,
|
||||||
ActorCard,
|
ActorCard,
|
||||||
|
|||||||
@ -91,7 +91,7 @@ describe("CommentTree", () => {
|
|||||||
expect(wrapper.findComponent({ name: "b-notification" }).text()).toBe(
|
expect(wrapper.findComponent({ name: "b-notification" }).text()).toBe(
|
||||||
"The organiser has chosen to close comments."
|
"The organiser has chosen to close comments."
|
||||||
);
|
);
|
||||||
expect(wrapper.find(".loading").text()).toBe("Loading…");
|
expect(wrapper.find(".loading").text()).toBe("Loading comments…");
|
||||||
expect(wrapper.html()).toMatchSnapshot();
|
expect(wrapper.html()).toMatchSnapshot();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@ -3,12 +3,9 @@
|
|||||||
exports[`CommentTree renders a comment tree 1`] = `
|
exports[`CommentTree renders a comment tree 1`] = `
|
||||||
<div>
|
<div>
|
||||||
<b-notification-stub active="true" duration="2000" animation="fade">The organiser has chosen to close comments.</b-notification-stub>
|
<b-notification-stub active="true" duration="2000" animation="fade">The organiser has chosen to close comments.</b-notification-stub>
|
||||||
<transition-stub name="comment-empty-list" mode="out-in">
|
<p class="loading has-text-centered">
|
||||||
<p class="loading">
|
Loading comments…
|
||||||
Loading…
|
|
||||||
</p>
|
</p>
|
||||||
<!---->
|
|
||||||
</transition-stub>
|
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
@ -16,7 +13,6 @@ exports[`CommentTree renders a comment tree 2`] = `
|
|||||||
<div>
|
<div>
|
||||||
<b-notification-stub active="true" duration="2000" animation="fade">The organiser has chosen to close comments.</b-notification-stub>
|
<b-notification-stub active="true" duration="2000" animation="fade">The organiser has chosen to close comments.</b-notification-stub>
|
||||||
<transition-stub name="comment-empty-list" mode="out-in">
|
<transition-stub name="comment-empty-list" mode="out-in">
|
||||||
<!---->
|
|
||||||
<transition-group-stub tag="ul" name="comment-list" class="comment-list">
|
<transition-group-stub tag="ul" name="comment-list" class="comment-list">
|
||||||
<comment-stub comment="[object Object]" event="[object Object]" class="root-comment"></comment-stub>
|
<comment-stub comment="[object Object]" event="[object Object]" class="root-comment"></comment-stub>
|
||||||
<comment-stub comment="[object Object]" event="[object Object]" class="root-comment"></comment-stub>
|
<comment-stub comment="[object Object]" event="[object Object]" class="root-comment"></comment-stub>
|
||||||
|
|||||||
@ -0,0 +1,189 @@
|
|||||||
|
import { config, createLocalVue, mount, Wrapper } from "@vue/test-utils";
|
||||||
|
import ParticipationSection from "@/components/Participation/ParticipationSection.vue";
|
||||||
|
import Buefy from "buefy";
|
||||||
|
import VueRouter from "vue-router";
|
||||||
|
import { routes } from "@/router";
|
||||||
|
import { CommentModeration, EventJoinOptions } from "@/types/enums";
|
||||||
|
import {
|
||||||
|
createMockClient,
|
||||||
|
MockApolloClient,
|
||||||
|
RequestHandler,
|
||||||
|
} from "mock-apollo-client";
|
||||||
|
import buildCurrentUserResolver from "@/apollo/user";
|
||||||
|
import { InMemoryCache } from "apollo-cache-inmemory";
|
||||||
|
import { CONFIG } from "@/graphql/config";
|
||||||
|
import VueApollo from "vue-apollo";
|
||||||
|
import { configMock } from "../../mocks/config";
|
||||||
|
|
||||||
|
const localVue = createLocalVue();
|
||||||
|
localVue.use(Buefy);
|
||||||
|
localVue.use(VueRouter);
|
||||||
|
const router = new VueRouter({ routes, mode: "history" });
|
||||||
|
config.mocks.$t = (key: string): string => key;
|
||||||
|
|
||||||
|
const eventData = {
|
||||||
|
id: "1",
|
||||||
|
uuid: "e37910ea-fd5a-4756-7634-00971f3f4107",
|
||||||
|
options: {
|
||||||
|
commentModeration: CommentModeration.ALLOW_ALL,
|
||||||
|
},
|
||||||
|
beginsOn: new Date("2089-12-04T09:21:25Z"),
|
||||||
|
endsOn: new Date("2089-12-04T11:21:25Z"),
|
||||||
|
};
|
||||||
|
|
||||||
|
describe("ParticipationSection", () => {
|
||||||
|
let wrapper: Wrapper<Vue>;
|
||||||
|
let mockClient: MockApolloClient;
|
||||||
|
let apolloProvider;
|
||||||
|
let requestHandlers: Record<string, RequestHandler>;
|
||||||
|
|
||||||
|
const generateWrapper = (
|
||||||
|
handlers: Record<string, unknown> = {},
|
||||||
|
customProps: Record<string, unknown> = {},
|
||||||
|
baseData: Record<string, unknown> = {}
|
||||||
|
) => {
|
||||||
|
const cache = new InMemoryCache({ addTypename: false });
|
||||||
|
|
||||||
|
mockClient = createMockClient({
|
||||||
|
cache,
|
||||||
|
resolvers: buildCurrentUserResolver(cache),
|
||||||
|
});
|
||||||
|
requestHandlers = {
|
||||||
|
configQueryHandler: jest.fn().mockResolvedValue(configMock),
|
||||||
|
...handlers,
|
||||||
|
};
|
||||||
|
mockClient.setRequestHandler(CONFIG, requestHandlers.configQueryHandler);
|
||||||
|
|
||||||
|
apolloProvider = new VueApollo({
|
||||||
|
defaultClient: mockClient,
|
||||||
|
});
|
||||||
|
|
||||||
|
wrapper = mount(ParticipationSection, {
|
||||||
|
localVue,
|
||||||
|
router,
|
||||||
|
apolloProvider,
|
||||||
|
propsData: {
|
||||||
|
participation: null,
|
||||||
|
event: eventData,
|
||||||
|
anonymousParticipation: null,
|
||||||
|
...customProps,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
currentActor: {
|
||||||
|
id: "76",
|
||||||
|
},
|
||||||
|
...baseData,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
it("renders the participation section with minimal data", async () => {
|
||||||
|
generateWrapper();
|
||||||
|
await wrapper.vm.$nextTick();
|
||||||
|
|
||||||
|
expect(wrapper.exists()).toBe(true);
|
||||||
|
expect(requestHandlers.configQueryHandler).toHaveBeenCalled();
|
||||||
|
expect(wrapper.vm.$apollo.queries.config).toBeTruthy();
|
||||||
|
|
||||||
|
expect(wrapper.find(".event-participation").exists()).toBeTruthy();
|
||||||
|
|
||||||
|
const participationButton = wrapper.find(
|
||||||
|
".event-participation .participation-button a.button.is-large.is-primary"
|
||||||
|
);
|
||||||
|
expect(participationButton.attributes("href")).toBe(
|
||||||
|
`/events/${eventData.uuid}/participate/with-account`
|
||||||
|
);
|
||||||
|
|
||||||
|
expect(participationButton.text()).toBe("Participate");
|
||||||
|
});
|
||||||
|
|
||||||
|
it("renders the participation section with existing confimed anonymous participation", async () => {
|
||||||
|
generateWrapper({}, { anonymousParticipation: true });
|
||||||
|
|
||||||
|
expect(wrapper.find(".event-participation > small").text()).toContain(
|
||||||
|
"You are participating in this event anonymously"
|
||||||
|
);
|
||||||
|
|
||||||
|
const cancelAnonymousParticipationButton = wrapper.find(
|
||||||
|
".event-participation > button.button.is-text"
|
||||||
|
);
|
||||||
|
expect(cancelAnonymousParticipationButton.text()).toBe(
|
||||||
|
"Cancel anonymous participation"
|
||||||
|
);
|
||||||
|
|
||||||
|
wrapper.find(".event-participation small .is-clickable").trigger("click");
|
||||||
|
expect(
|
||||||
|
wrapper
|
||||||
|
.findComponent({ ref: "anonymous-participation-modal" })
|
||||||
|
.isVisible()
|
||||||
|
).toBeTruthy();
|
||||||
|
|
||||||
|
cancelAnonymousParticipationButton.trigger("click");
|
||||||
|
await wrapper.vm.$nextTick();
|
||||||
|
expect(wrapper.emitted("cancel-anonymous-participation")).toBeTruthy();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("renders the participation section with existing confimed anonymous participation but event moderation", async () => {
|
||||||
|
generateWrapper(
|
||||||
|
{},
|
||||||
|
{
|
||||||
|
anonymousParticipation: true,
|
||||||
|
event: { ...eventData, joinOptions: EventJoinOptions.RESTRICTED },
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
expect(wrapper.find(".event-participation > small").text()).toContain(
|
||||||
|
"You are participating in this event anonymously"
|
||||||
|
);
|
||||||
|
|
||||||
|
const cancelAnonymousParticipationButton = wrapper.find(
|
||||||
|
".event-participation > button.button.is-text"
|
||||||
|
);
|
||||||
|
expect(cancelAnonymousParticipationButton.text()).toBe(
|
||||||
|
"Cancel anonymous participation"
|
||||||
|
);
|
||||||
|
|
||||||
|
wrapper.find(".event-participation small .is-clickable").trigger("click");
|
||||||
|
|
||||||
|
await wrapper.vm.$nextTick();
|
||||||
|
const modal = wrapper.findComponent({
|
||||||
|
ref: "anonymous-participation-modal",
|
||||||
|
});
|
||||||
|
expect(modal.isVisible()).toBeTruthy();
|
||||||
|
expect(modal.find("article.notification.is-primary").text()).toBe(
|
||||||
|
"As the event organizer has chosen to manually validate participation requests, your participation will be really confirmed only once you receive an email stating it's being accepted."
|
||||||
|
);
|
||||||
|
|
||||||
|
cancelAnonymousParticipationButton.trigger("click");
|
||||||
|
await wrapper.vm.$nextTick();
|
||||||
|
expect(wrapper.emitted("cancel-anonymous-participation")).toBeTruthy();
|
||||||
|
});
|
||||||
|
|
||||||
|
it("renders the participation section with existing unconfirmed anonymous participation", async () => {
|
||||||
|
generateWrapper({}, { anonymousParticipation: false });
|
||||||
|
|
||||||
|
expect(wrapper.find(".event-participation > small").text()).toContain(
|
||||||
|
"You are participating in this event anonymously but didn't confirm participation"
|
||||||
|
);
|
||||||
|
});
|
||||||
|
|
||||||
|
it("renders the participation section but the event is already passed", async () => {
|
||||||
|
generateWrapper(
|
||||||
|
{},
|
||||||
|
{
|
||||||
|
event: {
|
||||||
|
...eventData,
|
||||||
|
beginsOn: "2020-12-02T10:52:56Z",
|
||||||
|
endsOn: "2020-12-03T10:52:56Z",
|
||||||
|
},
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
expect(wrapper.find(".event-participation").exists()).toBeFalsy();
|
||||||
|
expect(wrapper.find("button.button.is-primary").text()).toBe(
|
||||||
|
"Event already passed"
|
||||||
|
);
|
||||||
|
});
|
||||||
|
});
|
||||||
Loading…
Reference in New Issue
Block a user