From ceba84ede960ff42eb6ffd5d2f4bde87a66bd8fa Mon Sep 17 00:00:00 2001
From: Erik Pearson <eapearson@lbl.gov>
Date: Thu, 20 Jul 2023 15:17:23 -0700
Subject: [PATCH 1/2] ui tweaks while investigating [UFI-60]

---
 .../modules/reactComponents/SignUpForm.js     | 33 ++++++++++++-------
 .../modules/reactComponents/UseAgreements.js  |  2 +-
 2 files changed, 22 insertions(+), 13 deletions(-)

diff --git a/src/plugin/iframe_root/modules/reactComponents/SignUpForm.js b/src/plugin/iframe_root/modules/reactComponents/SignUpForm.js
index c76e00e..1fd1686 100644
--- a/src/plugin/iframe_root/modules/reactComponents/SignUpForm.js
+++ b/src/plugin/iframe_root/modules/reactComponents/SignUpForm.js
@@ -4,6 +4,7 @@ define([
     './TypeaheadInput',
     './UseAgreements',
     'reactComponents/Well',
+    'reactComponents/Alert',
     'kb_common_ts/Auth2',
     'json!data/referralSources.json',
 
@@ -15,6 +16,7 @@ define([
     TypeaheadInput,
     UseAgreements,
     Well,
+    Alert,
     auth2,
     referralSources
 ) => {
@@ -115,6 +117,10 @@ define([
             );
         }
 
+        canSubmitForm() {
+            return this.formIsValid() && this.state.policiesResolved;
+        }
+
         async loadOrganizations() {
             const fetchJSON = async (name) => {
                 const path = `${this.props.runtime.pluginResourcePath}/dataSources/`;
@@ -308,7 +314,7 @@ define([
                         },
                         {
                             validate: async (value) => {
-                                if (/^[0-9]+/.test(value)) {
+                                if (/^\d+/.test(value)) {
                                     return {
                                         isValid: false,
                                         message: 'A username may not begin with a number'
@@ -947,8 +953,19 @@ define([
             this.props.onCancelSignUp();
         }
 
+        renderFormMessage() {
+            if (!this.canSubmitForm()) {
+                return html`
+                    <div className="alert alert-warning" style=${{marginBottom: '1rem'}}><b>Reminder -</b> All fields must be completed in order to create a KBase account</>
+                `;
+            }
+            return html`
+                <div className="alert alert-success" style=${{marginBottom: '1rem'}}><b>Ready -</b> All fields are complete, you may now create your account</>
+            `;
+        }
+
         renderFormButtons() {
-            const disabled = !(this.formIsValid() && this.state.policiesResolved);
+            const disabled = !(this.canSubmitForm());
             return html`
                 <div className="btn-toolbar" style=${{display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'center'}}>
                     <button className="btn btn-primary" 
@@ -1029,7 +1046,7 @@ define([
                                 <p>
                                 Some field values have been pre-populated from your 
                                 <span style=${{padding: '0 0.25em', fontWeight: 'bold'}}>${this.props.choice.provider}</span>
-                                account
+                                account. <b>All fields are required.</b>
                                 </p>
                             </div>
                         </div>
@@ -1048,6 +1065,7 @@ define([
                             <hr />
                             <${UseAgreements} policiesToResolve=${this.props.policiesToResolve} onAgreed=${this.onAgreed.bind(this)}/>
                             <hr />
+                            ${this.renderFormMessage()}
                             ${this.renderFormButtons()}
                         </form>
                     </div>
@@ -1064,15 +1082,6 @@ define([
                     ${this.renderSignupForm()}
                 </>
             `;
-
-            // return html`
-            //     <${Panel}
-            //         type="default"
-            //         classes=${['kb-panel-light']}
-            //         title="Sign up for KBase">
-            //         ${this.renderSignupForm()}
-            //     </>
-            // `;
         }
 
         render() {
diff --git a/src/plugin/iframe_root/modules/reactComponents/UseAgreements.js b/src/plugin/iframe_root/modules/reactComponents/UseAgreements.js
index 807bd4d..fc7cd0b 100644
--- a/src/plugin/iframe_root/modules/reactComponents/UseAgreements.js
+++ b/src/plugin/iframe_root/modules/reactComponents/UseAgreements.js
@@ -239,7 +239,7 @@ define([
             });
 
             const phrase = (() => {
-                if (this.props.policiesToResolve.length === 1) {
+                if (this.props.policiesToResolve.length >= 1) {
                     switch (this.props.policiesToResolve[0].status) {
                     case 'new':
                         return 'not yet been agreed to by this account';

From b5761554ec4e9b2a4a57aba370e4501b28761cbd Mon Sep 17 00:00:00 2001
From: Erik Pearson <eapearson@lbl.gov>
Date: Thu, 20 Jul 2023 15:18:37 -0700
Subject: [PATCH 2/2] remove unused import [UFI-60]

---
 src/plugin/iframe_root/modules/reactComponents/SignUpForm.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/plugin/iframe_root/modules/reactComponents/SignUpForm.js b/src/plugin/iframe_root/modules/reactComponents/SignUpForm.js
index 1fd1686..aa22321 100644
--- a/src/plugin/iframe_root/modules/reactComponents/SignUpForm.js
+++ b/src/plugin/iframe_root/modules/reactComponents/SignUpForm.js
@@ -4,7 +4,6 @@ define([
     './TypeaheadInput',
     './UseAgreements',
     'reactComponents/Well',
-    'reactComponents/Alert',
     'kb_common_ts/Auth2',
     'json!data/referralSources.json',
 
@@ -16,7 +15,6 @@ define([
     TypeaheadInput,
     UseAgreements,
     Well,
-    Alert,
     auth2,
     referralSources
 ) => {