fix(surveys): prioritize question button text field and thank you cou…

…ntdown is not automatic (#893) * fix(surveys): prioritize question button text field * thank you messages do not auto disappear
PostHog · Nov 15, 2023 · c64cc35 · c64cc35
1 parent a5dd496
commit c64cc35
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 4 deletions.
diff --git 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
@@ -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 {