Adding 3rd Party Account - revised (#2)

js-frontend/src/controls/bootstrap/Input.js

@@ -25,7 +25,7 @@ class AuthInput extends React.Component {
 
     if (this.props.errors.length) {
       return (
-        <div className='auth-error-message has-error'>
+        <div className="auth-error-message has-error">
           {this.props.errors.map((err, i) => {
             return (
               <p className="control-label inline-error-item"

js-frontend/src/views/Account.js

@@ -91,7 +91,6 @@ export class Account extends React.Component {
 
     const  account = entities[accountId];
 
-
     if (loading) {
       return (<h2><Spinner ref="spinner" loaded={false} /> Loading..</h2>);
     }

js-frontend/src/views/MyAccounts.js

@@ -259,64 +259,6 @@ class MyAccounts extends React.Component {
     );
   }
 }
-/*
- <IndexPanel header="Other  User"><label>current user provider</label>
- <p>{this.props.currentUserUid}</p>
-
- <label>current user uid</label>
- <p>{this.props.currentUserProvider}</p>
-
- <IndexLink to="/">Home</IndexLink><br/>
- <Link to="/signin">Login</Link><br/>
- <Link to="/register">Register</Link><br/>
- <Link to="/account">Account</Link><br/>
-
- <label>currently selected theme</label>
- <Select
- value={this.props.theme}
- clearable={false}
- options={[
- {value: "default", label: "Default"},
- {value: "bootstrap", label: "Bootstrap"},
- {value: "materialUi", label: "Material UI"}
- ]}
- onChange={this.updateTheme.bind(this)} />
-
- <label>currently selected endpoint</label>
- <Select
- value={this.props.pageEndpoint}
- clearable={false}
- options={[
- {value: "default", label: "Default User Class"},
- {value: "evilUser", label: "Alternate User Class"}
- ]}
- onChange={this.updateEndpoint.bind(this)} />
-
- <Table>
- <thead>
- <tr>
- <th colSpan={2}>
- ajax test
- </th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td>Default user:</td>
- <td></td>
- </tr>
- <tr>
- <td>Alternate user class:</td>
- <td></td>
- </tr>
- <tr>
- <td>Group that includes both user classes:</td>
- <td></td>
- </tr>
- </tbody>
- </Table>
- </IndexPanel>
-*/
 
 export default connect(({ app }) => {
   return ({

js-frontend/src/views/modals/Add3rdPartyAccountModal.js

@@ -34,7 +34,7 @@ const formValidation = (payload) => ['owner', 'account', 'title', 'description']
         result.push('need to less than 400 symbols long');
       }
   }
-  
+
   if (result.length) {
     memo[prop] = result;
     memo.hasErrors = true;
@@ -75,6 +75,13 @@ export class Add3rdPartyAccountModal extends React.Component {
     }
   }
 
+  onHide() {
+    this.props.dispatch(A.accountRefCreateComplete({}));
+    if (this.props.onHide) {
+      this.props.onHide();
+    }
+  }
+
   getOwnersOptions(input) {
     if (!input) {
       return Promise.resolve({ options: [] });
@@ -87,13 +94,24 @@ export class Add3rdPartyAccountModal extends React.Component {
 
     const ownersLoading = read(this.props.data, 'ownersLookup.loading', false);
 
+    const formErrors = read(this.props.data, 'errors.errors', '');
+
     return (
-      <BS.Modal show={this.props.show} onHide={this.props.onHide} key={1}>
+      <BS.Modal show={this.props.show} onHide={this.onHide.bind(this)} key={1}>
         <BS.Modal.Header closeButton>
           <BS.Modal.Title>Add 3rd Party Account</BS.Modal.Title>
         </BS.Modal.Header>
         <BS.Modal.Body>
           <form>
+            <div className="form-group" style={{
+            display: formErrors ? 'block' : 'none'
+            }}>
+              <AuxErrorLabel
+                label="Form:"
+                errors={formErrors.length ? [formErrors] : [] }
+              />
+            </div>
+
             <label>Owner:</label>
             <div className="form-group">
               <Select
@@ -149,7 +167,7 @@ export class Add3rdPartyAccountModal extends React.Component {
           </form>
         </BS.Modal.Body>
         <BS.Modal.Footer>
-          <BS.Button onClick={this.props.onHide}>Cancel</BS.Button>
+          <BS.Button onClick={this.onHide.bind(this)}>Cancel</BS.Button>
           <ButtonLoader loading={read(this.props.data, 'loading', false)}
                         type="submit"
                         bsStyle="primary"