Improve post & events cards, homepage and my events page

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

js/src/mixins/group.ts

@@ -3,7 +3,7 @@ import {
   GROUP_MEMBERSHIP_SUBSCRIPTION_CHANGED,
   PERSON_STATUS_GROUP,
 } from "@/graphql/actor";
-import { FETCH_GROUP } from "@/graphql/group";
+import { DELETE_GROUP, FETCH_GROUP } from "@/graphql/group";
 import RouteName from "@/router/name";
 import {
   IActor,
@@ -14,6 +14,7 @@ import {
 } from "@/types/actor";
 import { MemberRole } from "@/types/enums";
 import { Component, Vue } from "vue-property-decorator";
+import { Route } from "vue-router";
 
 const now = new Date();
 
@@ -135,4 +136,28 @@ export default class GroupMixin extends Vue {
       this.$router.replace({ name: RouteName.PAGE_NOT_FOUND });
     }
   }
+
+  confirmDeleteGroup(): void {
+    this.$buefy.dialog.confirm({
+      title: this.$t("Delete group") as string,
+      message: this.$t(
+        "Are you sure you want to <b>completely delete</b> this group? All members - including remote ones - will be notified and removed from the group, and <b>all of the group data (events, posts, discussions, todos…) will be irretrievably destroyed</b>."
+      ) as string,
+      confirmText: this.$t("Delete group") as string,
+      cancelText: this.$t("Cancel") as string,
+      type: "is-danger",
+      hasIcon: true,
+      onConfirm: () => this.deleteGroup(),
+    });
+  }
+
+  async deleteGroup(): Promise<Route> {
+    await this.$apollo.mutate<{ deleteGroup: IGroup }>({
+      mutation: DELETE_GROUP,
+      variables: {
+        groupId: this.group.id,
+      },
+    });
+    return this.$router.push({ name: RouteName.MY_GROUPS });
+  }
 }

js/src/mixins/post.ts

@@ -0,0 +1,64 @@
+import { DELETE_POST, FETCH_POST } from "@/graphql/post";
+import { usernameWithDomain } from "@/types/actor";
+import { IPost } from "@/types/post.model";
+import { Component, Vue } from "vue-property-decorator";
+import RouteName from "../router/name";
+
+@Component({
+  apollo: {
+    post: {
+      query: FETCH_POST,
+      fetchPolicy: "cache-and-network",
+      variables() {
+        return {
+          slug: this.slug,
+        };
+      },
+      skip() {
+        return !this.slug;
+      },
+      error({ graphQLErrors }) {
+        this.handleErrors(graphQLErrors);
+      },
+    },
+  },
+})
+export default class PostMixin extends Vue {
+  post!: IPost;
+
+  RouteName = RouteName;
+
+  protected async openDeletePostModal(): Promise<void> {
+    this.$buefy.dialog.confirm({
+      type: "is-danger",
+      title: this.$t("Delete post") as string,
+      message: this.$t(
+        "Are you sure you want to delete this post? This action cannot be reverted."
+      ) as string,
+      onConfirm: () => this.deletePost(),
+    });
+  }
+
+  async deletePost(): Promise<void> {
+    const { data } = await this.$apollo.mutate({
+      mutation: DELETE_POST,
+      variables: {
+        id: this.post.id,
+      },
+    });
+    if (data && this.post.attributedTo) {
+      this.$router.push({
+        name: RouteName.POSTS,
+        params: {
+          preferredUsername: usernameWithDomain(this.post.attributedTo),
+        },
+      });
+    }
+  }
+
+  handleErrors(errors: any[]): void {
+    if (errors.some((error) => error.status_code === 404)) {
+      this.$router.replace({ name: RouteName.PAGE_NOT_FOUND });
+    }
+  }
+}