From 31e4e2b1373b35765a6b1592cf46709d0fa19540 Mon Sep 17 00:00:00 2001
From: nicoMaz <139277771+nicomaz@users.noreply.github.com>
Date: Wed, 1 May 2024 17:41:07 +0100
Subject: [PATCH] fix: update button based on screen size

---
 frontend/pages/organizations/[id]/about.vue | 23 +++++++++++----------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/frontend/pages/organizations/[id]/about.vue b/frontend/pages/organizations/[id]/about.vue
index 5a4426633..0a875f3c4 100644
--- a/frontend/pages/organizations/[id]/about.vue
+++ b/frontend/pages/organizations/[id]/about.vue
@@ -124,30 +124,31 @@ const expandReduceText = () => {
   textExpanded.value = !textExpanded.value;
 };
 
-const currentWidth = ref(window.innerWidth);
-let resizeTimeout: ReturnType<typeof setTimeout> | null = null;
+const windowWidth = ref(window.innerWidth);
 const shareButtonLabel = ref("");
 
 function updateShareBtnLabel() {
-  if (currentWidth.value < Breakpoint.SMALL) {
+  windowWidth.value = window.innerWidth;
+  if (windowWidth.value < Breakpoint.SMALL) {
     shareButtonLabel.value = "components.btn-action.share";
   } else {
     shareButtonLabel.value = "components._global.share-organization";
   }
 }
 
-const handleResize = () => {
-  if (resizeTimeout) {
-    clearTimeout(resizeTimeout);
-  }
-  resizeTimeout = setTimeout(updateShareBtnLabel, 100);
-};
-
 onMounted(() => {
-  window.addEventListener("resize", handleResize);
+  window.addEventListener("resize", updateShareBtnLabel);
+  updateShareBtnLabel();
+});
+
+onUpdated(() => {
   updateShareBtnLabel();
 });
 
+onUnmounted(() => {
+  window.removeEventListener("resize", updateShareBtnLabel);
+});
+
 // TODO: for testing purpose, should be removed.
 // const upVotes = ref(123);
 // const downVotes = ref(123);