Fixed signup with email not working on free plan

closes https://github.com/TryGhost/members.js/issues/16

This fix sends magic link to member when they choose free plan to signup using name and email.

Note: We are not storing `name` atm in magic link, so it gets ignored in actual member data on signup atm.

ghost/portal/src/components/ParentContainer.js

@@ -138,6 +138,18 @@ export default class ParentContainer extends React.Component {
                 });
             }
 
+            if (action === 'signup') {
+                await this.MembersAPI.member.sendMagicLink(data);
+                this.setState({
+                    action: {
+                        name: action,
+                        isRunning: false,
+                        isSuccess: true
+                    },
+                    page: 'magiclink'
+                });
+            }
+
             if (action === 'checkoutPlan') {
                 const checkoutSuccessUrl = (new URL('/account/?stripe=billing-update-success', window.location.href)).href;
                 const checkoutCancelUrl = (new URL('/account/?stripe=billing-update-cancel', window.location.href)).href;

ghost/portal/src/components/pages/SignupPage.js

@@ -24,22 +24,12 @@ export default class SignupPage extends React.Component {
         };
     }
 
-    handleSignin(e) {
+    handleSignup(e) {
         e.preventDefault();
         const email = this.state.email;
         const name = this.state.name;
         const plan = this.state.plan;
         this.props.onAction('signup', {name, email, plan});
-        this.setState({
-            isLoading: true,
-            showSuccess: false
-        });
-        setTimeout(() => {
-            this.setState({
-                isLoading: false,
-                showSuccess: true
-            });
-        }, 3000);
     }
 
     handleInput(e, field) {
@@ -72,11 +62,15 @@ export default class SignupPage extends React.Component {
             width: '100%',
             marginBottom: '12px'
         };
+        const isRunning = this.props.action && this.props.action.name === 'signup' && this.props.action.isRunning;
         const label = this.state.isLoading ? 'Sending' : 'Continue';
-        const disabled = this.state.isLoading ? true : false;
+        const disabled = isRunning ? true : false;
+        if (disabled) {
+            buttonStyle.backgroundColor = 'grey';
+        }
         return (
             <button onClick={(e) => {
-                this.handleSignin(e);
+                this.handleSignup(e);
             }} style={buttonStyle} disabled={disabled}>
                 {label}
             </button>