From f5d8014f6c8c414debbc378d6dea89fba250137d Mon Sep 17 00:00:00 2001
From: Moriz Wahl <moriz.wahl@gmx.de>
Date: Wed, 7 Sep 2022 11:06:43 +0200
Subject: [PATCH] fix: Category Filter Menu Client Only

---
 webapp/components/FilterMenu/CategoriesMenu.vue | 6 +++---
 webapp/layouts/default.vue                      | 4 +++-
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/webapp/components/FilterMenu/CategoriesMenu.vue b/webapp/components/FilterMenu/CategoriesMenu.vue
index f8a224003..37bd19c84 100644
--- a/webapp/components/FilterMenu/CategoriesMenu.vue
+++ b/webapp/components/FilterMenu/CategoriesMenu.vue
@@ -1,5 +1,5 @@
 <template>
-  <dropdown ref="menu" placement="top-start" :offset="8" class="filter-menu">
+  <dropdown ref="category-menu" placement="top-start" :offset="8" class="category-menu">
     <base-button
       slot="default"
       :filled="filterActive"
@@ -10,7 +10,7 @@
       <ds-text uppercase>{{ $t('admin.categories.name') }}</ds-text>
     </base-button>
     <template slot="popover">
-      <div class="filter-menu-options">
+      <div class="category-menu-options">
         <h2 class="title">{{ $t('filter-menu.filter-by') }}</h2>
         <categories-filter v-if="categoriesActive" />
       </div>
@@ -47,7 +47,7 @@ export default {
 </script>
 
 <style lang="scss">
-.filter-menu-options {
+.category-menu-options {
   max-width: $size-max-width-filter-menu;
   padding: $space-small $space-x-small;
 
diff --git a/webapp/layouts/default.vue b/webapp/layouts/default.vue
index 97b070d11..1e4fe5cf5 100644
--- a/webapp/layouts/default.vue
+++ b/webapp/layouts/default.vue
@@ -20,7 +20,9 @@
               :class="{ 'hide-mobile-menu': !toggleMobileMenu }"
               style="flex-grow: 0; flex-basis: auto"
             >
-              <categories-menu></categories-menu>
+              <client-only>
+                <categories-menu></categories-menu>
+              </client-only>
             </ds-flex-item>
             <ds-flex-item
               :width="{ base: '45%', sm: '45%', md: '45%', lg: '50%' }"