Implement postActions, first try

webapp/components/_new/features/SearchResults/SearchResults.vue

@@ -13,9 +13,6 @@
 
     <ds-flex-item :width="{ base: '100%', sm: 3, md: 5, lg: 3 }">
       <masonry-grid>
-        <!-- tabs -->
-        <new-tab-navigation :tabs="tabOptions" :activeTab="activeTab" @switch-tab="switchTab" />
-
         <!-- search text and result count -->
         <ds-grid-item class="grid-total-search-results" :row-span="1" column-span="fullWidth">
           <ds-space margin-bottom="xxx-small" margin-top="xxx-small" centered>
@@ -29,6 +26,9 @@
           </ds-space>
         </ds-grid-item>
 
+        <!-- tabs -->
+        <new-tab-navigation :tabs="tabOptions" :activeTab="activeTab" @switch-tab="switchTab" />
+
         <!-- search results -->
 
         <template v-if="!(!activeResourceCount || searchCount === 0)">
@@ -56,12 +56,16 @@
               :key="post.id"
               :imageAspectRatio="post.image && post.image.aspectRatio"
             >
-              <post-teaser
+              <!-- Wolle implement <post-teaser
                 :post="post"
                 :width="{ base: '100%', md: '100%', xl: '50%' }"
                 @removePostFromList="removePostFromList"
                 @pinPost="pinPost"
                 @unpinPost="unpinPost"
+              /> -->
+              <post-teaser
+                :post="post"
+                :width="{ base: '100%', md: '100%', xl: '50%' }"
               />
             </masonry-grid-item>
           </template>

webapp/mixins/postActions.js

@@ -0,0 +1,39 @@
+export default {
+  methods: {
+    deletePost(deletedPost) {
+      this.posts = this.posts.filter((post) => {
+        return post.id !== deletedPost.id
+      })
+    },
+    pinPost(post) {
+      this.$apollo
+        .mutate({
+          mutation: PostMutations().pinPost,
+          variables: {
+            id: post.id
+          },
+        })
+        .then(() => {
+          this.$toast.success(this.$t('post.menu.pinnedSuccessfully'))
+          this.resetPostList()
+          this.$apollo.queries.Post.refetch()
+        })
+        .catch((error) => this.$toast.error(error.message))
+    },
+    unpinPost(post) {
+      this.$apollo
+        .mutate({
+          mutation: PostMutations().unpinPost,
+          variables: {
+            id: post.id
+          },
+        })
+        .then(() => {
+          this.$toast.success(this.$t('post.menu.unpinnedSuccessfully'))
+          this.resetPostList()
+          this.$apollo.queries.Post.refetch()
+        })
+        .catch((error) => this.$toast.error(error.message))
+    },
+  },
+}

webapp/pages/index.vue

@@ -64,6 +64,7 @@
 </template>
 
 <script>
+// Wolle import postActions from '~/mixins/postActions'
 // import DonationInfo from '~/components/DonationInfo/DonationInfo.vue'
 import HashtagsFilter from '~/components/HashtagsFilter/HashtagsFilter.vue'
 import HcEmpty from '~/components/Empty/Empty'
@@ -84,6 +85,7 @@ export default {
     MasonryGrid,
     MasonryGridItem,
   },
+  // Wolle mixins: [postActions],
   data() {
     const { hashtag = null } = this.$route.query
     return {