From 3e5ca9bca95df2c7ea5d1dc86e04f8a79724281f Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Wed, 9 Jul 2025 09:23:20 +0530
Subject: [PATCH 1/2] fix: Widget message input resize issue (#11896)

---
 app/javascript/shared/components/ResizableTextArea.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/javascript/shared/components/ResizableTextArea.vue b/app/javascript/shared/components/ResizableTextArea.vue
index 088753a23..4dda62cf9 100644
--- a/app/javascript/shared/components/ResizableTextArea.vue
+++ b/app/javascript/shared/components/ResizableTextArea.vue
@@ -69,7 +69,7 @@ export default {
     },
   },
   watch: {
-    value() {
+    modelValue() {
       this.resizeTextarea();
       // 🚨 watch triggers every time the value is changed, we cannot set this to focus then
       // when this runs, it sets the cursor to the end of the body, ignoring the signature

From 5140deb6f682026594f1be847a643466829bbb96 Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Wed, 9 Jul 2025 22:21:25 +0530
Subject: [PATCH 2/2] feat: Captain settings header component (#11912)

---
 .../settings/SettingsHeader.story.vue         | 28 +++++++++++++++++++
 .../settings/SettingsHeader.vue               | 19 +++++++++++++
 2 files changed, 47 insertions(+)
 create mode 100644 app/javascript/dashboard/components-next/captain/pageComponents/settings/SettingsHeader.story.vue
 create mode 100644 app/javascript/dashboard/components-next/captain/pageComponents/settings/SettingsHeader.vue

diff --git a/app/javascript/dashboard/components-next/captain/pageComponents/settings/SettingsHeader.story.vue b/app/javascript/dashboard/components-next/captain/pageComponents/settings/SettingsHeader.story.vue
new file mode 100644
index 000000000..654e5ab16
--- /dev/null
+++ b/app/javascript/dashboard/components-next/captain/pageComponents/settings/SettingsHeader.story.vue
@@ -0,0 +1,28 @@
+<script setup>
+import SettingsHeader from './SettingsHeader.vue';
+</script>
+
+<template>
+  <Story
+    title="Captain/PageComponents/SettingsHeader"
+    :layout="{ type: 'grid', width: '800px' }"
+  >
+    <Variant title="Default">
+      <div class="px-6 py-4 bg-n-background">
+        <SettingsHeader
+          heading="General Settings"
+          description="Configure general preferences for your workspace."
+        />
+      </div>
+    </Variant>
+
+    <Variant title="Long Description">
+      <div class="px-6 py-4 bg-n-background">
+        <SettingsHeader
+          heading="Integrations"
+          description="Manage and configure third-party integrations such as Slack, Zapier, and Webhooks to enhance your workflow."
+        />
+      </div>
+    </Variant>
+  </Story>
+</template>
diff --git a/app/javascript/dashboard/components-next/captain/pageComponents/settings/SettingsHeader.vue b/app/javascript/dashboard/components-next/captain/pageComponents/settings/SettingsHeader.vue
new file mode 100644
index 000000000..dc6b7dda9
--- /dev/null
+++ b/app/javascript/dashboard/components-next/captain/pageComponents/settings/SettingsHeader.vue
@@ -0,0 +1,19 @@
+<script setup>
+defineProps({
+  heading: {
+    type: String,
+    required: true,
+  },
+  description: {
+    type: String,
+    default: '',
+  },
+});
+</script>
+
+<template>
+  <header class="flex flex-col items-start gap-2">
+    <h2 class="text-n-slate-12 text-base font-medium">{{ heading }}</h2>
+    <p class="text-n-slate-11 text-sm">{{ description }}</p>
+  </header>
+</template>