Fix notification bug on the supporter side panel

app/views/nonprofits/payments/index.html.erb

@@ -20,7 +20,6 @@
 
   <script>
     appl.def('open_donation_modal', function(payment_details) {
-      $('.modal').removeClass('inView')
 
       function SetupLoadReactEditPaymentPane(modalActive){
         LoadReactEditPaymentPane(document.getElementById('EditPaymentPaneElement'),

client/js/nonprofits/payments/index/payment_details.js

@@ -96,6 +96,7 @@ appl.def('start_loading', function(){
 appl.def('update_donation__success', function() {
   appl.ajax_payment_details.fetch(appl.payment_details.data.id)
   appl.def('loading', false)
+	// appl.close_modal()
   appl.notify('Donation successfully updated!')
 })
 

client/js/nonprofits/supporters/index/sidepanel/offsite-donation-form.js

@@ -16,7 +16,7 @@ function init(parentState) {
   var state = {
     submit$: flyd.stream()
   , supporter$: parentState.supporter$
-  , saved$: flyd.stream(Math.random())
+  , saved$: flyd.stream()
   }
   
 

javascripts/src/components/common/Modal.tsx

@@ -10,7 +10,7 @@ export interface ModalProps
   titleText?: string
   focusDialog?:boolean
   dialogStyle?:any
-  childGenerator:() => JSX.Element
+  childGenerator:() => any
 }
 
 class Modal extends React.Component<ModalProps, {}> {

javascripts/src/components/common/form/ReactSelect.tsx

@@ -23,15 +23,10 @@ class ReactSelect extends React.Component<InputTypes, {}> {
     super(props)
   }
 
-  @observable
-  field:Field
-
 
   @action.bound
   componentWillMount(){
 
-    this.field = this.props.field
-
 
     this.updateProps()
   }
@@ -46,8 +41,8 @@ class ReactSelect extends React.Component<InputTypes, {}> {
 
   @action.bound
   updateProps() {
-    this.field.set('label', castToNullIfUndef(this.props.label))
+    this.props.field.set('label', castToNullIfUndef(this.props.label))
-    this.field.set('placeholder', castToNullIfUndef(this.props.placeholder))
+    this.props.field.set('placeholder', castToNullIfUndef(this.props.placeholder))
   }
 
 
@@ -64,7 +59,7 @@ class ReactSelect extends React.Component<InputTypes, {}> {
 
   render() {
 
-    return <select {...this.winnowProps()} {...this.field.bind()}>
+    return <select {...this.winnowProps()} {...this.props.field.bind()}>
       { this.props.options ? this.props.options.map(option =>
         <option key={option.id} value={option.id}>{option.name}</option>
       ) : this.props.children

javascripts/src/components/create_offsite_payment_pane/CreateOffsitePaymentPane.tsx

@@ -180,6 +180,7 @@ class CreateNewOffsitePaymentPane extends React.Component<CreateOffsitePaymentPa
   }
 
   render() {
+    this.form.values()
     const modal =
       <Modal modalActive={this.props.modalActive} titleText={'Edit Donation'} focusDialog={true}
              onClose={this.props.onClose} dialogStyle={{minWidth:'768px'}} childGenerator={() => {

javascripts/src/components/edit_payment_pane/EditPaymentPane.tsx

@@ -275,12 +275,12 @@ class EditPaymentPane extends React.Component<EditPaymentPaneProps & InjectedInt
           {readableKind(this.props.data.kind)}
 
           {
-            this.props.data.offsite_payment && this.props.data.offsite_payment ?
+            this.props.data.offsite_payment && this.props.data.offsite_payment && this.props.data.offsite_payment.kind ?
 
               <span>
 
                 &nbsp; ({this.props.data.offsite_payment.kind})
-              </span> : false
+              </span> : undefined
 
           }
         </td>
@@ -481,7 +481,8 @@ class EditPaymentPane extends React.Component<EditPaymentPaneProps & InjectedInt
 
   render() {
 
-
+    //force it to check the form values so this updates
+    this.form.values()
 
     const modal =
       <Modal modalActive={this.props.modalActive} titleText={'Edit Donation'} focusDialog={true}

types/mobx-react-form/index.d.ts

@@ -1,3 +1,5 @@
+import { values } from "mobx";
+
 // License: LGPL-3.0-or-later
 
 interface ValidationInput {
@@ -315,6 +317,7 @@ export class Form implements Base {
     readonly isValid :boolean;
     readonly size:number
 
+    values(): {[fields:string] : ValuesResponse|string}
     
 }