Merge branch 'log-group-activity' into 'master'
Log group activity See merge request framasoft/mobilizon!824
This commit is contained in:
Thomas Citharel
119
js/src/components/Activity/DiscussionActivityItem.vue
Normal file
119
js/src/components/Activity/DiscussionActivityItem.vue
Normal file
@@ -0,0 +1,119 @@
|
||||
<template>
|
||||
<div class="activity-item">
|
||||
<b-icon :icon="'chat'" :type="iconColor" />
|
||||
<div class="subject">
|
||||
<i18n :path="translation" tag="p">
|
||||
<router-link
|
||||
v-if="activity.object"
|
||||
slot="discussion"
|
||||
:to="{
|
||||
name: RouteName.DISCUSSION,
|
||||
params: { slug: subjectParams.discussion_slug },
|
||||
}"
|
||||
>{{ subjectParams.discussion_title }}</router-link
|
||||
>
|
||||
<b v-else slot="discussion">{{ subjectParams.discussion_title }}</b>
|
||||
<router-link
|
||||
v-if="activity.object && subjectParams.old_discussion_title"
|
||||
slot="old_discussion"
|
||||
:to="{
|
||||
name: RouteName.DISCUSSION,
|
||||
params: { slug: subjectParams.discussion_slug },
|
||||
}"
|
||||
>{{ subjectParams.old_discussion_title }}</router-link
|
||||
>
|
||||
<b
|
||||
v-else-if="subjectParams.old_discussion_title"
|
||||
slot="old_discussion"
|
||||
>{{ subjectParams.old_discussion_title }}</b
|
||||
>
|
||||
<popover-actor-card
|
||||
:actor="activity.author"
|
||||
:inline="true"
|
||||
slot="profile"
|
||||
>
|
||||
<b>
|
||||
{{
|
||||
$t("@{username}", {
|
||||
username: usernameWithDomain(activity.author),
|
||||
})
|
||||
}}</b
|
||||
></popover-actor-card
|
||||
></i18n
|
||||
>
|
||||
<small class="has-text-grey activity-date">{{
|
||||
activity.insertedAt | formatTimeString
|
||||
}}</small>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { usernameWithDomain } from "@/types/actor";
|
||||
import { ActivityDiscussionSubject } from "@/types/enums";
|
||||
import { Component } from "vue-property-decorator";
|
||||
import RouteName from "../../router/name";
|
||||
import PopoverActorCard from "../Account/PopoverActorCard.vue";
|
||||
import ActivityMixin from "../../mixins/activity";
|
||||
import { mixins } from "vue-class-component";
|
||||
|
||||
@Component({
|
||||
components: {
|
||||
PopoverActorCard,
|
||||
},
|
||||
})
|
||||
export default class DiscussionActivityItem extends mixins(ActivityMixin) {
|
||||
usernameWithDomain = usernameWithDomain;
|
||||
RouteName = RouteName;
|
||||
ActivityDiscussionSubject = ActivityDiscussionSubject;
|
||||
|
||||
get translation(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityDiscussionSubject.DISCUSSION_CREATED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You created the discussion {discussion}.";
|
||||
}
|
||||
return "{profile} created the discussion {discussion}.";
|
||||
case ActivityDiscussionSubject.DISCUSSION_REPLIED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You replied to the discussion {discussion}.";
|
||||
}
|
||||
return "{profile} replied to the discussion {discussion}.";
|
||||
case ActivityDiscussionSubject.DISCUSSION_RENAMED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You renamed the discussion from {old_discussion} to {discussion}.";
|
||||
}
|
||||
return "{profile} renamed the discussion from {old_discussion} to {discussion}.";
|
||||
case ActivityDiscussionSubject.DISCUSSION_ARCHIVED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You archived the discussion {discussion}.";
|
||||
}
|
||||
return "{profile} archived the discussion {discussion}.";
|
||||
case ActivityDiscussionSubject.DISCUSSION_DELETED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You deleted the discussion {discussion}.";
|
||||
}
|
||||
return "{profile} deleted the discussion {discussion}.";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
get iconColor(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityDiscussionSubject.DISCUSSION_CREATED:
|
||||
case ActivityDiscussionSubject.DISCUSSION_REPLIED:
|
||||
return "is-success";
|
||||
case ActivityDiscussionSubject.DISCUSSION_RENAMED:
|
||||
case ActivityDiscussionSubject.DISCUSSION_ARCHIVED:
|
||||
return "is-grey";
|
||||
case ActivityDiscussionSubject.DISCUSSION_DELETED:
|
||||
return "is-danger";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "./activity.scss";
|
||||
</style>
|
||||
93
js/src/components/Activity/EventActivityItem.vue
Normal file
93
js/src/components/Activity/EventActivityItem.vue
Normal file
@@ -0,0 +1,93 @@
|
||||
<template>
|
||||
<div class="activity-item">
|
||||
<b-icon :icon="'calendar'" :type="iconColor" />
|
||||
<div class="subject">
|
||||
<i18n :path="translation" tag="p">
|
||||
<router-link
|
||||
slot="event"
|
||||
v-if="activity.object"
|
||||
:to="{
|
||||
name: RouteName.EVENT,
|
||||
params: { uuid: subjectParams.event_uuid },
|
||||
}"
|
||||
>{{ subjectParams.event_title }}</router-link
|
||||
>
|
||||
<b v-else slot="event">{{ subjectParams.event_title }}</b>
|
||||
<popover-actor-card
|
||||
:actor="activity.author"
|
||||
:inline="true"
|
||||
slot="profile"
|
||||
>
|
||||
<b>
|
||||
{{
|
||||
$t("@{username}", {
|
||||
username: usernameWithDomain(activity.author),
|
||||
})
|
||||
}}</b
|
||||
></popover-actor-card
|
||||
></i18n
|
||||
>
|
||||
<small class="has-text-grey activity-date">{{
|
||||
activity.insertedAt | formatTimeString
|
||||
}}</small>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { usernameWithDomain } from "@/types/actor";
|
||||
import { ActivityEventSubject } from "@/types/enums";
|
||||
import { mixins } from "vue-class-component";
|
||||
import { Component } from "vue-property-decorator";
|
||||
import RouteName from "../../router/name";
|
||||
import PopoverActorCard from "../Account/PopoverActorCard.vue";
|
||||
import ActivityMixin from "../../mixins/activity";
|
||||
|
||||
@Component({
|
||||
components: {
|
||||
PopoverActorCard,
|
||||
},
|
||||
})
|
||||
export default class EventActivityItem extends mixins(ActivityMixin) {
|
||||
ActivityEventSubject = ActivityEventSubject;
|
||||
usernameWithDomain = usernameWithDomain;
|
||||
RouteName = RouteName;
|
||||
|
||||
get translation(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityEventSubject.EVENT_CREATED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You created the event {event}.";
|
||||
}
|
||||
return "The event {event} was created by {profile}.";
|
||||
case ActivityEventSubject.EVENT_UPDATED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You updated the event {event}.";
|
||||
}
|
||||
return "The event {event} was updated by {profile}.";
|
||||
case ActivityEventSubject.EVENT_DELETED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You deleted the event {event}.";
|
||||
}
|
||||
return "The event {event} was deleted by {profile}.";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
get iconColor(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityEventSubject.EVENT_CREATED:
|
||||
return "is-success";
|
||||
case ActivityEventSubject.EVENT_UPDATED:
|
||||
return "is-grey";
|
||||
case ActivityEventSubject.EVENT_DELETED:
|
||||
return "is-danger";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "./activity.scss";
|
||||
</style>
|
||||
183
js/src/components/Activity/GroupActivityItem.vue
Normal file
183
js/src/components/Activity/GroupActivityItem.vue
Normal file
@@ -0,0 +1,183 @@
|
||||
<template>
|
||||
<div class="activity-item">
|
||||
<b-icon :icon="'cog'" :type="iconColor" />
|
||||
<div class="subject">
|
||||
<i18n :path="translation" tag="p">
|
||||
<router-link
|
||||
v-if="activity.object"
|
||||
slot="group"
|
||||
:to="{
|
||||
name: RouteName.GROUP,
|
||||
params: { preferredUsername: usernameWithDomain(activity.object) },
|
||||
}"
|
||||
>{{ subjectParams.group_name }}</router-link
|
||||
>
|
||||
<b v-else slot="post">{{ subjectParams.group_name }}</b>
|
||||
<popover-actor-card
|
||||
:actor="activity.author"
|
||||
:inline="true"
|
||||
slot="profile"
|
||||
>
|
||||
<b>
|
||||
{{
|
||||
$t("@{username}", {
|
||||
username: usernameWithDomain(activity.author),
|
||||
})
|
||||
}}</b
|
||||
></popover-actor-card
|
||||
></i18n
|
||||
>
|
||||
<i18n
|
||||
:path="detail"
|
||||
v-for="detail in details"
|
||||
:key="detail"
|
||||
tag="p"
|
||||
class="has-text-grey"
|
||||
>
|
||||
<popover-actor-card
|
||||
:actor="activity.author"
|
||||
:inline="true"
|
||||
slot="profile"
|
||||
>
|
||||
<b>
|
||||
{{
|
||||
$t("@{username}", {
|
||||
username: usernameWithDomain(activity.author),
|
||||
})
|
||||
}}</b
|
||||
></popover-actor-card
|
||||
>
|
||||
<router-link
|
||||
v-if="activity.object"
|
||||
slot="group"
|
||||
:to="{
|
||||
name: RouteName.GROUP,
|
||||
params: { preferredUsername: usernameWithDomain(activity.object) },
|
||||
}"
|
||||
>{{ subjectParams.group_name }}</router-link
|
||||
>
|
||||
<b v-else slot="post">{{ subjectParams.group_name }}</b>
|
||||
<b v-if="subjectParams.old_group_name" slot="old_group_name">{{
|
||||
subjectParams.old_group_name
|
||||
}}</b>
|
||||
</i18n>
|
||||
<small class="has-text-grey activity-date">{{
|
||||
activity.insertedAt | formatTimeString
|
||||
}}</small>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { usernameWithDomain } from "@/types/actor";
|
||||
import { ActivityGroupSubject, GroupVisibility, Openness } from "@/types/enums";
|
||||
import { Component } from "vue-property-decorator";
|
||||
import RouteName from "../../router/name";
|
||||
import PopoverActorCard from "../Account/PopoverActorCard.vue";
|
||||
import ActivityMixin from "../../mixins/activity";
|
||||
import { mixins } from "vue-class-component";
|
||||
|
||||
@Component({
|
||||
components: {
|
||||
PopoverActorCard,
|
||||
},
|
||||
})
|
||||
export default class GroupActivityItem extends mixins(ActivityMixin) {
|
||||
usernameWithDomain = usernameWithDomain;
|
||||
RouteName = RouteName;
|
||||
ActivityGroupSubject = ActivityGroupSubject;
|
||||
|
||||
get translation(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityGroupSubject.GROUP_CREATED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You created the group {group}.";
|
||||
}
|
||||
return "{profile} created the group {group}.";
|
||||
case ActivityGroupSubject.GROUP_UPDATED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You updated the group {group}.";
|
||||
}
|
||||
return "{profile} updated the group {group}.";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
get iconColor(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityGroupSubject.GROUP_CREATED:
|
||||
return "is-success";
|
||||
case ActivityGroupSubject.GROUP_UPDATED:
|
||||
return "is-grey";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
get details(): string[] {
|
||||
let details = [];
|
||||
const changes = this.subjectParams.group_changes.split(",");
|
||||
if (changes.includes("name") && this.subjectParams.old_group_name) {
|
||||
details.push("{old_group_name} was renamed to {group}.");
|
||||
}
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (changes.includes("visibility") && this.activity.object.visibility) {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
switch (this.activity.object.visibility) {
|
||||
case GroupVisibility.PRIVATE:
|
||||
details.push("Visibility was set to private.");
|
||||
break;
|
||||
case GroupVisibility.PUBLIC:
|
||||
details.push("Visibility was set to public.");
|
||||
break;
|
||||
default:
|
||||
details.push("Visibility was set to an unknown value.");
|
||||
break;
|
||||
}
|
||||
}
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (changes.includes("openness") && this.activity.object.openness) {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
switch (this.activity.object.openness) {
|
||||
case Openness.INVITE_ONLY:
|
||||
details.push("The group can now only be joined with an invite.");
|
||||
break;
|
||||
case Openness.OPEN:
|
||||
details.push("The group can now be joined by anyone.");
|
||||
break;
|
||||
default:
|
||||
details.push("Unknown value for the openness setting.");
|
||||
break;
|
||||
}
|
||||
}
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (changes.includes("address") && this.activity.object.physicalAddress) {
|
||||
details.push("The group's physical address was changed.");
|
||||
}
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (changes.includes("avatar") && this.activity.object.avatar) {
|
||||
details.push("The group's avatar was changed.");
|
||||
}
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (changes.includes("banner") && this.activity.object.banner) {
|
||||
details.push("The group's banner was changed.");
|
||||
}
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (changes.includes("summary") && this.activity.object.summary) {
|
||||
details.push("The group's short description was changed.");
|
||||
}
|
||||
return details;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "./activity.scss";
|
||||
</style>
|
||||
233
js/src/components/Activity/MemberActivityItem.vue
Normal file
233
js/src/components/Activity/MemberActivityItem.vue
Normal file
@@ -0,0 +1,233 @@
|
||||
<template>
|
||||
<div class="activity-item">
|
||||
<b-icon :icon="icon" :type="iconColor" />
|
||||
<div class="subject">
|
||||
<i18n :path="translation" tag="p">
|
||||
<popover-actor-card
|
||||
v-if="activity.object"
|
||||
:actor="activity.object.actor"
|
||||
:inline="true"
|
||||
slot="member"
|
||||
>
|
||||
<b>
|
||||
{{
|
||||
$t("@{username}", {
|
||||
username: usernameWithDomain(activity.object.actor),
|
||||
})
|
||||
}}</b
|
||||
></popover-actor-card
|
||||
>
|
||||
<b slot="member" v-else>{{
|
||||
subjectParams.member_preferred_username
|
||||
}}</b>
|
||||
<popover-actor-card
|
||||
:actor="activity.author"
|
||||
:inline="true"
|
||||
slot="profile"
|
||||
>
|
||||
<b>
|
||||
{{
|
||||
$t("@{username}", {
|
||||
username: usernameWithDomain(activity.author),
|
||||
})
|
||||
}}</b
|
||||
></popover-actor-card
|
||||
></i18n
|
||||
>
|
||||
<small class="has-text-grey activity-date">{{
|
||||
activity.insertedAt | formatTimeString
|
||||
}}</small>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { usernameWithDomain } from "@/types/actor";
|
||||
import { ActivityMemberSubject, MemberRole } from "@/types/enums";
|
||||
import { Component } from "vue-property-decorator";
|
||||
import RouteName from "../../router/name";
|
||||
import PopoverActorCard from "../Account/PopoverActorCard.vue";
|
||||
import ActivityMixin from "../../mixins/activity";
|
||||
import { mixins } from "vue-class-component";
|
||||
|
||||
export const MEMBER_ROLE_VALUE: Record<string, number> = {
|
||||
[MemberRole.MEMBER]: 20,
|
||||
[MemberRole.MODERATOR]: 50,
|
||||
[MemberRole.ADMINISTRATOR]: 90,
|
||||
[MemberRole.CREATOR]: 100,
|
||||
};
|
||||
|
||||
@Component({
|
||||
components: {
|
||||
PopoverActorCard,
|
||||
},
|
||||
})
|
||||
export default class MemberActivityItem extends mixins(ActivityMixin) {
|
||||
usernameWithDomain = usernameWithDomain;
|
||||
RouteName = RouteName;
|
||||
ActivityMemberSubject = ActivityMemberSubject;
|
||||
|
||||
get translation(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityMemberSubject.MEMBER_REQUEST:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You requested to join the group.";
|
||||
}
|
||||
return "{member} requested to join the group.";
|
||||
case ActivityMemberSubject.MEMBER_INVITED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You invited {member}.";
|
||||
}
|
||||
return "{member} was invited by {profile}.";
|
||||
case ActivityMemberSubject.MEMBER_ADDED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You added the member {member}.";
|
||||
}
|
||||
return "{profile} added the member {member}.";
|
||||
case ActivityMemberSubject.MEMBER_UPDATED:
|
||||
if (this.subjectParams.member_role && this.subjectParams.old_role) {
|
||||
return this.roleUpdate;
|
||||
}
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You updated the member {member}.";
|
||||
}
|
||||
return "{profile} updated the member {member}.";
|
||||
case ActivityMemberSubject.MEMBER_REMOVED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You excluded member {member}.";
|
||||
}
|
||||
return "{profile} excluded member {member}.";
|
||||
case ActivityMemberSubject.MEMBER_QUIT:
|
||||
return "{profile} quit the group.";
|
||||
case ActivityMemberSubject.MEMBER_REJECTED_INVITATION:
|
||||
return "{member} rejected the invitation to join the group.";
|
||||
case ActivityMemberSubject.MEMBER_ACCEPTED_INVITATION:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You accepted the invitation to join the group.";
|
||||
}
|
||||
return "{member} accepted the invitation to join the group.";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
get icon(): string {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityMemberSubject.MEMBER_REQUEST:
|
||||
case ActivityMemberSubject.MEMBER_ADDED:
|
||||
case ActivityMemberSubject.MEMBER_INVITED:
|
||||
case ActivityMemberSubject.MEMBER_ACCEPTED_INVITATION:
|
||||
return "account-multiple-plus";
|
||||
case ActivityMemberSubject.MEMBER_REMOVED:
|
||||
case ActivityMemberSubject.MEMBER_REJECTED_INVITATION:
|
||||
case ActivityMemberSubject.MEMBER_QUIT:
|
||||
return "account-multiple-minus";
|
||||
case ActivityMemberSubject.MEMBER_UPDATED:
|
||||
default:
|
||||
return "account-multiple";
|
||||
}
|
||||
}
|
||||
|
||||
get iconColor(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityMemberSubject.MEMBER_ADDED:
|
||||
case ActivityMemberSubject.MEMBER_INVITED:
|
||||
case ActivityMemberSubject.MEMBER_JOINED:
|
||||
case ActivityMemberSubject.MEMBER_APPROVED:
|
||||
case ActivityMemberSubject.MEMBER_ACCEPTED_INVITATION:
|
||||
return "is-success";
|
||||
case ActivityMemberSubject.MEMBER_REQUEST:
|
||||
case ActivityMemberSubject.MEMBER_UPDATED:
|
||||
return "is-grey";
|
||||
case ActivityMemberSubject.MEMBER_REMOVED:
|
||||
case ActivityMemberSubject.MEMBER_REJECTED_INVITATION:
|
||||
case ActivityMemberSubject.MEMBER_QUIT:
|
||||
return "is-danger";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
get roleUpdate(): string | undefined {
|
||||
if (
|
||||
Object.keys(MEMBER_ROLE_VALUE).includes(this.subjectParams.member_role) &&
|
||||
Object.keys(MEMBER_ROLE_VALUE).includes(this.subjectParams.old_role)
|
||||
) {
|
||||
if (
|
||||
MEMBER_ROLE_VALUE[this.subjectParams.member_role] >
|
||||
MEMBER_ROLE_VALUE[this.subjectParams.old_role]
|
||||
) {
|
||||
switch (this.subjectParams.member_role) {
|
||||
case MemberRole.MODERATOR:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You promoted {member} to moderator.";
|
||||
}
|
||||
if (this.isObjectMemberCurrentActor) {
|
||||
return "You were promoted to moderator by {profile}.";
|
||||
}
|
||||
return "{profile} promoted {member} to moderator.";
|
||||
case MemberRole.ADMINISTRATOR:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You promoted {member} to administrator.";
|
||||
}
|
||||
if (this.isObjectMemberCurrentActor) {
|
||||
return "You were promoted to administrator by {profile}.";
|
||||
}
|
||||
return "{profile} promoted {member} to administrator.";
|
||||
default:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You promoted the member {member} to an unknown role.";
|
||||
}
|
||||
if (this.isObjectMemberCurrentActor) {
|
||||
return "You were promoted to an unknown role by {profile}.";
|
||||
}
|
||||
return "{profile} promoted {member} to an unknown role.";
|
||||
}
|
||||
} else {
|
||||
switch (this.subjectParams.member_role) {
|
||||
case MemberRole.MODERATOR:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You demoted {member} to moderator.";
|
||||
}
|
||||
if (this.isObjectMemberCurrentActor) {
|
||||
return "You were demoted to moderator by {profile}.";
|
||||
}
|
||||
return "{profile} demoted {member} to moderator.";
|
||||
case MemberRole.MEMBER:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You demoted {member} to simple member.";
|
||||
}
|
||||
if (this.isObjectMemberCurrentActor) {
|
||||
return "You were demoted to simple member by {profile}.";
|
||||
}
|
||||
return "{profile} demoted {member} to simple member.";
|
||||
default:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You demoted the member {member} to an unknown role.";
|
||||
}
|
||||
if (this.isObjectMemberCurrentActor) {
|
||||
return "You were demoted to an unknown role by {profile}.";
|
||||
}
|
||||
return "{profile} demoted {member} to an unknown role.";
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You updated the member {member}.";
|
||||
}
|
||||
return "{profile} updated the member {member}";
|
||||
}
|
||||
}
|
||||
|
||||
get isObjectMemberCurrentActor(): boolean {
|
||||
return (
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
this.activity?.object?.actor?.id === this.currentActor?.id &&
|
||||
this.currentActor?.id !== undefined
|
||||
);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "./activity.scss";
|
||||
</style>
|
||||
93
js/src/components/Activity/PostActivityItem.vue
Normal file
93
js/src/components/Activity/PostActivityItem.vue
Normal file
@@ -0,0 +1,93 @@
|
||||
<template>
|
||||
<div class="activity-item">
|
||||
<b-icon :icon="'bullhorn'" :type="iconColor" />
|
||||
<div class="subject">
|
||||
<i18n :path="translation" tag="p">
|
||||
<router-link
|
||||
v-if="activity.object"
|
||||
slot="post"
|
||||
:to="{
|
||||
name: RouteName.POST,
|
||||
params: { slug: subjectParams.post_slug },
|
||||
}"
|
||||
>{{ subjectParams.post_title }}</router-link
|
||||
>
|
||||
<b v-else slot="post">{{ subjectParams.post_title }}</b>
|
||||
<popover-actor-card
|
||||
:actor="activity.author"
|
||||
:inline="true"
|
||||
slot="profile"
|
||||
>
|
||||
<b>
|
||||
{{
|
||||
$t("@{username}", {
|
||||
username: usernameWithDomain(activity.author),
|
||||
})
|
||||
}}</b
|
||||
></popover-actor-card
|
||||
></i18n
|
||||
>
|
||||
<small class="has-text-grey activity-date">{{
|
||||
activity.insertedAt | formatTimeString
|
||||
}}</small>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { usernameWithDomain } from "@/types/actor";
|
||||
import { ActivityPostSubject } from "@/types/enums";
|
||||
import { Component } from "vue-property-decorator";
|
||||
import RouteName from "../../router/name";
|
||||
import PopoverActorCard from "../Account/PopoverActorCard.vue";
|
||||
import ActivityMixin from "../../mixins/activity";
|
||||
import { mixins } from "vue-class-component";
|
||||
|
||||
@Component({
|
||||
components: {
|
||||
PopoverActorCard,
|
||||
},
|
||||
})
|
||||
export default class PostActivityItem extends mixins(ActivityMixin) {
|
||||
usernameWithDomain = usernameWithDomain;
|
||||
RouteName = RouteName;
|
||||
ActivityPostSubject = ActivityPostSubject;
|
||||
|
||||
get translation(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityPostSubject.POST_CREATED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You created the post {post}.";
|
||||
}
|
||||
return "The post {post} was created by {profile}.";
|
||||
case ActivityPostSubject.POST_UPDATED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You updated the post {post}.";
|
||||
}
|
||||
return "The post {post} was updated by {profile}.";
|
||||
case ActivityPostSubject.POST_DELETED:
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You deleted the post {post}.";
|
||||
}
|
||||
return "The post {post} was deleted by {profile}.";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
get iconColor(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityPostSubject.POST_CREATED:
|
||||
return "is-success";
|
||||
case ActivityPostSubject.POST_UPDATED:
|
||||
return "is-grey";
|
||||
case ActivityPostSubject.POST_DELETED:
|
||||
return "is-danger";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "./activity.scss";
|
||||
</style>
|
||||
189
js/src/components/Activity/ResourceActivityItem.vue
Normal file
189
js/src/components/Activity/ResourceActivityItem.vue
Normal file
@@ -0,0 +1,189 @@
|
||||
<template>
|
||||
<div class="activity-item">
|
||||
<b-icon :icon="'link'" :type="iconColor" />
|
||||
<div class="subject">
|
||||
<i18n :path="translation" tag="p">
|
||||
<router-link v-if="activity.object" slot="resource" :to="path">{{
|
||||
subjectParams.resource_title
|
||||
}}</router-link>
|
||||
<b v-else slot="resource">{{ subjectParams.resource_title }}</b>
|
||||
<router-link v-if="activity.object" slot="new_path" :to="path">{{
|
||||
parentDirectory
|
||||
}}</router-link>
|
||||
<b v-else slot="new_path">{{ parentDirectory }}</b>
|
||||
<router-link
|
||||
v-if="activity.object && subjectParams.old_resource_title"
|
||||
slot="old_resource_title"
|
||||
:to="path"
|
||||
>{{ subjectParams.old_resource_title }}</router-link
|
||||
>
|
||||
<b
|
||||
v-else-if="subjectParams.old_resource_title"
|
||||
slot="old_resource_title"
|
||||
>{{ subjectParams.old_resource_title }}</b
|
||||
>
|
||||
|
||||
<popover-actor-card
|
||||
:actor="activity.author"
|
||||
:inline="true"
|
||||
slot="profile"
|
||||
>
|
||||
<b>
|
||||
{{
|
||||
$t("@{username}", {
|
||||
username: usernameWithDomain(activity.author),
|
||||
})
|
||||
}}</b
|
||||
></popover-actor-card
|
||||
></i18n
|
||||
>
|
||||
<small class="has-text-grey activity-date">{{
|
||||
activity.insertedAt | formatTimeString
|
||||
}}</small>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { usernameWithDomain } from "@/types/actor";
|
||||
import { ActivityResourceSubject } from "@/types/enums";
|
||||
import { Component } from "vue-property-decorator";
|
||||
import RouteName from "../../router/name";
|
||||
import PopoverActorCard from "../Account/PopoverActorCard.vue";
|
||||
import ActivityMixin from "../../mixins/activity";
|
||||
import { mixins } from "vue-class-component";
|
||||
import { Location } from "vue-router";
|
||||
|
||||
@Component({
|
||||
components: {
|
||||
PopoverActorCard,
|
||||
},
|
||||
})
|
||||
export default class ResourceActivityItem extends mixins(ActivityMixin) {
|
||||
usernameWithDomain = usernameWithDomain;
|
||||
RouteName = RouteName;
|
||||
|
||||
get translation(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityResourceSubject.RESOURCE_CREATED:
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (this.activity?.object?.type === "folder") {
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You created the folder {resource}.";
|
||||
}
|
||||
return "{profile} created the folder {resource}.";
|
||||
}
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You created the resource {resource}.";
|
||||
}
|
||||
return "{profile} created the resource {resource}.";
|
||||
case ActivityResourceSubject.RESOURCE_MOVED:
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (this.activity?.object?.type === "folder") {
|
||||
if (this.parentDirectory === null) {
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You moved the folder {resource} to the root folder.";
|
||||
}
|
||||
return "{profile} moved the folder {resource} to the root folder.";
|
||||
}
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You moved the folder {resource} into {new_path}.";
|
||||
}
|
||||
return "{profile} moved the folder {resource} into {new_path}.";
|
||||
}
|
||||
if (this.parentDirectory === null) {
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You moved the resource {resource} to the root folder.";
|
||||
}
|
||||
return "{profile} moved the resource {resource} to the root folder.";
|
||||
}
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You moved the resource {resource} into {new_path}.";
|
||||
}
|
||||
return "{profile} moved the resource {resource} into {new_path}.";
|
||||
case ActivityResourceSubject.RESOURCE_UPDATED:
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (this.activity?.object?.type === "folder") {
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You renamed the folder from {old_resource_title} to {resource}.";
|
||||
}
|
||||
return "{profile} renamed the folder from {old_resource_title} to {resource}.";
|
||||
}
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You renamed the resource from {old_resource_title} to {resource}.";
|
||||
}
|
||||
return "{profile} renamed the resource from {old_resource_title} to {resource}.";
|
||||
case ActivityResourceSubject.RESOURCE_DELETED:
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
if (this.activity?.object?.type === "folder") {
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You deleted the folder {resource}.";
|
||||
}
|
||||
return "{profile} deleted the folder {resource}.";
|
||||
}
|
||||
if (this.isAuthorCurrentActor) {
|
||||
return "You deleted the resource {resource}.";
|
||||
}
|
||||
return "{profile} deleted the resource {resource}.";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
get iconColor(): string | undefined {
|
||||
switch (this.activity.subject) {
|
||||
case ActivityResourceSubject.RESOURCE_CREATED:
|
||||
return "is-success";
|
||||
case ActivityResourceSubject.RESOURCE_MOVED:
|
||||
case ActivityResourceSubject.RESOURCE_UPDATED:
|
||||
return "is-grey";
|
||||
case ActivityResourceSubject.RESOURCE_DELETED:
|
||||
return "is-danger";
|
||||
default:
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
get path(): Location {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
let path = this.parentPath(this.activity?.object?.path);
|
||||
if (path === "") {
|
||||
return {
|
||||
name: RouteName.RESOURCE_FOLDER_ROOT,
|
||||
params: {
|
||||
preferredUsername: usernameWithDomain(this.activity.group),
|
||||
},
|
||||
};
|
||||
}
|
||||
return {
|
||||
name: RouteName.RESOURCE_FOLDER,
|
||||
params: {
|
||||
path,
|
||||
preferredUsername: usernameWithDomain(this.activity.group),
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
get parentDirectory(): string | undefined | null {
|
||||
if (this.subjectParams.resource_path) {
|
||||
const parentPath = this.parentPath(this.subjectParams.resource_path);
|
||||
const directory = parentPath.split("/");
|
||||
return directory.pop();
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
parentPath(parent: string): string {
|
||||
let path = parent.split("/");
|
||||
path.pop();
|
||||
return path.join("/").replace(/^\//, "");
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "./activity.scss";
|
||||
</style>
|
||||
30
js/src/components/Activity/SkeletonActivityItem.vue
Normal file
30
js/src/components/Activity/SkeletonActivityItem.vue
Normal file
@@ -0,0 +1,30 @@
|
||||
<template>
|
||||
<div class="activity-item">
|
||||
<span>
|
||||
<b-skeleton circle width="32px" height="32px"></b-skeleton>
|
||||
</span>
|
||||
<div class="subject">
|
||||
<div class="content">
|
||||
<p>
|
||||
<b-skeleton active></b-skeleton>
|
||||
<b-skeleton active class="datetime"></b-skeleton>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<style lang="scss" scoped>
|
||||
@import "./activity.scss";
|
||||
div.activity-item {
|
||||
flex: 1;
|
||||
|
||||
.subject {
|
||||
flex: 1;
|
||||
max-width: 600px;
|
||||
|
||||
.content p > div:last-child {
|
||||
max-width: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
21
js/src/components/Activity/activity.scss
Normal file
21
js/src/components/Activity/activity.scss
Normal file
@@ -0,0 +1,21 @@
|
||||
.activity-item {
|
||||
display: flex;
|
||||
span.icon {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
box-sizing: border-box;
|
||||
border-radius: 50%;
|
||||
background: #fff;
|
||||
border: 2px solid;
|
||||
z-index: 2;
|
||||
flex-shrink: 0;
|
||||
|
||||
&.has-text-grey {
|
||||
border-color: $grey;
|
||||
}
|
||||
}
|
||||
|
||||
.subject {
|
||||
padding: 0.25rem 0 0 0.5rem;
|
||||
}
|
||||
}
|
||||
@@ -58,8 +58,14 @@ export default class ResourceItem extends Vue {
|
||||
|
||||
mapServiceTypeToIcon = mapServiceTypeToIcon;
|
||||
|
||||
get urlHostname(): string {
|
||||
return new URL(this.resource.resourceUrl).hostname.replace(/^(www\.)/, "");
|
||||
get urlHostname(): string | undefined {
|
||||
if (this.resource?.resourceUrl) {
|
||||
return new URL(this.resource.resourceUrl).hostname.replace(
|
||||
/^(www\.)/,
|
||||
""
|
||||
);
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -26,33 +26,35 @@
|
||||
</span>
|
||||
{{ $t("Parent folder") }}
|
||||
</a>
|
||||
<a
|
||||
class="panel-block"
|
||||
v-for="element in resource.children.elements"
|
||||
:class="{
|
||||
clickable:
|
||||
element.type === 'folder' && element.id !== initialResource.id,
|
||||
}"
|
||||
:key="element.id"
|
||||
@click="goDown(element)"
|
||||
>
|
||||
<span class="panel-icon">
|
||||
<b-icon
|
||||
icon="folder"
|
||||
size="is-small"
|
||||
v-if="element.type === 'folder'"
|
||||
/>
|
||||
<b-icon icon="link" size="is-small" v-else />
|
||||
</span>
|
||||
{{ element.title }}
|
||||
<span v-if="element.id === initialResource.id">
|
||||
<em v-if="element.type === 'folder'"> {{ $t("(this folder)") }}</em>
|
||||
<em v-else> {{ $t("(this link)") }}</em>
|
||||
</span>
|
||||
</a>
|
||||
<template v-if="resource.children">
|
||||
<a
|
||||
class="panel-block"
|
||||
v-for="element in resource.children.elements"
|
||||
:class="{
|
||||
clickable:
|
||||
element.type === 'folder' && element.id !== initialResource.id,
|
||||
}"
|
||||
:key="element.id"
|
||||
@click="goDown(element)"
|
||||
>
|
||||
<span class="panel-icon">
|
||||
<b-icon
|
||||
icon="folder"
|
||||
size="is-small"
|
||||
v-if="element.type === 'folder'"
|
||||
/>
|
||||
<b-icon icon="link" size="is-small" v-else />
|
||||
</span>
|
||||
{{ element.title }}
|
||||
<span v-if="element.id === initialResource.id">
|
||||
<em v-if="element.type === 'folder'"> {{ $t("(this folder)") }}</em>
|
||||
<em v-else> {{ $t("(this link)") }}</em>
|
||||
</span>
|
||||
</a>
|
||||
</template>
|
||||
<p
|
||||
class="panel-block content has-text-grey has-text-centered"
|
||||
v-if="resource.children.total === 0"
|
||||
v-if="resource.children && resource.children.total === 0"
|
||||
>
|
||||
{{ $t("No resources in this folder") }}
|
||||
</p>
|
||||
|
||||
28
js/src/components/Utils/Observer.vue
Normal file
28
js/src/components/Utils/Observer.vue
Normal file
@@ -0,0 +1,28 @@
|
||||
<template>
|
||||
<div class="observer" />
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import "intersection-observer";
|
||||
import { Component, Prop, Vue } from "vue-property-decorator";
|
||||
|
||||
@Component
|
||||
export default class Observer extends Vue {
|
||||
@Prop({ required: false, default: () => ({}) }) options!: Record<string, any>;
|
||||
|
||||
observer!: IntersectionObserver;
|
||||
mounted(): void {
|
||||
this.observer = new IntersectionObserver(([entry]) => {
|
||||
if (entry && entry.isIntersecting) {
|
||||
this.$emit("intersect");
|
||||
}
|
||||
}, this.options);
|
||||
|
||||
this.observer.observe(this.$el);
|
||||
}
|
||||
|
||||
destroyed(): void {
|
||||
this.observer.disconnect();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -321,3 +321,98 @@ export const REFRESH_PROFILE = gql`
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export const GROUP_TIMELINE = gql`
|
||||
query GroupTimeline(
|
||||
$preferredUsername: String!
|
||||
$type: ActivityType
|
||||
$page: Int
|
||||
$limit: Int
|
||||
) {
|
||||
group(preferredUsername: $preferredUsername) {
|
||||
id
|
||||
preferredUsername
|
||||
domain
|
||||
name
|
||||
activity(type: $type, page: $page, limit: $limit) {
|
||||
total
|
||||
elements {
|
||||
id
|
||||
insertedAt
|
||||
subject
|
||||
subjectParams {
|
||||
key
|
||||
value
|
||||
}
|
||||
type
|
||||
author {
|
||||
id
|
||||
preferredUsername
|
||||
name
|
||||
domain
|
||||
avatar {
|
||||
id
|
||||
url
|
||||
}
|
||||
}
|
||||
group {
|
||||
id
|
||||
preferredUsername
|
||||
}
|
||||
object {
|
||||
... on Event {
|
||||
id
|
||||
title
|
||||
}
|
||||
... on Post {
|
||||
id
|
||||
title
|
||||
}
|
||||
... on Member {
|
||||
id
|
||||
actor {
|
||||
id
|
||||
name
|
||||
preferredUsername
|
||||
domain
|
||||
avatar {
|
||||
id
|
||||
url
|
||||
}
|
||||
}
|
||||
}
|
||||
... on Resource {
|
||||
id
|
||||
title
|
||||
path
|
||||
type
|
||||
}
|
||||
... on Discussion {
|
||||
id
|
||||
title
|
||||
slug
|
||||
}
|
||||
... on Group {
|
||||
id
|
||||
preferredUsername
|
||||
domain
|
||||
name
|
||||
summary
|
||||
visibility
|
||||
openness
|
||||
physicalAddress {
|
||||
id
|
||||
}
|
||||
banner {
|
||||
id
|
||||
}
|
||||
avatar {
|
||||
id
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
@@ -859,5 +859,101 @@
|
||||
"Last published events": "Last published events",
|
||||
"On {instance}": "On {instance}",
|
||||
"Close events": "Close events",
|
||||
"Within {number} kilometers of {place}": "|Within one kilometer of {place}|Within {number} kilometers of {place}"
|
||||
"Within {number} kilometers of {place}": "|Within one kilometer of {place}|Within {number} kilometers of {place}",
|
||||
"@{username}": "@{username}",
|
||||
"Yesterday": "Yesterday",
|
||||
"You created the event {event}.": "You created the event {event}.",
|
||||
"The event {event} was created by {profile}.": "The event {event} was created by {profile}.",
|
||||
"You updated the event {event}.": "You updated the event {event}.",
|
||||
"The event {event} was updated by {profile}.": "The event {event} was updated by {profile}.",
|
||||
"You deleted the event {event}.": "You deleted the event {event}.",
|
||||
"The event {event} was deleted by {profile}.": "The event {event} was deleted by {profile}.",
|
||||
"You created the post {post}.": "You created the post {post}.",
|
||||
"The post {post} was created by {profile}.": "The post {post} was created by {profile}.",
|
||||
"You updated the post {post}.": "You updated the post {post}.",
|
||||
"The post {post} was updated by {profile}.": "The post {post} was updated by {profile}.",
|
||||
"You deleted the post {post}.": "You deleted the post {post}.",
|
||||
"The post {post} was deleted by {profile}.": "The post {post} was deleted by {profile}.",
|
||||
"No more activity to display.": "No more activity to display.",
|
||||
"There is no activity yet. Start doing some things to see activity appear here.": "There is no activity yet. Start doing some things to see activity appear here.",
|
||||
"{group} activity timeline": "{group} activity timeline",
|
||||
"You promoted {member} to moderator.": "You promoted {member} to moderator.",
|
||||
"You promoted {member} to administrator.": "You promoted {member} to administrator.",
|
||||
"You promoted the member {member} to an unknown role.": "You promoted the member {member} to an unknown role.",
|
||||
"You demoted {member} to moderator.": "You demoted {member} to moderator.",
|
||||
"You demoted {member} to simple member.": "You demoted {member} to simple member.",
|
||||
"You demoted the member {member} to an unknown role.": "You demoted the member {member} to an unknown role.",
|
||||
"You updated the member {member}.": "You updated the member {member}.",
|
||||
"{profile} updated the member {member}.": "{profile} updated the member {member}.",
|
||||
"{profile} promoted {member} to moderator.": "{profile} promoted {member} to moderator.",
|
||||
"{profile} promoted {member} to administrator.": "{profile} promoted {member} to administrator.",
|
||||
"{profile} promoted {member} to an unknown role.": "{profile} promoted {member} to an unknown role.",
|
||||
"{profile} demoted {member} to moderator.": "{profile} demoted {member} to moderator.",
|
||||
"{profile} demoted {member} to simple member.": "{profile} demoted {member} to simple member.",
|
||||
"{profile} demoted {member} to an unknown role.": "{profile} demoted {member} to an unknown role.",
|
||||
"You requested to join the group.": "You requested to join the group.",
|
||||
"{member} requested to join the group.": "{member} requested to join the group.",
|
||||
"You invited {member}.": "You invited {member}.",
|
||||
"{member} was invited by {profile}.": "{member} was invited by {profile}.",
|
||||
"You added the member {member}.": "You added the member {member}.",
|
||||
"{profile} added the member {member}.": "{profile} added the member {member}.",
|
||||
"{member} rejected the invitation to join the group.": "{member} rejected the invitation to join the group.",
|
||||
"{member} accepted the invitation to join the group.": "{member} accepted the invitation to join the group.",
|
||||
"You excluded member {member}.": "You excluded member {member}.",
|
||||
"{profile} excluded member {member}.": "{profile} excluded member {member}.",
|
||||
"You accepted the invitation to join the group.": "You accepted the invitation to join the group.",
|
||||
"You were promoted to moderator by {profile}.": "You were promoted to moderator by {profile}.",
|
||||
"You were promoted to administrator by {profile}.": "You were promoted to administrator by {profile}.",
|
||||
"You were promoted to an unknown role by {profile}.": "You were promoted to an unknown role by {profile}.",
|
||||
"You were demoted to moderator by {profile}.": "You were demoted to moderator by {profile}.",
|
||||
"You were demoted to simple member by {profile}.": "You were demoted to simple member by {profile}.",
|
||||
"You were demoted to an unknown role by {profile}.": "You were demoted to an unknown role by {profile}.",
|
||||
"{profile} quit the group.": "{profile} quit the group.",
|
||||
"You created the folder {resource}.": "You created the folder {resource}.",
|
||||
"{profile} created the folder {resource}.": "{profile} created the folder {resource}.",
|
||||
"You created the resource {resource}.": "You created the resource {resource}.",
|
||||
"{profile} created the resource {resource}.": "{profile} created the resource {resource}.",
|
||||
"You moved the folder {resource} to the root folder.": "You moved the folder {resource} to the root folder.",
|
||||
"{profile} moved the folder {resource} to the root folder.": "{profile} moved the folder {resource} to the root folder.",
|
||||
"You moved the folder {resource} into {new_path}.": "You moved the folder {resource} into {new_path}.",
|
||||
"{profile} moved the folder {resource} into {new_path}.": "{profile} moved the folder {resource} into {new_path}.",
|
||||
"You moved the resource {resource} to the root folder.": "You moved the resource {resource} to the root folder.",
|
||||
"{profile} moved the resource {resource} to the root folder.": "{profile} moved the resource {resource} to the root folder.",
|
||||
"You moved the resource {resource} into {new_path}.": "You moved the resource {resource} into {new_path}.",
|
||||
"{profile} moved the resource {resource} into {new_path}.": "{profile} moved the resource {resource} into {new_path}.",
|
||||
"You renamed the folder from {old_resource_title} to {resource}.": "You renamed the folder from {old_resource_title} to {resource}.",
|
||||
"{profile} renamed the folder from {old_resource_title} to {resource}.": "{profile} renamed the folder from {old_resource_title} to {resource}.",
|
||||
"You renamed the resource from {old_resource_title} to {resource}.": "You renamed the resource from {old_resource_title} to {resource}.",
|
||||
"{profile} renamed the resource from {old_resource_title} to {resource}.": "{profile} renamed the resource from {old_resource_title} to {resource}.",
|
||||
"You deleted the folder {resource}.": "You deleted the folder {resource}.",
|
||||
"{profile} deleted the folder {resource}.": "{profile} deleted the folder {resource}.",
|
||||
"You deleted the resource {resource}.": "You deleted the resource {resource}.",
|
||||
"{profile} deleted the resource {resource}.": "{profile} deleted the resource {resource}.",
|
||||
"Activity": "Activity",
|
||||
"Load more activities": "Load more activities",
|
||||
"You created the discussion {discussion}.": "You created the discussion {discussion}.",
|
||||
"{profile} created the discussion {discussion}.": "{profile} created the discussion {discussion}.",
|
||||
"You replied to the discussion {discussion}.": "You replied to the discussion {discussion}.",
|
||||
"{profile} replied to the discussion {discussion}.": "{profile} replied to the discussion {discussion}.",
|
||||
"You renamed the discussion from {old_discussion} to {discussion}.": "You renamed the discussion from {old_discussion} to {discussion}.",
|
||||
"{profile} renamed the discussion from {old_discussion} to {discussion}.": "{profile} renamed the discussion from {old_discussion} to {discussion}.",
|
||||
"You archived the discussion {discussion}.": "You archived the discussion {discussion}.",
|
||||
"{profile} archived the discussion {discussion}.": "{profile} archived the discussion {discussion}.",
|
||||
"You deleted the discussion {discussion}.": "You deleted the discussion {discussion}.",
|
||||
"{profile} deleted the discussion {discussion}.": "{profile} deleted the discussion {discussion}.",
|
||||
"You created the group {group}.": "You created the group {group}.",
|
||||
"{profile} created the group {group}.": "{profile} created the group {group}.",
|
||||
"You updated the group {group}.": "You updated the group {group}.",
|
||||
"{profile} updated the group {group}.": "{profile} updated the group {group}.",
|
||||
"{old_group_name} was renamed to {group}.": "{old_group_name} was renamed to {group}.",
|
||||
"Visibility was set to private.": "Visibility was set to private.",
|
||||
"Visibility was set to public.": "Visibility was set to public.",
|
||||
"Visibility was set to an unknown value.": "Visibility was set to an unknown value.",
|
||||
"The group can now only be joined with an invite.": "The group can now only be joined with an invite.",
|
||||
"The group can now be joined by anyone.": "The group can now be joined by anyone.",
|
||||
"Unknown value for the openness setting.": "Unknown value for the openness setting.",
|
||||
"The group's physical address was changed.": "The group's physical address was changed.",
|
||||
"The group's avatar was changed.": "The group's avatar was changed.",
|
||||
"The group's banner was changed.": "The group's banner was changed.",
|
||||
"The group's short description was changed.": "The group's short description was changed."
|
||||
}
|
||||
|
||||
@@ -954,5 +954,100 @@
|
||||
"Last published events": "Derniers événements publiés",
|
||||
"On {instance}": "Sur {instance}",
|
||||
"Close events": "Événements proches",
|
||||
"Within {number} kilometers of {place}": "|Dans un rayon d'un kilomètre de {place}|Dans un rayon de {number} kilomètres de {place}"
|
||||
"Within {number} kilometers of {place}": "|Dans un rayon d'un kilomètre de {place}|Dans un rayon de {number} kilomètres de {place}",
|
||||
"Yesterday": "Hier",
|
||||
"You created the event {event}.": "Vous avez créé l'événement {event}.",
|
||||
"The event {event} was created by {profile}.": "L'événement {event} a été créé par {profile}.",
|
||||
"You updated the event {event}.": "Vous avez mis à jour l'événement {event}.",
|
||||
"The event {event} was updated by {profile}.": "L'événement {event} à été mis à jour par {profile}.",
|
||||
"You deleted the event {event}.": "Vous avez supprimé l'événement {event}.",
|
||||
"The event {event} was deleted by {profile}.": "L'événement {event} a été supprimé par {profile}.",
|
||||
"You created the post {post}.": "Vous avez créé le billet {post}.",
|
||||
"The post {post} was created by {profile}.": "Le billet {post} a été créé par {profile}.",
|
||||
"You updated the post {post}.": "Vous avez mis à jour le billet {post}.",
|
||||
"The post {post} was updated by {profile}.": "Le billet {post} a été mis à jour par {profile}.",
|
||||
"You deleted the post {post}.": "Vous avez supprimé le billet {post}.",
|
||||
"The post {post} was deleted by {profile}.": "Le billet {post} a été supprimé par {profile}.",
|
||||
"No more activity to display.": "Il n'y a plus d'activités à afficher.",
|
||||
"There is no activity yet. Start doing some things to see activity appear here.": "Il n'y a pas encore d'activité. Commencez par effectuer des actions pour voir des éléments s'afficher ici.",
|
||||
"{group} activity timeline": "Timeline de l'activité de {group}",
|
||||
"You promoted {member} to moderator.": "Vous avez promu {member} en tant que modérateur⋅ice.",
|
||||
"You promoted {member} to administrator.": "Vous avez promu {member} en tant qu'adminstrateur⋅ice.",
|
||||
"You promoted the member {member} to an unknown role.": "Vous avez promu le ou la membre {member} à un role inconnu.",
|
||||
"You demoted {member} to moderator.": "Vous avez rétrogradé {member} en tant que modérateur⋅ice.",
|
||||
"You demoted {member} to simple member.": "Vous avez rétrogradé {member} en tant que simple membre.",
|
||||
"You demoted the member {member} to an unknown role.": "Vous avez rétrogradé le membre {member} à un role inconnu.",
|
||||
"You updated the member {member}.": "Vous avez mis à jour le ou la membre {member}.",
|
||||
"{profile} updated the member {member}.": "{profile} a mis à jour le ou la membre {member}.",
|
||||
"{profile} promoted {member} to moderator.": "{profile} a promu {member} en tant que modérateur⋅ice.",
|
||||
"{profile} promoted {member} to administrator.": "{profile} a promu {member} en tant qu'administrateur⋅ice.",
|
||||
"{profile} promoted {member} to an unknown role.": "{profile} a promu {member} à un role inconnu.",
|
||||
"{profile} demoted {member} to moderator.": "{profile} a rétrogradé {member} en tant que modérateur⋅ice.",
|
||||
"{profile} demoted {member} to simple member.": "{profile} a rétrogradé {member} en tant que simple membre.",
|
||||
"{profile} demoted {member} to an unknown role.": "{profile} a rétrogradé {member} à un role inconnu.",
|
||||
"You requested to join the group.": "Vous avez demandé à rejoindre le groupe.",
|
||||
"{member} requested to join the group.": "{member} a demandé à rejoindre le groupe.",
|
||||
"You invited {member}.": "Vous avez invité {member}.",
|
||||
"{member} was invited by {profile}.": "{member} a été invité⋅e par {profile}.",
|
||||
"You added the member {member}.": "Vous avez ajouté le ou la membre {member}.",
|
||||
"{profile} added the member {member}.": "{profile} a ajouté le ou la membre {member}.",
|
||||
"{member} rejected the invitation to join the group.": "{member} a refusé l'invitation à se joindre au groupe.",
|
||||
"{member} accepted the invitation to join the group.": "{member} a accepté l'invitation à se joindre au groupe.",
|
||||
"You excluded member {member}.": "Vous avez exclu le ou la membre {member}.",
|
||||
"{profile} excluded member {member}.": "{profile} a exclu le ou la membre {member}.",
|
||||
"You accepted the invitation to join the group.": "Vous avez accepté l'invitation à vous joindre au groupe.",
|
||||
"You were promoted to moderator by {profile}.": "Vous avez été promu⋅e modérateur⋅ice par {profile}.",
|
||||
"You were promoted to administrator by {profile}.": "Vous avez été promu⋅e administrateur⋅ice par {profile}.",
|
||||
"You were promoted to an unknown role by {profile}.": "Vous avez été promu⋅e à un role inconnu par {profile}.",
|
||||
"You were demoted to moderator by {profile}.": "Vous avez été rétrogradé⋅e modérateur⋅ice par {profile}.",
|
||||
"You were demoted to simple member by {profile}.": "Vous avez été rétrogradé⋅e simple membre par {profile}.",
|
||||
"You were demoted to an unknown role by {profile}.": "Vous avez été rétrogradé⋅e à un role inconnu par {profile}.",
|
||||
"{profile} quit the group.": "{profile} a quitté le groupe.",
|
||||
"You created the folder {resource}.": "Vous avez créé le dossier {resource}.",
|
||||
"{profile} created the folder {resource}.": "{profile} a créé le dossier {resource}.",
|
||||
"You created the resource {resource}.": "Vous avez créé la ressource {resource}.",
|
||||
"{profile} created the resource {resource}.": "{profile} a créé la ressource {resource}.",
|
||||
"You moved the folder {resource} to the root folder.": "Vous avez déplacé le dossier {resource} dans le dossier racine.",
|
||||
"{profile} moved the folder {resource} to the root folder.": "{profile} a déplacé le dossier {resource} dans le dossier racine.",
|
||||
"You moved the folder {resource} into {new_path}.": "Vous avez déplacé le dossier {resource} dans {new_path}.",
|
||||
"{profile} moved the folder {resource} into {new_path}.": "{profile} a déplacé le dossier {resource} dans {new_path}.",
|
||||
"You moved the resource {resource} to the root folder.": "Vous avez déplacé la ressource {resource} dans le dossier racine.",
|
||||
"{profile} moved the resource {resource} to the root folder.": "{profile} a déplacé la ressource {resource} dans le dossier racine.",
|
||||
"You moved the resource {resource} into {new_path}.": "Vous avez déplacé la ressource {resource} dans {new_path}.",
|
||||
"{profile} moved the resource {resource} into {new_path}.": "{profile} a déplacé la ressource {resource} dans {new_path}.",
|
||||
"You renamed the folder from {old_resource_title} to {resource}.": "Vous avez renommé le dossier {old_resource_title} en {resource}.",
|
||||
"{profile} renamed the folder from {old_resource_title} to {resource}.": "{profile} a renommé le dossier {old_resource_title} en {resource}.",
|
||||
"You renamed the resource from {old_resource_title} to {resource}.": "Vous avez renommé la ressource {old_resource_title} en {resource}.",
|
||||
"{profile} renamed the resource from {old_resource_title} to {resource}.": "{profile} a renommé la ressource {old_resource_title} en {resource}.",
|
||||
"You deleted the folder {resource}.": "Vous avez supprimé le dossier {resource}.",
|
||||
"{profile} deleted the folder {resource}.": "{profile} a supprimé le dossier {resource}.",
|
||||
"You deleted the resource {resource}.": "Vous avez supprimé la ressource {resource}.",
|
||||
"{profile} deleted the resource {resource}.": "{profile} a supprimé la ressource {resource}.",
|
||||
"Activity": "Activité",
|
||||
"Load more activities": "Charger plus d'activités",
|
||||
"You created the discussion {discussion}.": "Vous avez créé la discussion {discussion}.",
|
||||
"{profile} created the discussion {discussion}.": "{profile} a créé la discussion {discussion}.",
|
||||
"You replied to the discussion {discussion}.": "Vous avez répondu à la discussion {discussion}.",
|
||||
"{profile} replied to the discussion {discussion}.": "{profile} a répondu à la discussion {discussion}.",
|
||||
"You renamed the discussion from {old_discussion} to {discussion}.": "Vous avez renommé la discussion {old_discussion} en {discussion}.",
|
||||
"{profile} renamed the discussion from {old_discussion} to {discussion}.": "{profile} a renommé la discussion {old_discussion} en {discussion}.",
|
||||
"You archived the discussion {discussion}.": "Vous avez archivé la discussion {discussion}.",
|
||||
"{profile} archived the discussion {discussion}.": "{profile} a archivé la discussion {discussion}.",
|
||||
"You deleted the discussion {discussion}.": "Vous avez supprimé la discussion {discussion}.",
|
||||
"{profile} deleted the discussion {discussion}.": "{profile} a supprimé la discussion {discussion}.",
|
||||
"You created the group {group}.": "Vous avez créé le groupe {group}.",
|
||||
"{profile} created the group {group}.": "{profile} a créé le groupe {group}.",
|
||||
"You updated the group {group}.": "Vous avez mis à jour le groupe {group}.",
|
||||
"{profile} updated the group {group}.": "{profile} a mis à jour le groupe {group}.",
|
||||
"{old_group_name} was renamed to {group}.": "{old_group_name} a été renommé en {group}.",
|
||||
"Visibility was set to private.": "La visibilité a été définie à privée.",
|
||||
"Visibility was set to public.": "La visibilité a été définie à public.",
|
||||
"Visibility was set to an unknown value.": "La visibilité a été définie à une valeur inconnue.",
|
||||
"The group can now only be joined with an invite.": "Le groupe peut maintenant être rejoint uniquement sur invitation.",
|
||||
"The group can now be joined by anyone.": "Le groupe peut maintenant être rejoint par n'importe qui.",
|
||||
"Unknown value for the openness setting.": "Valeur inconnue pour le paramètre d'ouverture.",
|
||||
"The group's physical address was changed.": "L'adresse physique du groupe a été changée.",
|
||||
"The group's avatar was changed.": "L'avatar du groupe a été changé.",
|
||||
"The group's banner was changed.": "La bannière du groupe a été changée.",
|
||||
"The group's short description was changed.": "La description courte du groupe a été changée."
|
||||
}
|
||||
|
||||
31
js/src/mixins/activity.ts
Normal file
31
js/src/mixins/activity.ts
Normal file
@@ -0,0 +1,31 @@
|
||||
import { CURRENT_ACTOR_CLIENT } from "@/graphql/actor";
|
||||
import { IActivity } from "@/types/activity.model";
|
||||
import { IActor } from "@/types/actor";
|
||||
import { Component, Prop, Vue } from "vue-property-decorator";
|
||||
|
||||
@Component({
|
||||
apollo: {
|
||||
currentActor: CURRENT_ACTOR_CLIENT,
|
||||
},
|
||||
})
|
||||
export default class ActivityMixin extends Vue {
|
||||
@Prop({ required: true, type: Object }) activity!: IActivity;
|
||||
currentActor!: IActor;
|
||||
|
||||
get subjectParams(): Record<string, string> {
|
||||
return this.activity.subjectParams.reduce(
|
||||
(acc: Record<string, string>, { key, value }) => {
|
||||
acc[key] = value;
|
||||
return acc;
|
||||
},
|
||||
{}
|
||||
);
|
||||
}
|
||||
|
||||
get isAuthorCurrentActor(): boolean {
|
||||
return (
|
||||
this.activity.author.id === this.currentActor.id &&
|
||||
this.currentActor.id !== undefined
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -18,6 +18,7 @@ export enum GroupsRouteName {
|
||||
POSTS = "POSTS",
|
||||
GROUP_EVENTS = "GROUP_EVENTS",
|
||||
GROUP_JOIN = "GROUP_JOIN",
|
||||
TIMELINE = "TIMELINE",
|
||||
}
|
||||
|
||||
const resourceFolder = (): Promise<EsModuleComponent> =>
|
||||
@@ -145,4 +146,12 @@ export const groupsRoutes: RouteConfig[] = [
|
||||
name: GroupsRouteName.GROUP_JOIN,
|
||||
meta: { requiredAuth: false },
|
||||
},
|
||||
{
|
||||
path: "/@:preferredUsername/timeline",
|
||||
name: GroupsRouteName.TIMELINE,
|
||||
component: (): Promise<EsModuleComponent> =>
|
||||
import("@/views/Group/Timeline.vue"),
|
||||
props: true,
|
||||
meta: { requiredAuth: true },
|
||||
},
|
||||
];
|
||||
|
||||
33
js/src/types/activity.model.ts
Normal file
33
js/src/types/activity.model.ts
Normal file
@@ -0,0 +1,33 @@
|
||||
import { IActor, IGroup } from "./actor";
|
||||
import { IMember } from "./actor/member.model";
|
||||
import {
|
||||
ActivityDiscussionSubject,
|
||||
ActivityEventSubject,
|
||||
ActivityGroupSubject,
|
||||
ActivityMemberSubject,
|
||||
ActivityPostSubject,
|
||||
ActivityResourceSubject,
|
||||
ActivityType,
|
||||
} from "./enums";
|
||||
import { IEvent } from "./event.model";
|
||||
import { IPost } from "./post.model";
|
||||
import { IResource } from "./resource";
|
||||
|
||||
export type ActivitySubject =
|
||||
| ActivityEventSubject
|
||||
| ActivityPostSubject
|
||||
| ActivityMemberSubject
|
||||
| ActivityResourceSubject
|
||||
| ActivityDiscussionSubject
|
||||
| ActivityGroupSubject;
|
||||
|
||||
export interface IActivity {
|
||||
id: string;
|
||||
type: ActivityType;
|
||||
subject: ActivitySubject;
|
||||
subjectParams: { key: string; value: string }[];
|
||||
author: IActor;
|
||||
group: IGroup;
|
||||
object: IEvent | IPost | IGroup | IMember | IResource;
|
||||
insertedAt: string;
|
||||
}
|
||||
@@ -10,6 +10,7 @@ import { Address } from "../address.model";
|
||||
import { ActorType, Openness } from "../enums";
|
||||
import type { IMember } from "./member.model";
|
||||
import type { ITodoList } from "../todolist";
|
||||
import { IActivity } from "../activity.model";
|
||||
|
||||
export interface IGroup extends IActor {
|
||||
members: Paginate<IMember>;
|
||||
@@ -20,6 +21,7 @@ export interface IGroup extends IActor {
|
||||
physicalAddress: IAddress;
|
||||
openness: Openness;
|
||||
manuallyApprovesFollowers: boolean;
|
||||
activity: Paginate<IActivity>;
|
||||
}
|
||||
|
||||
export class Group extends Actor implements IGroup {
|
||||
@@ -41,6 +43,7 @@ export class Group extends Actor implements IGroup {
|
||||
|
||||
this.patch(hash);
|
||||
}
|
||||
activity: Paginate<IActivity> = { elements: [], total: 0 };
|
||||
|
||||
openness: Openness = Openness.INVITE_ONLY;
|
||||
|
||||
|
||||
@@ -182,3 +182,56 @@ export enum GroupVisibility {
|
||||
export enum AddressSearchType {
|
||||
ADMINISTRATIVE = "ADMINISTRATIVE",
|
||||
}
|
||||
export enum ActivityType {
|
||||
EVENT = "EVENT",
|
||||
POST = "POST",
|
||||
MEMBER = "MEMBER",
|
||||
RESOURCE = "RESOURCE",
|
||||
DISCUSSION = "DISCUSSION",
|
||||
GROUP = "GROUP",
|
||||
}
|
||||
|
||||
export enum ActivityEventSubject {
|
||||
EVENT_CREATED = "event_created",
|
||||
EVENT_UPDATED = "event_updated",
|
||||
EVENT_DELETED = "event_deleted",
|
||||
}
|
||||
|
||||
export enum ActivityPostSubject {
|
||||
POST_CREATED = "post_created",
|
||||
POST_UPDATED = "post_updated",
|
||||
POST_DELETED = "post_deleted",
|
||||
}
|
||||
|
||||
export enum ActivityMemberSubject {
|
||||
MEMBER_REQUEST = "member_request",
|
||||
MEMBER_INVITED = "member_invited",
|
||||
MEMBER_ACCEPTED_INVITATION = "member_accepted_invitation",
|
||||
MEMBER_REJECTED_INVITATION = "member_rejected_invitation",
|
||||
MEMBER_ADDED = "member_added",
|
||||
MEMBER_JOINED = "member_joined",
|
||||
MEMBER_APPROVED = "member_approved",
|
||||
MEMBER_UPDATED = "member_updated",
|
||||
MEMBER_REMOVED = "member_removed",
|
||||
MEMBER_QUIT = "member_quit",
|
||||
}
|
||||
|
||||
export enum ActivityResourceSubject {
|
||||
RESOURCE_CREATED = "resource_created",
|
||||
RESOURCE_UPDATED = "resource_renamed",
|
||||
RESOURCE_MOVED = "resource_moved",
|
||||
RESOURCE_DELETED = "resource_deleted",
|
||||
}
|
||||
|
||||
export enum ActivityDiscussionSubject {
|
||||
DISCUSSION_CREATED = "discussion_created",
|
||||
DISCUSSION_REPLIED = "discussion_replied",
|
||||
DISCUSSION_RENAMED = "discussion_renamed",
|
||||
DISCUSSION_ARCHIVED = "discussion_archived",
|
||||
DISCUSSION_DELETED = "discussion_deleted",
|
||||
}
|
||||
|
||||
export enum ActivityGroupSubject {
|
||||
GROUP_CREATED = "group_created",
|
||||
GROUP_UPDATED = "group_updated",
|
||||
}
|
||||
|
||||
@@ -86,6 +86,10 @@ $colors: map-merge(
|
||||
$link,
|
||||
$link-invert,
|
||||
),
|
||||
"grey": (
|
||||
$grey,
|
||||
findColorInvert($grey),
|
||||
),
|
||||
)
|
||||
);
|
||||
|
||||
|
||||
@@ -497,13 +497,11 @@ const DEFAULT_LIMIT_NUMBER_OF_PLACES = 10;
|
||||
},
|
||||
metaInfo() {
|
||||
return {
|
||||
// if no subcomponents specify a metaInfo.title, this title will be used
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
title: (this.isUpdate
|
||||
? this.$t("Event edition")
|
||||
: this.$t("Event creation")) as string,
|
||||
// all titles will be injected into this template
|
||||
titleTemplate: "%s | Mobilizon",
|
||||
};
|
||||
},
|
||||
|
||||
@@ -737,11 +737,9 @@ import { IParticipant } from "../../types/participant.model";
|
||||
},
|
||||
metaInfo() {
|
||||
return {
|
||||
// if no subcomponents specify a metaInfo.title, this title will be used
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
title: this.eventTitle,
|
||||
// all titles will be injected into this template
|
||||
titleTemplate: "%s | Mobilizon",
|
||||
meta: [
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
|
||||
@@ -186,9 +186,7 @@ import Subtitle from "../../components/Utils/Subtitle.vue";
|
||||
},
|
||||
metaInfo() {
|
||||
return {
|
||||
// if no subcomponents specify a metaInfo.title, this title will be used
|
||||
title: this.$t("My events") as string,
|
||||
// all titles will be injected into this template
|
||||
titleTemplate: "%s | Mobilizon",
|
||||
};
|
||||
},
|
||||
|
||||
@@ -57,14 +57,27 @@
|
||||
<b-skeleton v-else :animated="true" />
|
||||
<br />
|
||||
<div class="buttons">
|
||||
<router-link
|
||||
<b-button
|
||||
outlined
|
||||
icon-left="timeline-text"
|
||||
v-if="isCurrentActorAGroupMember"
|
||||
tag="router-link"
|
||||
:to="{
|
||||
name: RouteName.TIMELINE,
|
||||
params: { preferredUsername: usernameWithDomain(group) },
|
||||
}"
|
||||
>{{ $t("Activity") }}</b-button
|
||||
>
|
||||
<b-button
|
||||
outlined
|
||||
icon-left="cog"
|
||||
v-if="isCurrentActorAGroupAdmin"
|
||||
tag="router-link"
|
||||
:to="{
|
||||
name: RouteName.GROUP_PUBLIC_SETTINGS,
|
||||
params: { preferredUsername: usernameWithDomain(group) },
|
||||
}"
|
||||
class="button is-outlined"
|
||||
>{{ $t("Group settings") }}</router-link
|
||||
>{{ $t("Group settings") }}</b-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@@ -506,11 +519,9 @@ import ReportModal from "../../components/Report/ReportModal.vue";
|
||||
},
|
||||
metaInfo() {
|
||||
return {
|
||||
// if no subcomponents specify a metaInfo.title, this title will be used
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
title: this.groupTitle,
|
||||
// all titles will be injected into this template
|
||||
titleTemplate: "%s | Mobilizon",
|
||||
meta: [
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
|
||||
@@ -104,9 +104,7 @@ import RouteName from "../../router/name";
|
||||
},
|
||||
metaInfo() {
|
||||
return {
|
||||
// if no subcomponents specify a metaInfo.title, this title will be used
|
||||
title: this.$t("My groups") as string,
|
||||
// all titles will be injected into this template
|
||||
titleTemplate: "%s | Mobilizon",
|
||||
};
|
||||
},
|
||||
|
||||
@@ -49,4 +49,7 @@ export default class Settings extends mixins(GroupMixin) {
|
||||
aside.section {
|
||||
padding-top: 1rem;
|
||||
}
|
||||
.container.section {
|
||||
background: $white;
|
||||
}
|
||||
</style>
|
||||
|
||||
320
js/src/views/Group/Timeline.vue
Normal file
320
js/src/views/Group/Timeline.vue
Normal file
@@ -0,0 +1,320 @@
|
||||
<template>
|
||||
<div class="container section">
|
||||
<nav class="breadcrumb" aria-label="breadcrumbs">
|
||||
<ul v-if="group">
|
||||
<li>
|
||||
<router-link
|
||||
:to="{
|
||||
name: RouteName.GROUP,
|
||||
params: { preferredUsername: usernameWithDomain(group) },
|
||||
}"
|
||||
>{{ group.name }}</router-link
|
||||
>
|
||||
</li>
|
||||
<li>
|
||||
<router-link
|
||||
:to="{
|
||||
name: RouteName.TIMELINE,
|
||||
params: { preferredUsername: usernameWithDomain(group) },
|
||||
}"
|
||||
>{{ $t("Activity") }}</router-link
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
<section class="timeline">
|
||||
<transition-group name="timeline-list" tag="div">
|
||||
<div
|
||||
class="day"
|
||||
v-for="[date, activityItems] in Object.entries(activities)"
|
||||
:key="date"
|
||||
>
|
||||
<b-skeleton
|
||||
v-if="date.search(/skeleton/) !== -1"
|
||||
width="300px"
|
||||
height="48px"
|
||||
/>
|
||||
<h2 class="is-size-3 has-text-weight-bold" v-else-if="isToday(date)">
|
||||
<span v-tooltip="$options.filters.formatDateString(date)">
|
||||
{{ $t("Today") }}
|
||||
</span>
|
||||
</h2>
|
||||
<h2
|
||||
class="is-size-3 has-text-weight-bold"
|
||||
v-else-if="isYesterday(date)"
|
||||
>
|
||||
<span v-tooltip="$options.filters.formatDateString(date)">{{
|
||||
$t("Yesterday")
|
||||
}}</span>
|
||||
</h2>
|
||||
<h2 v-else class="is-size-3 has-text-weight-bold">
|
||||
{{ date | formatDateString }}
|
||||
</h2>
|
||||
<ul>
|
||||
<li v-for="activityItem in activityItems" :key="activityItem.id">
|
||||
<skeleton-activity-item v-if="activityItem.skeleton" />
|
||||
<component
|
||||
v-else
|
||||
:is="component(activityItem.type)"
|
||||
:activity="activityItem"
|
||||
/>
|
||||
</li>
|
||||
</ul></div
|
||||
></transition-group>
|
||||
<empty-content
|
||||
icon="timeline-text"
|
||||
v-if="
|
||||
!$apollo.loading &&
|
||||
activity.elements.length > 0 &&
|
||||
activity.elements.length >= activity.total
|
||||
"
|
||||
>
|
||||
{{ $t("No more activity to display.") }}
|
||||
</empty-content>
|
||||
<empty-content
|
||||
v-if="!$apollo.loading && activities.size === 0"
|
||||
icon="timeline-text"
|
||||
>
|
||||
{{
|
||||
$t(
|
||||
"There is no activity yet. Start doing some things to see activity appear here."
|
||||
)
|
||||
}}
|
||||
</empty-content>
|
||||
<observer @intersect="loadMore" />
|
||||
<b-button
|
||||
v-if="activity.elements.length < activity.total"
|
||||
@click="loadMore"
|
||||
>{{ $t("Load more activities") }}</b-button
|
||||
>
|
||||
</section>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import { GROUP_TIMELINE } from "@/graphql/group";
|
||||
import { IGroup, usernameWithDomain } from "@/types/actor";
|
||||
import { ActivityType } from "@/types/enums";
|
||||
import { Paginate } from "@/types/paginate";
|
||||
import { Component, Prop, Vue } from "vue-property-decorator";
|
||||
import { IActivity } from "../../types/activity.model";
|
||||
import Observer from "../../components/Utils/Observer.vue";
|
||||
import SkeletonActivityItem from "../../components/Activity/SkeletonActivityItem.vue";
|
||||
import RouteName from "../../router/name";
|
||||
|
||||
const PAGINATION_LIMIT = 25;
|
||||
const SKELETON_DAY_ITEMS = 2;
|
||||
const SKELETON_ITEMS_PER_DAY = 5;
|
||||
type IActivitySkeleton = IActivity | { skeleton: string };
|
||||
|
||||
@Component({
|
||||
apollo: {
|
||||
group: {
|
||||
query: GROUP_TIMELINE,
|
||||
variables() {
|
||||
return {
|
||||
preferredUsername: this.preferredUsername,
|
||||
page: 1,
|
||||
limit: PAGINATION_LIMIT,
|
||||
};
|
||||
},
|
||||
},
|
||||
},
|
||||
components: {
|
||||
Observer,
|
||||
SkeletonActivityItem,
|
||||
"event-activity-item": () =>
|
||||
import("../../components/Activity/EventActivityItem.vue"),
|
||||
"post-activity-item": () =>
|
||||
import("../../components/Activity/PostActivityItem.vue"),
|
||||
"member-activity-item": () =>
|
||||
import("../../components/Activity/MemberActivityItem.vue"),
|
||||
"resource-activity-item": () =>
|
||||
import("../../components/Activity/ResourceActivityItem.vue"),
|
||||
"discussion-activity-item": () =>
|
||||
import("../../components/Activity/DiscussionActivityItem.vue"),
|
||||
"group-activity-item": () =>
|
||||
import("../../components/Activity/GroupActivityItem.vue"),
|
||||
"empty-content": () => import("../../components/Utils/EmptyContent.vue"),
|
||||
},
|
||||
metaInfo() {
|
||||
return {
|
||||
title: this.$t("{group} activity timeline", {
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
group: this.group?.name,
|
||||
}) as string,
|
||||
titleTemplate: "%s | Mobilizon",
|
||||
};
|
||||
},
|
||||
})
|
||||
export default class Timeline extends Vue {
|
||||
@Prop({ required: true, type: String }) preferredUsername!: string;
|
||||
|
||||
group!: IGroup;
|
||||
|
||||
RouteName = RouteName;
|
||||
|
||||
usernameWithDomain = usernameWithDomain;
|
||||
|
||||
get activity(): Paginate<IActivitySkeleton> {
|
||||
if (this.group) {
|
||||
return this.group.activity;
|
||||
}
|
||||
return {
|
||||
total: 0,
|
||||
elements: this.skeletons.map((skeleton) => ({
|
||||
skeleton,
|
||||
})),
|
||||
};
|
||||
}
|
||||
|
||||
page = 1;
|
||||
limit = PAGINATION_LIMIT;
|
||||
|
||||
component(type: ActivityType): string | undefined {
|
||||
switch (type) {
|
||||
case ActivityType.EVENT:
|
||||
return "event-activity-item";
|
||||
case ActivityType.POST:
|
||||
return "post-activity-item";
|
||||
case ActivityType.MEMBER:
|
||||
return "member-activity-item";
|
||||
case ActivityType.RESOURCE:
|
||||
return "resource-activity-item";
|
||||
case ActivityType.DISCUSSION:
|
||||
return "discussion-activity-item";
|
||||
case ActivityType.GROUP:
|
||||
return "group-activity-item";
|
||||
}
|
||||
}
|
||||
|
||||
get skeletons(): string[] {
|
||||
return [...Array(SKELETON_DAY_ITEMS)]
|
||||
.map((_, i) => {
|
||||
return [...Array(SKELETON_ITEMS_PER_DAY)].map((_a, j) => {
|
||||
return `${i}-${j}`;
|
||||
});
|
||||
})
|
||||
.flat();
|
||||
}
|
||||
|
||||
async loadMore(): Promise<void> {
|
||||
if (this.page * PAGINATION_LIMIT >= this.activity.total) {
|
||||
return;
|
||||
}
|
||||
this.page++;
|
||||
try {
|
||||
await this.$apollo.queries.group.fetchMore({
|
||||
variables: {
|
||||
page: this.page,
|
||||
limit: PAGINATION_LIMIT,
|
||||
},
|
||||
updateQuery: (previousResult, { fetchMoreResult }) => {
|
||||
if (!fetchMoreResult) return previousResult;
|
||||
const newActivities = fetchMoreResult.group.activity.elements;
|
||||
const newTotal = fetchMoreResult.group.activity.total;
|
||||
return {
|
||||
group: {
|
||||
...previousResult.group,
|
||||
activity: {
|
||||
__typename: previousResult.group.activity.__typename,
|
||||
total: newTotal,
|
||||
elements: [
|
||||
...previousResult.group.activity.elements,
|
||||
...newActivities,
|
||||
],
|
||||
},
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
}
|
||||
}
|
||||
|
||||
get activities(): Record<string, IActivitySkeleton[]> {
|
||||
return this.activity.elements.reduce(
|
||||
(acc: Record<string, IActivitySkeleton[]>, elem) => {
|
||||
let key;
|
||||
if (this.isIActivity(elem)) {
|
||||
const insertedAt = new Date(elem.insertedAt);
|
||||
insertedAt.setHours(0);
|
||||
insertedAt.setMinutes(0);
|
||||
insertedAt.setSeconds(0);
|
||||
insertedAt.setMilliseconds(0);
|
||||
key = insertedAt.toISOString();
|
||||
} else {
|
||||
key = `skeleton-${elem.skeleton.split("-")[0]}`;
|
||||
}
|
||||
const existing = acc[key];
|
||||
if (existing) {
|
||||
acc[key] = [...existing, ...[elem]];
|
||||
} else {
|
||||
acc[key] = [elem];
|
||||
}
|
||||
return acc;
|
||||
},
|
||||
{}
|
||||
);
|
||||
}
|
||||
|
||||
isIActivity(object: IActivitySkeleton): object is IActivity {
|
||||
return !("skeleton" in object);
|
||||
}
|
||||
|
||||
getRandomInt(min: number, max: number): number {
|
||||
min = Math.ceil(min);
|
||||
max = Math.floor(max);
|
||||
return Math.floor(Math.random() * (max - min) + min);
|
||||
}
|
||||
|
||||
isToday(dateString: string): boolean {
|
||||
const now = new Date();
|
||||
const date = new Date(dateString);
|
||||
return (
|
||||
now.getFullYear() === date.getFullYear() &&
|
||||
now.getMonth() === date.getMonth() &&
|
||||
now.getDate() === date.getDate()
|
||||
);
|
||||
}
|
||||
|
||||
isYesterday(dateString: string): boolean {
|
||||
const date = new Date(dateString);
|
||||
const yesterday = new Date();
|
||||
yesterday.setDate(yesterday.getDate() - 1);
|
||||
return (
|
||||
yesterday.getFullYear() === date.getFullYear() &&
|
||||
yesterday.getMonth() === date.getMonth() &&
|
||||
yesterday.getDate() === date.getDate()
|
||||
);
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.container.section {
|
||||
background: $white;
|
||||
}
|
||||
|
||||
.timeline {
|
||||
ul {
|
||||
// padding: 0.5rem 0;
|
||||
margin: 0;
|
||||
list-style: none;
|
||||
position: relative;
|
||||
&::before {
|
||||
content: "";
|
||||
height: 100%;
|
||||
width: 1px;
|
||||
background-color: #d9d9d9;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 1rem;
|
||||
}
|
||||
li {
|
||||
display: flex;
|
||||
margin: 0.5rem 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -407,11 +407,9 @@ import Subtitle from "../components/Utils/Subtitle.vue";
|
||||
},
|
||||
metaInfo() {
|
||||
return {
|
||||
// if no subcomponents specify a metaInfo.title, this title will be used
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
title: this.instanceName,
|
||||
// all titles will be injected into this template
|
||||
titleTemplate: "%s | Mobilizon",
|
||||
};
|
||||
},
|
||||
|
||||
@@ -128,11 +128,9 @@ const POSTS_PAGE_LIMIT = 10;
|
||||
},
|
||||
metaInfo() {
|
||||
return {
|
||||
// if no subcomponents specify a metaInfo.title, this title will be used
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
title: this.$t("My groups") as string,
|
||||
// all titles will be injected into this template
|
||||
titleTemplate: "%s | Mobilizon",
|
||||
};
|
||||
},
|
||||
|
||||
@@ -254,9 +254,7 @@ const GROUP_PAGE_LIMIT = 10;
|
||||
},
|
||||
metaInfo() {
|
||||
return {
|
||||
// if no subcomponents specify a metaInfo.title, this title will be used
|
||||
title: this.$t("Explore events") as string,
|
||||
// all titles will be injected into this template
|
||||
titleTemplate: "%s | Mobilizon",
|
||||
};
|
||||
},
|
||||
|
||||
@@ -156,9 +156,7 @@ import AuthProviders from "../../components/User/AuthProviders.vue";
|
||||
},
|
||||
metaInfo() {
|
||||
return {
|
||||
// if no subcomponents specify a metaInfo.title, this title will be used
|
||||
title: this.$t("Login on Mobilizon!") as string,
|
||||
// all titles will be injected into this template
|
||||
titleTemplate: "%s | Mobilizon",
|
||||
};
|
||||
},
|
||||
|
||||
@@ -203,11 +203,9 @@ import AuthProviders from "../../components/User/AuthProviders.vue";
|
||||
components: { Subtitle, AuthProviders },
|
||||
metaInfo() {
|
||||
return {
|
||||
// if no subcomponents specify a metaInfo.title, this title will be used
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
title: this.title,
|
||||
// all titles will be injected into this template
|
||||
titleTemplate: "%s | Mobilizon",
|
||||
};
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user