From 4bbc2e68c6f7ad790185c294e467bb9eb71bc65a Mon Sep 17 00:00:00 2001
From: Mike <mike.tasset@gmail.com>
Date: Tue, 22 Apr 2025 15:17:23 +0200
Subject: [PATCH] Fix: Tooltip fix (#4535)

---
 .../settings/workspaces/billing/Page.vue      | 28 ++++++++++---------
 .../workspaces/billing/addOns/Card.vue        |  6 +++-
 2 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/packages/frontend-2/components/settings/workspaces/billing/Page.vue b/packages/frontend-2/components/settings/workspaces/billing/Page.vue
index cf214e1f2..cddc8157b 100644
--- a/packages/frontend-2/components/settings/workspaces/billing/Page.vue
+++ b/packages/frontend-2/components/settings/workspaces/billing/Page.vue
@@ -22,20 +22,22 @@
         <SettingsWorkspacesBillingUsage :slug="slug" />
       </section>
 
-      <section class="flex flex-col gap-y-4 md:gap-y-6">
-        <SettingsSectionHeader title="Upgrade your plan" subheading />
-        <PricingTable
-          :slug="slug"
-          :workspace-id="workspace?.id"
-          :role="workspace?.role as WorkspaceRoles"
-          :currency="workspace?.subscription?.currency"
-        />
-      </section>
+      <ClientOnly>
+        <section class="flex flex-col gap-y-4 md:gap-y-6">
+          <SettingsSectionHeader title="Upgrade your plan" subheading />
+          <PricingTable
+            :slug="slug"
+            :workspace-id="workspace?.id"
+            :role="workspace?.role as WorkspaceRoles"
+            :currency="workspace?.subscription?.currency"
+          />
+        </section>
 
-      <section class="flex flex-col gap-y-4 md:gap-y-6">
-        <SettingsSectionHeader title="Add-ons" subheading />
-        <SettingsWorkspacesBillingAddOns :slug="slug" :workspace-id="workspace?.id" />
-      </section>
+        <section class="flex flex-col gap-y-4 md:gap-y-6">
+          <SettingsSectionHeader title="Add-ons" subheading />
+          <SettingsWorkspacesBillingAddOns :slug="slug" :workspace-id="workspace?.id" />
+        </section>
+      </ClientOnly>
     </div>
   </div>
 </template>
diff --git a/packages/frontend-2/components/settings/workspaces/billing/addOns/Card.vue b/packages/frontend-2/components/settings/workspaces/billing/addOns/Card.vue
index 4ed3be167..2c71e0995 100644
--- a/packages/frontend-2/components/settings/workspaces/billing/addOns/Card.vue
+++ b/packages/frontend-2/components/settings/workspaces/billing/addOns/Card.vue
@@ -9,7 +9,11 @@
       <slot name="subtitle" />
     </div>
     <div class="flex items-center gap-x-2">
-      <div v-if="button" :key="buttonId" v-tippy="button.disabledMessage">
+      <div
+        v-if="button"
+        :key="`${buttonId}-${button.disabled}`"
+        v-tippy="button.disabledMessage"
+      >
         <FormButton
           v-bind="button.props || {}"
           :disabled="button.props?.disabled || button.disabled"