Add group search

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

js/src/components/Group/GroupCard.vue

@@ -9,21 +9,21 @@
         </div>
         <div class="media-content">
           <router-link
-            :to="{ name: RouteName.GROUP, params: { preferredUsername: groupFullUsername } }"
+            :to="{
+              name: RouteName.GROUP,
+              params: { preferredUsername: usernameWithDomain(group) },
+            }"
           >
-            <h3>{{ member.parent.name }}</h3>
+            <h3>{{ group.name }}</h3>
             <p class="is-6 has-text-grey">
-              <span v-if="member.parent.domain">{{
-                `@${member.parent.preferredUsername}@${member.parent.domain}`
-              }}</span>
-              <span v-else>{{ `@${member.parent.preferredUsername}` }}</span>
+              <span v-if="group.domain">{{ `@${group.preferredUsername}@${group.domain}` }}</span>
+              <span v-else>{{ `@${group.preferredUsername}` }}</span>
             </p>
-            <b-tag type="is-info">{{ member.role }}</b-tag>
           </router-link>
         </div>
       </div>
       <div class="content">
-        <p>{{ member.parent.summary }}</p>
+        <p>{{ group.summary }}</p>
       </div>
     </div>
   </div>
@@ -31,20 +31,15 @@
 
 <script lang="ts">
 import { Component, Prop, Vue } from "vue-property-decorator";
-import { IGroup, IMember } from "@/types/actor";
+import { IGroup, usernameWithDomain } from "@/types/actor";
 import RouteName from "../../router/name";
 
 @Component
 export default class GroupCard extends Vue {
-  @Prop({ required: true }) member!: IMember;
+  @Prop({ required: true }) group!: IGroup;
 
   RouteName = RouteName;
 
-  get groupFullUsername() {
-    if (this.member.parent.domain) {
-      return `${this.member.parent.preferredUsername}@${this.member.parent.domain}`;
-    }
-    return this.member.parent.preferredUsername;
-  }
+  usernameWithDomain = usernameWithDomain;
 }
 </script>