From d09f93283475e70fe8bff494bdd37589a942e133 Mon Sep 17 00:00:00 2001
From: Johannes Zellner <johannes@cloudron.io>
Date: Tue, 8 Jul 2025 17:30:58 +0200
Subject: [PATCH] Show subscription required dialog on section title badge
 click

---
 dashboard/src/components/Section.vue | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/dashboard/src/components/Section.vue b/dashboard/src/components/Section.vue
index 122614ebc..8fd1c0048 100644
--- a/dashboard/src/components/Section.vue
+++ b/dashboard/src/components/Section.vue
@@ -1,5 +1,7 @@
 <script setup>
 
+import { inject } from 'vue';
+
 defineProps({
   title: String,
   padding: {
@@ -12,6 +14,12 @@ defineProps({
   },
 });
 
+const subscriptionRequiredDialog = inject('subscriptionRequiredDialog');
+
+function onTitleBadge() {
+  subscriptionRequiredDialog.value.open();
+}
+
 </script>
 
 <template>
@@ -19,7 +27,7 @@ defineProps({
     <h2 class="section-header">
       <div>
         <slot name="header-title">{{ title }}</slot>
-        <div class="section-header-title-badge" v-if="titleBadge">{{ titleBadge }}</div>
+        <div class="section-header-title-badge" v-if="titleBadge" @click="onTitleBadge()">{{ titleBadge }}</div>
       </div>
       <div><slot name="header-buttons"></slot></div>
     </h2>
@@ -90,6 +98,7 @@ defineProps({
   background-color: #00c383;
   padding: 2px 10px;
   margin-left: 10px;
+  cursor: pointer;
 }
 
 </style>
\ No newline at end of file