Improve error handling for feedback form

also make sure the message doesn't self-destruct when closing the dialog

tailbone/static/themes/falafel/js/tailbone.feedback.js

@@ -1,11 +1,10 @@
 
 let FeedbackForm = {
-    props: ['action'],
+    props: ['action', 'message'],
     template: '#feedback-template',
     methods: {
 
         showFeedback() {
-            this.message = ''
             this.showDialog = true
             this.$nextTick(function() {
                 this.$refs.textarea.focus()
@@ -30,10 +29,21 @@ let FeedbackForm = {
                 if (data.ok) {
                     alert("Message successfully sent.\n\nThank you for your feedback.")
                     this.showDialog = false
+                    // clear out message, in case they need to send another
+                    this.message = ""
                 } else {
-                    alert("Sorry!  Your message could not be sent.\n\n"
-                          + "Please try to contact the site admin some other way.")
+                    this.$buefy.toast.open({
+                        message: "Failed to send feedback:  " + data.error,
+                        type: 'is-danger',
+                        duration: 4000, // 4 seconds
+                    })
                 }
+            }, response => {
+                this.$buefy.toast.open({
+                    message: "Failed to send feedback!  (unknown server error)",
+                    type: 'is-danger',
+                    duration: 4000, // 4 seconds
+                })
             })
         },
     }
@@ -43,6 +53,5 @@ let FeedbackFormData = {
     referrer: null,
     userUUID: null,
     userName: null,
-    message: '',
     showDialog: false,
 }

tailbone/templates/themes/falafel/base.mako

@@ -334,7 +334,8 @@
             ## Feedback Button / Dialog
             % if request.has_perm('common.feedback'):
                 <feedback-form
-                   action="${url('feedback')}">
+                   action="${url('feedback')}"
+                   :message="feedbackMessage">
                 </feedback-form>
             % endif
 
@@ -512,7 +513,8 @@
     }
 
     let WholePageData = {
-        contentTitleHTML: ${json.dumps(capture(self.content_title))|n}
+        contentTitleHTML: ${json.dumps(capture(self.content_title))|n},
+        feedbackMessage: "",
     }
 
   </script>