Fix group event list

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2020-10-01 15:57:07 +02:00
parent ffbe6bfad7
commit 2e67c423db
No known key found for this signature in database
GPG Key ID: A061B9DDE0CA0773
10 changed files with 67 additions and 14 deletions

View File

@ -14,10 +14,11 @@
<span v-if="event.physicalAddress && event.physicalAddress.locality"> <span v-if="event.physicalAddress && event.physicalAddress.locality">
{{ event.physicalAddress.locality }} {{ event.physicalAddress.locality }}
</span> </span>
<span> <span v-if="event.attributedTo && options.memberofGroup">
<span> {{ $t("Created by {name}", { name: usernameWithDomain(event.organizerActor) }) }}
{{ $t("Organized by {name}", { name: usernameWithDomain(event.organizerActor) }) }} </span>
</span> <span v-else-if="options.memberofGroup">
{{ $t("Organized by {name}", { name: usernameWithDomain(event.organizerActor) }) }}
</span> </span>
</div> </div>
<div class="columns"> <div class="columns">
@ -65,6 +66,7 @@ const defaultOptions: IEventCardOptions = {
loggedPerson: false, loggedPerson: false,
hideDetails: false, hideDetails: false,
organizerActor: null, organizerActor: null,
memberofGroup: false,
}; };
@Component({ @Component({

View File

@ -15,7 +15,10 @@
<p class="post-minimalist-title">{{ post.title }}</p> <p class="post-minimalist-title">{{ post.title }}</p>
<div class="metadata"> <div class="metadata">
<b-tag type="is-warning" size="is-small" v-if="post.draft">{{ $t("Draft") }}</b-tag> <b-tag type="is-warning" size="is-small" v-if="post.draft">{{ $t("Draft") }}</b-tag>
<small v-if="post.visibility === PostVisibility.PUBLIC" class="has-text-grey"> <small
v-if="post.visibility === PostVisibility.PUBLIC && isCurrentActorMember"
class="has-text-grey"
>
<b-icon icon="earth" size="is-small" />{{ $t("Public") }}</small <b-icon icon="earth" size="is-small" />{{ $t("Public") }}</small
> >
<small v-else-if="post.visibility === PostVisibility.UNLISTED" class="has-text-grey"> <small v-else-if="post.visibility === PostVisibility.UNLISTED" class="has-text-grey">

View File

@ -96,6 +96,12 @@ export const GROUP_FIELDS_FRAGMENTS = gql`
participant participant
notApproved notApproved
} }
attributedTo {
id
preferredUsername
name
domain
}
organizerActor { organizerActor {
id id
preferredUsername preferredUsername

View File

@ -782,5 +782,7 @@
"Join group": "Join group", "Join group": "Join group",
"Created by {username}": "Created by {username}", "Created by {username}": "Created by {username}",
"Accessible through link": "Accessible through link", "Accessible through link": "Accessible through link",
"Accessible only to members": "Accessible only to members" "Accessible only to members": "Accessible only to members",
"Created by {name}": "Created by {name}",
"View all posts": "View all posts"
} }

View File

@ -819,5 +819,7 @@
"Join group": "Rejoindre le groupe", "Join group": "Rejoindre le groupe",
"Created by {username}": "Créé par {username}", "Created by {username}": "Créé par {username}",
"Accessible through link": "Accessible uniquement par lien", "Accessible through link": "Accessible uniquement par lien",
"Accessible only to members": "Accessible uniquement aux membres" "Accessible only to members": "Accessible uniquement aux membres",
"Created by {name}": "Créé par {name}",
"View all posts": "Voir tous les billets"
} }

View File

@ -53,6 +53,7 @@ export interface IEventCardOptions {
loggedPerson: IPerson | boolean; loggedPerson: IPerson | boolean;
hideDetails: boolean; hideDetails: boolean;
organizerActor: IActor | null; organizerActor: IActor | null;
memberofGroup: boolean;
} }
export interface IParticipant { export interface IParticipant {

View File

@ -17,13 +17,11 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { Component, Prop, Vue, Watch } from "vue-property-decorator"; import { Component, Prop, Vue } from "vue-property-decorator";
import EventCard from "../../components/Event/EventCard.vue"; import EventCard from "../../components/Event/EventCard.vue";
import RouteName from "../../router/name"; import RouteName from "../../router/name";
import { IEvent } from "../../types/event.model"; import { IEvent } from "../../types/event.model";
const ngeohash = require("ngeohash");
@Component({ @Component({
components: { components: {
EventCard, EventCard,

View File

@ -26,7 +26,7 @@
<h1 class="title" v-if="group"> <h1 class="title" v-if="group">
{{ $t("{group}'s events", { group: group.name || group.preferredUsername }) }} {{ $t("{group}'s events", { group: group.name || group.preferredUsername }) }}
</h1> </h1>
<p> <p v-if="isCurrentActorMember">
{{ {{
$t( $t(
"When someone from the group creates an event and attributes it to the group, it will show up here." "When someone from the group creates an event and attributes it to the group, it will show up here."
@ -44,6 +44,7 @@
v-for="event in group.organizedEvents.elements" v-for="event in group.organizedEvents.elements"
:key="event.id" :key="event.id"
:event="event" :event="event"
:options="{ memberofGroup: isCurrentActorMember }"
/> />
</transition-group> </transition-group>
<b-message <b-message
@ -62,10 +63,25 @@ import { FETCH_GROUP } from "@/graphql/group";
import RouteName from "@/router/name"; import RouteName from "@/router/name";
import Subtitle from "@/components/Utils/Subtitle.vue"; import Subtitle from "@/components/Utils/Subtitle.vue";
import EventListViewCard from "@/components/Event/EventListViewCard.vue"; import EventListViewCard from "@/components/Event/EventListViewCard.vue";
import { IGroup, usernameWithDomain } from "../../types/actor"; import { CURRENT_ACTOR_CLIENT, PERSON_MEMBERSHIPS } from "@/graphql/actor";
import { IGroup, IMember, IPerson, usernameWithDomain } from "../../types/actor";
@Component({ @Component({
apollo: { apollo: {
currentActor: CURRENT_ACTOR_CLIENT,
memberships: {
query: PERSON_MEMBERSHIPS,
fetchPolicy: "cache-and-network",
variables() {
return {
id: this.currentActor.id,
};
},
update: (data) => data.person.memberships.elements,
skip() {
return !this.currentActor || !this.currentActor.id;
},
},
group: { group: {
query: FETCH_GROUP, query: FETCH_GROUP,
variables() { variables() {
@ -85,10 +101,19 @@ import { IGroup, usernameWithDomain } from "../../types/actor";
export default class GroupEvents extends Vue { export default class GroupEvents extends Vue {
group!: IGroup; group!: IGroup;
memberships!: IMember[];
currentActor!: IPerson;
usernameWithDomain = usernameWithDomain; usernameWithDomain = usernameWithDomain;
RouteName = RouteName; RouteName = RouteName;
showPassedEvents = false; showPassedEvents = false;
get isCurrentActorMember(): boolean {
if (!this.group || !this.memberships) return false;
return this.memberships.map(({ parent: { id } }) => id).includes(this.group.id);
}
} }
</script> </script>

View File

@ -286,7 +286,13 @@
:key="event.uuid" :key="event.uuid"
class="organized-event" class="organized-event"
/> />
<router-link :to="{}">{{ $t("View all upcoming events") }}</router-link> <router-link
:to="{
name: RouteName.GROUP_EVENTS,
params: { preferredUsername: usernameWithDomain(group) },
}"
>{{ $t("View all upcoming events") }}</router-link
>
</div> </div>
<span v-else-if="group">{{ $t("No public upcoming events") }}</span> <span v-else-if="group">{{ $t("No public upcoming events") }}</span>
<b-skeleton animated v-else></b-skeleton> <b-skeleton animated v-else></b-skeleton>
@ -295,6 +301,13 @@
<subtitle>{{ $t("Latest posts") }}</subtitle> <subtitle>{{ $t("Latest posts") }}</subtitle>
<div v-if="group.posts.total > 0" class="posts-wrapper"> <div v-if="group.posts.total > 0" class="posts-wrapper">
<post-list-item v-for="post in group.posts.elements" :key="post.id" :post="post" /> <post-list-item v-for="post in group.posts.elements" :key="post.id" :post="post" />
<router-link
:to="{
name: RouteName.POSTS,
params: { preferredUsername: usernameWithDomain(group) },
}"
>{{ $t("View all posts") }}</router-link
>
</div> </div>
<div v-else-if="group" class="content has-text-grey has-text-centered"> <div v-else-if="group" class="content has-text-grey has-text-centered">
<p>{{ $t("No posts yet") }}</p> <p>{{ $t("No posts yet") }}</p>

View File

@ -28,7 +28,7 @@
</nav> </nav>
<section> <section>
<div class="intro"> <div class="intro">
<p> <p v-if="isCurrentActorMember">
{{ {{
$t( $t(
"A place to publish something to the whole world, your community or just your group members." "A place to publish something to the whole world, your community or just your group members."
@ -36,6 +36,7 @@
}} }}
</p> </p>
<router-link <router-link
v-if="isCurrentActorMember"
:to="{ :to="{
name: RouteName.POST_CREATE, name: RouteName.POST_CREATE,
params: { preferredUsername: usernameWithDomain(group) }, params: { preferredUsername: usernameWithDomain(group) },