From 11e992aa1d4f10f649b48918a898c2f38e32656c Mon Sep 17 00:00:00 2001
From: ogerly <fridolin@tutanota.com>
Date: Thu, 9 Feb 2023 09:14:37 +0100
Subject: [PATCH] filters colored which were selected by filter

---
 webapp/components/Category/index.vue        | 6 +++++-
 webapp/components/PostTeaser/PostTeaser.vue | 5 +++++
 webapp/pages/index.vue                      | 1 +
 3 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/webapp/components/Category/index.vue b/webapp/components/Category/index.vue
index 91ec7613c..f75fef31f 100644
--- a/webapp/components/Category/index.vue
+++ b/webapp/components/Category/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <ds-tag class="category-tag">
+  <ds-tag class="category-tag" :class="filterActive ? 'filterActive' : ''">
     <base-icon :name="icon" />
     {{ name }}
   </ds-tag>
@@ -11,6 +11,7 @@ export default {
   props: {
     icon: { type: String, required: true },
     name: { type: String, default: '' },
+    filterActive: { type: Boolean, default: false, required: false },
   },
 }
 </script>
@@ -28,4 +29,7 @@ export default {
     font-size: $font-size-base;
   }
 }
+.filterActive{
+  background-color: $color-success-active;
+}
 </style>
diff --git a/webapp/components/PostTeaser/PostTeaser.vue b/webapp/components/PostTeaser/PostTeaser.vue
index c99e0dad2..6dc770d99 100644
--- a/webapp/components/PostTeaser/PostTeaser.vue
+++ b/webapp/components/PostTeaser/PostTeaser.vue
@@ -37,6 +37,7 @@
               placement: 'bottom-start',
             }"
             :icon="category.icon"
+            :filterActive="postsFilter ? postsFilter.id_in.includes(category.id) : false"
           />
         </div>
         <div v-else class="categories-placeholder"></div>
@@ -107,6 +108,10 @@ export default {
       type: Object,
       default: () => {},
     },
+    postsFilter: {
+      type: Object,
+      default: () => {},
+    },
   },
   data() {
     return {
diff --git a/webapp/pages/index.vue b/webapp/pages/index.vue
index 37c07eeab..0f6583bb8 100644
--- a/webapp/pages/index.vue
+++ b/webapp/pages/index.vue
@@ -93,6 +93,7 @@
         >
           <post-teaser
             :post="post"
+            :postsFilter="postsFilter['categories_some']"
             @removePostFromList="posts = removePostFromList(post, posts)"
             @pinPost="pinPost(post, refetchPostList)"
             @unpinPost="unpinPost(post, refetchPostList)"