From c64cc35125146a2554f7c8dd987f62d975c35b25 Mon Sep 17 00:00:00 2001
From: Li Yi Yu <li@posthog.com>
Date: Tue, 14 Nov 2023 19:32:44 -0500
Subject: [PATCH] fix(surveys): prioritize question button text field and thank
 you countdown is not automatic (#893)

* fix(surveys): prioritize question button text field

* thank you messages do not auto disappear
---
 src/extensions/surveys.ts    | 8 ++++----
 src/posthog-surveys-types.ts | 3 +++
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/extensions/surveys.ts b/src/extensions/surveys.ts
index 5d294e7b5..52f783be7 100644
--- a/src/extensions/surveys.ts
+++ b/src/extensions/surveys.ts
@@ -361,7 +361,7 @@ export const createOpenTextOrLinkPopup = (
         <div class="bottom-section">
             <div class="buttons">
                 <button class="form-submit auto-text-color" type="submit">${
-                    survey.appearance?.submitButtonText || 'Submit'
+                    question.buttonText || survey.appearance?.submitButtonText || 'Submit'
                 }</button>
             </div>
             <a href="https://posthog.com" target="_blank" rel="noopener" class="footer-branding auto-text-color">Survey by ${posthogLogo}</a>
@@ -526,7 +526,7 @@ export const createRatingsPopup = (
             <div class="bottom-section">
             <div class="buttons">
                 <button class="form-submit auto-text-color" type="submit" ${isOptional ? '' : 'disabled'}>${
-        survey.appearance?.submitButtonText || 'Submit'
+        question.buttonText || survey.appearance?.submitButtonText || 'Submit'
     }</button>
             </div>
             <a href="https://posthog.com" target="_blank" rel="noopener" class="footer-branding auto-text-color">Survey by ${posthogLogo}</a>
@@ -618,7 +618,7 @@ export const createMultipleChoicePopup = (
         <div class="bottom-section">
         <div class="buttons">
             <button class="form-submit auto-text-color" type="submit" ${isOptional ? '' : 'disabled'}>${
-        survey.appearance?.submitButtonText || 'Submit'
+        question.buttonText || survey.appearance?.submitButtonText || 'Submit'
     }</button>
         </div>
         <a href="https://posthog.com" target="_blank" rel="noopener" class="footer-branding auto-text-color">Survey by ${posthogLogo}</a>
@@ -741,7 +741,7 @@ export const callSurveys = (posthog: PostHog, forceReload: boolean = false) => {
                                 })
                             }
                             const countdownEl = thankYouElement.querySelector('.thank-you-message-countdown')
-                            if (countdownEl) {
+                            if (survey.appearance?.autoDisappear && countdownEl) {
                                 let count = 3
                                 countdownEl.textContent = `(${count})`
                                 const countdown = setInterval(() => {
diff --git a/src/posthog-surveys-types.ts b/src/posthog-surveys-types.ts
index e5862f02b..30b122b9f 100644
--- a/src/posthog-surveys-types.ts
+++ b/src/posthog-surveys-types.ts
@@ -9,12 +9,14 @@ export interface SurveyAppearance {
     backgroundColor?: string
     submitButtonColor?: string
     textColor?: string
+    // deprecate submit button text eventually
     submitButtonText?: string
     descriptionTextColor?: string
     ratingButtonColor?: string
     ratingButtonActiveColor?: string
     ratingButtonHoverColor?: string
     whiteLabel?: boolean
+    autoDisappear?: boolean
     displayThankYouMessage?: boolean
     thankYouMessageHeader?: string
     thankYouMessageDescription?: string
@@ -37,6 +39,7 @@ interface SurveyQuestionBase {
     question: string
     description?: string | null
     optional?: boolean
+    buttonText?: string
 }
 
 export interface BasicSurveyQuestion extends SurveyQuestionBase {