Merge pull request #901 from Ignitus/develop

Master > Develop
Ignitus · Jul 19, 2020 · 4d58c91 · 4d58c91
2 parents 46250ee + 1f91118
commit 4d58c91
Show file tree

Hide file tree

Showing 13 changed files with 118 additions and 51 deletions.
diff --git a/src/ignitus-Api/index.js b/src/ignitus-Api/index.js
@@ -25,14 +25,21 @@ export async function getTestimonialData() {
   }
 }
 
-export function signUp(email, password, userType) {
-  return axios.post(t.STUDENT_SIGN_UP, { email, password, userType });
+export function signUp(userName, email, password, userType) {
+  return axios.post(t.STUDENT_SIGN_UP, { userName, email, password, userType });
 }
 
-export function signIn(email, password, userType) {
-  return axios.post(t.STUDENT_SIGN_IN, { email, password, userType });
+export function signIn(usernameORemail, password, userType) {
+  let email = null;
+  let userName = null;
+  const emailRegex = /^([A-Za-z0-9_\-.])+@([A-Za-z0-9_\-.])+\.([A-Za-z]{2,4})$/;
+  if (emailRegex.test(usernameORemail)) {
+    email = usernameORemail;
+  } else {
+    userName = usernameORemail;
+  }
+  return axios.post(t.STUDENT_SIGN_IN, { email, userName, password, userType });
 }
-
 async function getHeaders(name) {
   const item = await DBHelper.getItemFromDB(t.COND_HEADERS_STORE, name);
 

diff --git a/src/ignitus-Authentication/ignitus-CommonSignupInterface/actions.ts b/src/ignitus-Authentication/ignitus-CommonSignupInterface/actions.ts
@@ -2,10 +2,14 @@ import { isString, isObject } from '../../ignitus-Shared';
 import * as t from './actionTypes';
 
 export const signUpRequest = (
+  userName: string,
   email: string,
   password: string,
   userType: 'student' | 'professor',
 ) => {
+  if (!isString(userName)) {
+    throw new Error(`Username must be string: ${userName}`);
+  }
   if (!isString(email)) {
     throw new Error(`email must be string: ${email}`);
   }
@@ -15,6 +19,7 @@ export const signUpRequest = (
 
   return {
     type: t.SIGN_UP_REQUEST,
+    userName,
     email,
     password,
     userType,

diff --git a/src/ignitus-Authentication/ignitus-CommonSignupInterface/sagas.ts b/src/ignitus-Authentication/ignitus-CommonSignupInterface/sagas.ts
@@ -6,10 +6,16 @@ import * as api from '../../ignitus-Api';
 const { call, put, takeLatest, all } = effects;
 
 function* signUp(action) {
-  const { email, password, userType } = action;
+  const { userName, email, password, userType } = action;
 
   try {
-    const { data } = yield call(api.signUp, email, password, userType);
+    const { data } = yield call(
+      api.signUp,
+      userName,
+      email,
+      password,
+      userType,
+    );
     yield put(a.signUpResponse(data));
   } catch (e) {
     yield put(a.signUpResponse(e.response.data));

diff --git a/src/ignitus-Authentication/ignitus-ProfessorLogin/Components/index.tsx b/src/ignitus-Authentication/ignitus-ProfessorLogin/Components/index.tsx
@@ -35,7 +35,7 @@ export const Login: React.FC<LogInProps> = withErrorBoundary(
         });
         return;
       }
-
+      /*
       if (typeof email !== 'undefined') {
         const lastAtPos = email.lastIndexOf('@');
         const lastDotPos = email.lastIndexOf('.');
@@ -56,7 +56,7 @@ export const Login: React.FC<LogInProps> = withErrorBoundary(
           });
           return;
         }
-      }
+      } */
       logInRequest(email, password, 'professor');
       setState(LoginStatePayload);
     };

diff --git a/src/ignitus-Authentication/ignitus-ProfessorSignUp/Components/index.tsx b/src/ignitus-Authentication/ignitus-ProfessorSignUp/Components/index.tsx
@@ -12,15 +12,20 @@ export const SignUp: React.FC<Props> = withErrorBoundary(
   ({ signUpData, signUpRequest, clearPreviousSignUp }) => {
     const [state, setState] = useState(SignupStatePayload);
 
-    const { email, password, confirmPassword } = state;
+    const { userName, email, password, confirmPassword } = state;
 
     useEffect(() => () => clearPreviousSignUp(), [clearPreviousSignUp]);
 
     const handleSubmit = e => {
       e.preventDefault();
       clearPreviousSignUp();
 
-      if (isEmpty(email) || isEmpty(password) || isEmpty(confirmPassword)) {
+      if (
+        isEmpty(userName) ||
+        isEmpty(email) ||
+        isEmpty(password) ||
+        isEmpty(confirmPassword)
+      ) {
         setState({
           ...state,
           emptyMessage: true,
@@ -63,7 +68,7 @@ export const SignUp: React.FC<Props> = withErrorBoundary(
         return;
       }
 
-      signUpRequest(email, password, 'professor');
+      signUpRequest(userName, email, password, 'professor');
       setState(SignupStatePayload);
     };
 

diff --git a/src/ignitus-Authentication/ignitus-StudentLogin/Components/index.tsx b/src/ignitus-Authentication/ignitus-StudentLogin/Components/index.tsx
@@ -27,28 +27,29 @@ export const Login: FunctionComponent<LogInProps> = withErrorBoundary(
         });
         return;
       }
+      /*
+        if (typeof email !== 'undefined') {
+          const lastAtPos = email.lastIndexOf('@');
+          const lastDotPos = email.lastIndexOf('.');
 
-      if (typeof email !== 'undefined') {
-        const lastAtPos = email.lastIndexOf('@');
-        const lastDotPos = email.lastIndexOf('.');
-
-        if (
-          !(
-            lastAtPos < lastDotPos &&
-            lastAtPos > 0 &&
-            email.indexOf('@@') === -1 &&
-            lastDotPos > 2 &&
-            email.length - lastDotPos > 2
-          )
-        ) {
-          setState({
-            ...state,
-            invalidEmail: true,
-            emptyMessage: false,
-          });
-          return;
+          if (
+            !(
+              lastAtPos < lastDotPos &&
+              lastAtPos > 0 &&
+              email.indexOf('@@') === -1 &&
+              lastDotPos > 2 &&
+              email.length - lastDotPos > 2
+            )
+          ) {
+            setState({
+              ...state,
+              invalidEmail: true,
+              emptyMessage: false,
+            });
+            return;
+          }
         }
-      }
+      */
       logInRequest(email, password, 'student');
       setState(LoginStatePayload);
     };

diff --git a/src/ignitus-Authentication/ignitus-StudentLogin/types.ts b/src/ignitus-Authentication/ignitus-StudentLogin/types.ts
@@ -1,7 +1,8 @@
 import { AuthData } from '../../ignitus-Shared';
 
 export interface LogInProps {
-  logInRequest: Function;
+  logInRequestUsingEmail: Function;
+  logInRequestUsingUsername: Function;
   logInData: AuthData;
   clearPreviousLogin: Function;
 }
diff --git a/...nitus-Authentication/ignitus-StudentSignUpFlow/ignitus-StudentSignUp/Components/index.tsx b/...nitus-Authentication/ignitus-StudentSignUpFlow/ignitus-StudentSignUp/Components/index.tsx
@@ -11,15 +11,20 @@ import { Props } from '../types';
 export const Signup: FunctionComponent<Props> = withErrorBoundary(
   ({ signUpRequest, signUpData, clearPreviousSignUp }) => {
     const [state, setState] = useState(SignupStatePayload);
-    const { email, password, confirmPassword } = state;
+    const { userName, email, password, confirmPassword } = state;
 
     useEffect(() => () => clearPreviousSignUp(), [clearPreviousSignUp]);
 
     const handleSubmit = e => {
       e.preventDefault();
       clearPreviousSignUp();
 
-      if (isEmpty(email) || isEmpty(password) || isEmpty(confirmPassword)) {
+      if (
+        isEmpty(userName) ||
+        isEmpty(email) ||
+        isEmpty(password) ||
+        isEmpty(confirmPassword)
+      ) {
         setState({
           ...state,
           emptyMessage: true,
@@ -62,7 +67,7 @@ export const Signup: FunctionComponent<Props> = withErrorBoundary(
         return;
       }
 
-      signUpRequest(email, password, 'student');
+      signUpRequest(userName, email, password, 'student');
       setState(SignupStatePayload);
     };
 

diff --git a/src/ignitus-Dashboard/ignitus-DashboardHeader/Components/index.tsx b/src/ignitus-Dashboard/ignitus-DashboardHeader/Components/index.tsx
@@ -28,11 +28,11 @@ export const DashBoardNavigation: React.FC = withErrorBoundary(
     };
 
     const userInformation: string | null = localStorage.getItem('data');
-    let userEmail: string = '';
+    let userName: string = '';
     let userType: string = '';
 
     if (localStorage.getItem('data') && typeof userInformation === 'string') {
-      userEmail = JSON.parse(userInformation).email;
+      userName = JSON.parse(userInformation).userName;
       userType = JSON.parse(userInformation).userType;
     }
 
@@ -57,7 +57,7 @@ export const DashBoardNavigation: React.FC = withErrorBoundary(
           </N.NavigationLinkItem>
 
           <N.NavigationLinkItem>
-            <N.NavigationLink to="#">{userEmail}</N.NavigationLink>
+            <N.NavigationLink to="#">{userName}</N.NavigationLink>
           </N.NavigationLinkItem>
 
           <N.NavigationLinkItem onClick={onClickLogout}>

diff --git a/...us-Templates/ignitus-Authentication/Components/SplittedComponents/FormComponent/index.tsx b/...us-Templates/ignitus-Authentication/Components/SplittedComponents/FormComponent/index.tsx
@@ -61,18 +61,49 @@ export const Form: FunctionComponent<FormProps> = ({
 
       <A.LeftColumnTwo>
         <A.InputGroup>
-          <A.EmailInput
-            name={AppIcon.MessageIcon}
-            type="string"
-            state={state.email}
-            placeholder="Email"
-            handleChange={email => {
-              setState({
-                ...state,
-                email,
-              });
-            }}
-          />
+          {authenticationType === 'SignUp' && (
+            <>
+              <A.UsernameInput
+                name={AppIcon.AccountCircleIcon}
+                type="string"
+                state={state.userName}
+                placeholder="Username"
+                handleChange={userName => {
+                  setState({
+                    ...state,
+                    userName,
+                  });
+                }}
+              />
+              <A.EmailInput
+                name={AppIcon.MessageIcon}
+                type="string"
+                state={state.email}
+                placeholder="Email"
+                handleChange={email => {
+                  setState({
+                    ...state,
+                    email,
+                  });
+                }}
+              />
+            </>
+          )}
+
+          {authenticationType !== 'SignUp' && (
+            <A.EmailUsernameInput
+              name={AppIcon.AccountCircleIcon}
+              type="string"
+              state={state.email}
+              placeholder="Username or Email"
+              handleChange={email => {
+                setState({
+                  ...state,
+                  email,
+                });
+              }}
+            />
+          )}
 
           <A.PasswordInput
             placeholder="Password"

diff --git a/...itus-Shared/ignitus-DesignSystem/ignitus-Templates/ignitus-Authentication/statePayLoad.ts b/...itus-Shared/ignitus-DesignSystem/ignitus-Templates/ignitus-Authentication/statePayLoad.ts
@@ -10,6 +10,7 @@ export const LoginStatePayload: LoginState = {
 
 export const SignupStatePayload: SignupState = {
   ...LoginStatePayload,
+  userName: '',
   confirmPassword: '',
   equalmessage: false,
 };
diff --git a/src/ignitus-Shared/ignitus-DesignSystem/ignitus-Templates/ignitus-Authentication/styles.ts b/src/ignitus-Shared/ignitus-DesignSystem/ignitus-Templates/ignitus-Authentication/styles.ts
@@ -139,6 +139,10 @@ export const EmailInput = styled(DefaultIconInput)`
   }
 `;
 
+export const UsernameInput = styled(EmailInput)``;
+
+export const EmailUsernameInput = styled(EmailInput)``;
+
 export const ConfirmPasswordInput = styled(EmailInput)``;
 
 export const PasswordInput = styled(DefaultPasswordInput)`

diff --git a/src/ignitus-Shared/ignitus-DesignSystem/ignitus-Templates/ignitus-Authentication/types.ts b/src/ignitus-Shared/ignitus-DesignSystem/ignitus-Templates/ignitus-Authentication/types.ts
@@ -35,6 +35,7 @@ export interface FormProps {
 }
 
 export interface SignupState extends LoginState {
+  userName: string;
   confirmPassword: string;
   equalmessage: boolean;
 }