From 54bf8ad6cfc8a909dfede20e88f049b4bbcca1f9 Mon Sep 17 00:00:00 2001
From: Sohan Deshar <s.deshar@metaways.de>
Date: Fri, 13 Dec 2024 08:54:36 +0000
Subject: [PATCH] Fixes render issues from deactivated apps in DockState

---
 tine20/Tinebase/js/TineDock/TineDock.vue | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/tine20/Tinebase/js/TineDock/TineDock.vue b/tine20/Tinebase/js/TineDock/TineDock.vue
index 1ca02e9571..1da27d675d 100644
--- a/tine20/Tinebase/js/TineDock/TineDock.vue
+++ b/tine20/Tinebase/js/TineDock/TineDock.vue
@@ -71,7 +71,7 @@
 <script setup>
 /* eslint-disable vue/no-mutating-props */
 /* eslint-disable */
-import {computed, ref, watch, inject, onMounted, onUpdated} from 'vue'
+import {computed, ref, watch, inject, onMounted, onUpdated, onBeforeMount} from 'vue'
 import {useScroll, useWindowSize} from '@vueuse/core'
 import TMenu from "../vue/components/TMenu.vue";
 
@@ -124,7 +124,7 @@ const dockedAppsInternal = computed(() => {
       return _.find(availableApps.value, availableApp => {
         return availableApp.name === appName
       })
-    })
+    }).filter(app => app)
     : []
 })
 
@@ -177,6 +177,12 @@ const dragEnd = () => {
 
 // hiding the dock for small screen devices
 const { width } = useWindowSize()
+onBeforeMount(() => {
+  const diff = _.difference(props.state.dockedApps, dockedAppsInternal.value.map(el => el.name))
+  if (diff.length) {
+    _.remove(props.state.dockedApps, (app) => diff.includes(app))
+  }
+})
 onMounted(() => {
   const t = Tine.Tinebase.MainScreen.getDock()
   if(width.value <= 500){