aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/components/common/TaggTypeahead.tsx19
-rw-r--r--src/constants/api.ts1
-rw-r--r--src/screens/onboarding/BasicInfoOnboarding.tsx153
-rw-r--r--src/services/UserProfileService.ts27
4 files changed, 141 insertions, 59 deletions
diff --git a/src/components/common/TaggTypeahead.tsx b/src/components/common/TaggTypeahead.tsx
index 7cd99278..747e0bb5 100644
--- a/src/components/common/TaggTypeahead.tsx
+++ b/src/components/common/TaggTypeahead.tsx
@@ -1,26 +1,32 @@
import React, {Fragment, useEffect, useState} from 'react';
import {ScrollView, StyleSheet} from 'react-native';
import {MentionSuggestionsProps} from 'react-native-controlled-mentions';
+import {useSelector} from 'react-redux';
import {SEARCH_ENDPOINT_MESSAGES} from '../../constants';
import {loadSearchResults} from '../../services';
+import {RootState} from '../../store/rootReducer';
import {ProfilePreviewType} from '../../types';
-import {SCREEN_WIDTH} from '../../utils';
+import {SCREEN_WIDTH, shuffle} from '../../utils';
import TaggUserRowCell from './TaggUserRowCell';
const TaggTypeahead: React.FC<MentionSuggestionsProps> = ({
keyword,
onSuggestionPress,
}) => {
+ const {friends} = useSelector((state: RootState) => state.friends);
const [results, setResults] = useState<ProfilePreviewType[]>([]);
const [height, setHeight] = useState(0);
useEffect(() => {
- getQuerySuggested();
+ if (keyword === '') {
+ setResults(shuffle(friends));
+ } else {
+ getQuerySuggested();
+ }
}, [keyword]);
const getQuerySuggested = async () => {
- if (!keyword || keyword.length < 3) {
- setResults([]);
+ if (keyword === undefined || keyword === '@') {
return;
}
const searchResults = await loadSearchResults(
@@ -41,15 +47,16 @@ const TaggTypeahead: React.FC<MentionSuggestionsProps> = ({
showsVerticalScrollIndicator={false}
onLayout={(event) => {
setHeight(event.nativeEvent.layout.height);
- }}>
+ }}
+ keyboardShouldPersistTaps={'always'}>
{results.map((user) => (
<TaggUserRowCell
onPress={() => {
+ setResults([]);
onSuggestionPress({
id: user.id,
name: user.username,
});
- setResults([]);
}}
user={user}
/>
diff --git a/src/constants/api.ts b/src/constants/api.ts
index d45616a1..e5ce9e77 100644
--- a/src/constants/api.ts
+++ b/src/constants/api.ts
@@ -12,6 +12,7 @@ const API_URL: string = BASE_URL + 'api/';
export const LOGIN_ENDPOINT: string = API_URL + 'login/';
export const VERSION_ENDPOINT: string = API_URL + 'version/v2/';
export const REGISTER_ENDPOINT: string = API_URL + 'register/';
+export const REGISTER_VALIDATE_ENDPOINT: string = API_URL + 'register/validate/';
export const EDIT_PROFILE_ENDPOINT: string = API_URL + 'edit-profile/';
export const SEND_OTP_ENDPOINT: string = API_URL + 'send-otp/';
export const VERIFY_OTP_ENDPOINT: string = API_URL + 'verify-otp/';
diff --git a/src/screens/onboarding/BasicInfoOnboarding.tsx b/src/screens/onboarding/BasicInfoOnboarding.tsx
index 3fa33f63..3058a04e 100644
--- a/src/screens/onboarding/BasicInfoOnboarding.tsx
+++ b/src/screens/onboarding/BasicInfoOnboarding.tsx
@@ -38,7 +38,11 @@ import {
ERROR_T_AND_C_NOT_ACCEPTED,
} from '../../constants/strings';
import {OnboardingStackParams} from '../../routes';
-import {sendOtpStatusCode, sendRegister} from '../../services';
+import {
+ sendOtpStatusCode,
+ sendRegister,
+ verifyExistingInformation,
+} from '../../services';
import {BackgroundGradientType} from '../../types';
import {HeaderHeight, SCREEN_HEIGHT, SCREEN_WIDTH} from '../../utils';
@@ -63,12 +67,20 @@ const BasicInfoOnboarding: React.FC<BasicInfoOnboardingProps> = ({route}) => {
const [currentStep, setCurrentStep] = useState(0);
const [tcAccepted, setTCAccepted] = useState(false);
const [passVisibility, setPassVisibility] = useState(false);
+ const [invalidWithError, setInvalidWithError] = useState(
+ 'Please enter a valid ',
+ );
const [autoCapitalize, setAutoCap] = useState<
'none' | 'sentences' | 'words' | 'characters' | undefined
>('none');
const [fadeValue, setFadeValue] = useState<Animated.Value<number>>(
new Animated.Value(0),
);
+
+ useEffect(() => {
+ setValid(false);
+ }, [invalidWithError]);
+
const fadeButtonValue = useValue<number>(0);
const [form, setForm] = useState({
fname: '',
@@ -209,30 +221,37 @@ const BasicInfoOnboarding: React.FC<BasicInfoOnboardingProps> = ({route}) => {
const formSteps: {
placeholder: string;
onChangeText: (text: string) => void;
+ value: string;
}[] = [
{
placeholder: 'First Name',
onChangeText: (text) => handleNameUpdate(text, 0),
+ value: form.fname,
},
{
placeholder: 'Last Name',
onChangeText: (text) => handleNameUpdate(text, 1),
+ value: form.lname,
},
{
placeholder: 'Phone',
onChangeText: handlePhoneUpdate,
+ value: form.phone,
},
{
placeholder: 'School Email',
onChangeText: handleEmailUpdate,
+ value: form.email,
},
{
placeholder: 'Username',
onChangeText: (text) => handleNameUpdate(text, 2),
+ value: form.username,
},
{
placeholder: 'Password',
onChangeText: handlePasswordUpdate,
+ value: form.password,
},
];
const resetForm = (formStep: String) => {
@@ -277,9 +296,33 @@ const BasicInfoOnboarding: React.FC<BasicInfoOnboardingProps> = ({route}) => {
}
};
const step = formSteps[currentStep];
- const advance = () => {
+ useEffect(() => {
+ setInvalidWithError(
+ 'Please enter a valid ' + step.placeholder.toLowerCase(),
+ );
+ }, [currentStep]);
+ const advance = async () => {
setAttemptedSubmit(true);
if (valid) {
+ if (step.placeholder === 'School Email') {
+ const verifiedInfo = await verifyExistingInformation(
+ form.email,
+ undefined,
+ );
+ if (!verifiedInfo) {
+ setInvalidWithError('Email is taken');
+ return;
+ }
+ } else if (step.placeholder === 'Username') {
+ const verifiedInfo = await verifyExistingInformation(
+ undefined,
+ form.username,
+ );
+ if (!verifiedInfo) {
+ setInvalidWithError('Username is taken');
+ return;
+ }
+ }
setCurrentStep(currentStep + 1);
setAttemptedSubmit(false);
setValid(false);
@@ -421,6 +464,7 @@ const BasicInfoOnboarding: React.FC<BasicInfoOnboardingProps> = ({route}) => {
returnKeyType="done"
selectionColor="white"
onChangeText={step.onChangeText}
+ value={step.value}
onSubmitEditing={advance}
autoFocus={true}
blurOnSubmit={false}
@@ -428,7 +472,7 @@ const BasicInfoOnboarding: React.FC<BasicInfoOnboardingProps> = ({route}) => {
warning: styles.passWarning,
}}
valid={valid}
- invalidWarning={`Please enter a valid ${step.placeholder.toLowerCase()}`}
+ invalidWarning={invalidWithError}
attemptedSubmit={attemptedSubmit}
/>
<Animated.View style={{opacity: fadeButtonValue}}>
@@ -443,58 +487,61 @@ const BasicInfoOnboarding: React.FC<BasicInfoOnboardingProps> = ({route}) => {
</Animated.View>
</>
) : (
- <Animated.View
- style={[styles.formContainer, {opacity: fadeValue}]}>
- <TaggInput
- accessibilityHint="Enter a password."
- accessibilityLabel="Password input field."
- placeholder="Password"
- autoCompleteType="password"
- textContentType="oneTimeCode"
- returnKeyType="done"
- selectionColor="white"
- onChangeText={handlePasswordUpdate}
- onSubmitEditing={advanceRegistration}
- blurOnSubmit={false}
- autoFocus={true}
- secureTextEntry={!passVisibility}
- valid={valid}
- externalStyles={{
- warning: styles.passWarning,
- }}
- invalidWarning={
- 'Password must be at least 8 characters & contain at least one of a-z, A-Z, 0-9, and a special character.'
- }
- attemptedSubmit={attemptedSubmit}
- style={
- attemptedSubmit && !valid
- ? [styles.input, styles.invalidColor]
- : styles.input
- }
- />
- <TouchableOpacity
- accessibilityLabel="Show password button"
- accessibilityHint="Select this if you want to display your tagg password"
- style={styles.showPassContainer}
- onPress={() => setPassVisibility(!passVisibility)}>
- <Text style={styles.showPass}>Show Password</Text>
- </TouchableOpacity>
- <LoadingIndicator />
- <TermsConditions
- style={styles.tc}
- accepted={tcAccepted}
- onChange={setTCAccepted}
- />
- <Animated.View style={{opacity: fadeButtonValue}}>
- <TaggSquareButton
- onPress={advanceRegistration}
- title={'Next'}
- buttonStyle={'normal'}
- buttonColor={'white'}
- labelColor={'blue'}
+ <>
+ <Text style={styles.formHeader}>SIGN UP</Text>
+ <Animated.View
+ style={[styles.formContainer, {opacity: fadeValue}]}>
+ <TaggInput
+ accessibilityHint="Enter a password."
+ accessibilityLabel="Password input field."
+ placeholder="Password"
+ autoCompleteType="password"
+ textContentType="oneTimeCode"
+ returnKeyType="done"
+ selectionColor="white"
+ onChangeText={handlePasswordUpdate}
+ onSubmitEditing={advanceRegistration}
+ blurOnSubmit={false}
+ autoFocus={true}
+ secureTextEntry={!passVisibility}
+ valid={valid}
+ externalStyles={{
+ warning: styles.passWarning,
+ }}
+ invalidWarning={
+ 'Password must be at least 8 characters & contain at least one of a-z, A-Z, 0-9, and a special character.'
+ }
+ attemptedSubmit={attemptedSubmit}
+ style={
+ attemptedSubmit && !valid
+ ? [styles.input, styles.invalidColor]
+ : styles.input
+ }
/>
+ <TouchableOpacity
+ accessibilityLabel="Show password button"
+ accessibilityHint="Select this if you want to display your tagg password"
+ style={styles.showPassContainer}
+ onPress={() => setPassVisibility(!passVisibility)}>
+ <Text style={styles.showPass}>Show Password</Text>
+ </TouchableOpacity>
+ <LoadingIndicator />
+ <TermsConditions
+ style={styles.tc}
+ accepted={tcAccepted}
+ onChange={setTCAccepted}
+ />
+ <Animated.View style={{opacity: fadeButtonValue}}>
+ <TaggSquareButton
+ onPress={advanceRegistration}
+ title={'Next'}
+ buttonStyle={'normal'}
+ buttonColor={'white'}
+ labelColor={'blue'}
+ />
+ </Animated.View>
</Animated.View>
- </Animated.View>
+ </>
)}
</>
)}
diff --git a/src/services/UserProfileService.ts b/src/services/UserProfileService.ts
index c11d874f..8b7b78e1 100644
--- a/src/services/UserProfileService.ts
+++ b/src/services/UserProfileService.ts
@@ -11,6 +11,7 @@ import {
PROFILE_INFO_ENDPOINT,
PROFILE_PHOTO_ENDPOINT,
REGISTER_ENDPOINT,
+ REGISTER_VALIDATE_ENDPOINT,
SEND_OTP_ENDPOINT,
TAGG_CUSTOMER_SUPPORT,
USER_PROFILE_ENDPOINT,
@@ -432,3 +433,29 @@ export const visitedUserProfile = async (userId: string) => {
return undefined;
}
};
+
+export const verifyExistingInformation = async (
+ email: string | undefined,
+ username: string | undefined,
+) => {
+ try {
+ const form = new FormData();
+ if (email) {
+ form.append('email', email);
+ }
+ if (username) {
+ form.append('username', username);
+ }
+ const response = await fetch(REGISTER_VALIDATE_ENDPOINT, {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'multipart/form-data',
+ },
+ body: form,
+ });
+ return response.status===200;
+ } catch (error) {
+ console.log(error);
+ return false;
+ }
+};
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 19:15:50 +0000