aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/assets/icons/celebration-logo.svg1
-rw-r--r--src/components/onboarding/TaggBigInput.tsx3
-rw-r--r--src/components/onboarding/TaggInput.tsx3
-rw-r--r--src/components/onboarding/TermsAndConditionsText.tsx13
-rw-r--r--src/constants/api.ts1
-rw-r--r--src/constants/constants.ts2
-rw-r--r--src/routes/onboarding/OnboardingStackNavigator.tsx2
-rw-r--r--src/routes/onboarding/OnboardingStackScreen.tsx10
-rw-r--r--src/screens/onboarding/AddWaitlistUserScreen.tsx238
-rw-r--r--src/screens/onboarding/InvitationCodeVerification.tsx29
-rw-r--r--src/screens/onboarding/Login.tsx8
-rw-r--r--src/screens/onboarding/WaitlistSuccessScreen.tsx156
-rw-r--r--src/screens/onboarding/index.ts2
-rw-r--r--src/services/WaitlistUserService.tsx45
-rw-r--r--src/services/index.ts1
15 files changed, 506 insertions, 8 deletions
diff --git a/src/assets/icons/celebration-logo.svg b/src/assets/icons/celebration-logo.svg
new file mode 100644
index 00000000..5e4e89a0
--- /dev/null
+++ b/src/assets/icons/celebration-logo.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 792 792"><defs><style>.cls-1,.cls-2{fill:none;stroke:#fff;stroke-miterlimit:10;stroke-width:16px;}.cls-1{stroke-linecap:round;}</style></defs><path class="cls-1" d="M204.9,167.55,28.36,646.4S1.75,738.3,98.49,728.63l474-241.84s12.09-65.3-166.87-208c0,0-128.76-110.7-167.1-104.59s-.72,56.67-.72,56.67"/><path class="cls-1" d="M229.34,306.39S331,523.27,447.9,550.36"/><path class="cls-1" d="M253.14,60.8S384.68,150,315.57,321.65"/><line class="cls-1" x1="360.41" y1="346.18" x2="427.04" y2="228.01"/><line class="cls-1" x1="427.04" y1="339.49" x2="624.4" y2="216.5"/><path class="cls-1" d="M460.48,377.39s165-42.71,251.94,19.89"/><path class="cls-1" d="M509.83,448.45s181.48,37.33,143.76,85.09-68.67-73.61-23.17-88S809.22,484.4,768,513.07s-61.64-91.86-25.16-106.5"/><path class="cls-1" d="M102.2,292.31s61.68-84.89,0-93.63S2.53,214.54,42.88,161.89s57-50.28,11.87-55-9.49-64.09-9.49-64.09"/><rect class="cls-2" x="332.02" y="88.01" width="41.09" height="41.09" rx="7.51" transform="translate(204.55 -229.35) rotate(49.23)"/><rect class="cls-2" x="540.13" y="88.01" width="41.09" height="41.09" rx="7.51" transform="translate(276.77 -386.97) rotate(49.23)"/><rect class="cls-2" x="439.94" y="157.42" width="41.09" height="41.09" rx="7.51" transform="translate(518.03 -312.35) rotate(75.56)"/><rect class="cls-2" x="170.83" y="88.01" width="41.09" height="41.09" rx="7.51" transform="translate(148.62 -107.27) rotate(49.23)"/><rect class="cls-2" x="594.88" y="556.9" width="41.09" height="41.09" rx="7.51" transform="translate(250.85 -183.66) rotate(21.23)"/><rect class="cls-2" x="464.79" y="561.95" width="41.09" height="41.09" rx="7.51" transform="translate(686.08 -148.64) rotate(55.15)"/><rect class="cls-2" x="57.36" y="386.02" width="41.09" height="41.09" rx="7.51" transform="translate(275.76 42.94) rotate(39.4)"/><path class="cls-1" d="M128.59,421.33s31.27,145.46,170.25,203"/><path class="cls-1" d="M77.91,544.6s9.62,149.81,65.73,159.48"/></svg> \ No newline at end of file
diff --git a/src/components/onboarding/TaggBigInput.tsx b/src/components/onboarding/TaggBigInput.tsx
index ba965465..4e8e1ef7 100644
--- a/src/components/onboarding/TaggBigInput.tsx
+++ b/src/components/onboarding/TaggBigInput.tsx
@@ -1,6 +1,7 @@
import React from 'react';
import {View, TextInput, StyleSheet, TextInputProps} from 'react-native';
import * as Animatable from 'react-native-animatable';
+import {TAGG_LIGHT_PURPLE} from '../../constants';
interface TaggBigInputProps extends TextInputProps {
valid?: boolean;
@@ -55,7 +56,7 @@ const styles = StyleSheet.create({
warning: {
fontSize: 14,
marginTop: 5,
- color: '#f4ddff',
+ color: TAGG_LIGHT_PURPLE,
maxWidth: 350,
textAlign: 'center',
},
diff --git a/src/components/onboarding/TaggInput.tsx b/src/components/onboarding/TaggInput.tsx
index 12d99325..405564ab 100644
--- a/src/components/onboarding/TaggInput.tsx
+++ b/src/components/onboarding/TaggInput.tsx
@@ -1,6 +1,7 @@
import React from 'react';
import {View, TextInput, StyleSheet, TextInputProps} from 'react-native';
import * as Animatable from 'react-native-animatable';
+import {TAGG_LIGHT_PURPLE} from '../../constants';
interface TaggInputProps extends TextInputProps {
valid?: boolean;
@@ -52,7 +53,7 @@ const styles = StyleSheet.create({
warning: {
fontSize: 14,
marginTop: 5,
- color: '#f4ddff',
+ color: TAGG_LIGHT_PURPLE,
maxWidth: 350,
textAlign: 'center',
},
diff --git a/src/components/onboarding/TermsAndConditionsText.tsx b/src/components/onboarding/TermsAndConditionsText.tsx
index 39450667..2102d613 100644
--- a/src/components/onboarding/TermsAndConditionsText.tsx
+++ b/src/components/onboarding/TermsAndConditionsText.tsx
@@ -1,5 +1,6 @@
import * as React from 'react';
-import {StyleSheet, Text} from 'react-native';
+import {Linking, StyleSheet, Text} from 'react-native';
+import {TAGG_WEBSITE} from '../../constants';
const TermsAndConditionsText: React.FC = () => {
const textWithBulletPoint = (data: string, style: object) => {
@@ -550,8 +551,14 @@ const TermsAndConditionsText: React.FC = () => {
By email: <Text style={styles.link}>support@tagg.id</Text>
</Text>
<Text style={styles.paraLeftAlign}>
- By visiting this page on our website:{' '}
- <Text style={styles.link}>https://www.tagg.id/</Text>
+ By visiting this page on our{' '}
+ <Text
+ style={styles.link}
+ onPress={() => {
+ Linking.openURL(TAGG_WEBSITE + 'terms-and-conditions/');
+ }}>
+ website
+ </Text>
</Text>
</React.Fragment>
);
diff --git a/src/constants/api.ts b/src/constants/api.ts
index 3b2289fd..639bc8f8 100644
--- a/src/constants/api.ts
+++ b/src/constants/api.ts
@@ -27,6 +27,7 @@ export const BLOCK_USER_ENDPOINT: string = API_URL + 'block/';
export const PASSWORD_RESET_ENDPOINT: string = API_URL + 'password-reset/';
export const MOMENT_CATEGORY_ENDPOINT: string = API_URL + 'moment-category/';
export const NOTIFICATIONS_ENDPOINT: string = API_URL + 'notifications/';
+export const WAITLIST_USER_ENDPOINT: string = API_URL + 'waitlist-user/';
// Register as FCM device
export const FCM_ENDPOINT: string = API_URL + 'fcm/';
diff --git a/src/constants/constants.ts b/src/constants/constants.ts
index 8d8b7dfe..90d70724 100644
--- a/src/constants/constants.ts
+++ b/src/constants/constants.ts
@@ -60,6 +60,7 @@ export const YOUTUBE_FONT_COLOR: string = '#FCA4A4';
export const TAGG_DARK_BLUE = '#4E699C';
export const TAGG_TEXT_LIGHT_BLUE: string = '#698DD3';
+export const TAGG_LIGHT_PURPLE = '#F4DDFF';
export const TAGGS_GRADIENT = {
start: '#9F00FF',
@@ -141,6 +142,7 @@ export const CLASS_YEAR_LIST: Array<string> = [
'2026',
];
+export const TAGG_WEBSITE = 'https://www.tagg.id/';
export const MOMENT_CATEGORY_BG_COLORS: string[] = [
'#5E4AE4',
'#5044A6',
diff --git a/src/routes/onboarding/OnboardingStackNavigator.tsx b/src/routes/onboarding/OnboardingStackNavigator.tsx
index ea7ce8e8..9f614f7c 100644
--- a/src/routes/onboarding/OnboardingStackNavigator.tsx
+++ b/src/routes/onboarding/OnboardingStackNavigator.tsx
@@ -39,6 +39,8 @@ export type OnboardingStackParams = {
TaggPopup: {
popupProps: TaggPopupType;
};
+ AddWaitlistUser: undefined;
+ WaitlistSuccess: undefined;
};
export const OnboardingStack = createStackNavigator<OnboardingStackParams>();
diff --git a/src/routes/onboarding/OnboardingStackScreen.tsx b/src/routes/onboarding/OnboardingStackScreen.tsx
index 54614b32..afc5be99 100644
--- a/src/routes/onboarding/OnboardingStackScreen.tsx
+++ b/src/routes/onboarding/OnboardingStackScreen.tsx
@@ -14,6 +14,8 @@ import {
PasswordReset,
WelcomeScreen,
CategorySelection,
+ AddWaitlistUserScreen,
+ WaitlistSuccessScreen,
} from '../../screens';
import {StackCardInterpolationProps} from '@react-navigation/stack';
import TaggPopup from '../../components/common/TaggPopup';
@@ -97,6 +99,14 @@ const Onboarding: React.FC = () => {
component={InvitationCodeVerification}
/>
<OnboardingStack.Screen
+ name="AddWaitlistUser"
+ component={AddWaitlistUserScreen}
+ />
+ <OnboardingStack.Screen
+ name="WaitlistSuccess"
+ component={WaitlistSuccessScreen}
+ />
+ <OnboardingStack.Screen
name="RegistrationOne"
component={RegistrationOne}
/>
diff --git a/src/screens/onboarding/AddWaitlistUserScreen.tsx b/src/screens/onboarding/AddWaitlistUserScreen.tsx
new file mode 100644
index 00000000..1c13ffb5
--- /dev/null
+++ b/src/screens/onboarding/AddWaitlistUserScreen.tsx
@@ -0,0 +1,238 @@
+import {StackNavigationProp} from '@react-navigation/stack';
+import * as React from 'react';
+import {
+ KeyboardAvoidingView,
+ Platform,
+ StatusBar,
+ StyleSheet,
+ Text,
+ TouchableOpacity,
+ View,
+} from 'react-native';
+import {
+ ArrowButton,
+ Background,
+ LoadingIndicator,
+ SubmitButton,
+ TaggInput,
+} from '../../components';
+import {nameRegex, phoneRegex} from '../../constants';
+import {OnboardingStackParams} from '../../routes';
+import {adduserToWaitlist} from '../../services';
+import {BackgroundGradientType} from '../../types';
+import {SCREEN_HEIGHT} from '../../utils';
+
+type AddWaitlistUserScreenProp = StackNavigationProp<
+ OnboardingStackParams,
+ 'AddWaitlistUser'
+>;
+
+interface AddWaitlistUserScreenProps {
+ navigation: AddWaitlistUserScreenProp;
+}
+
+const AddWaitlistUserScreen: React.FC<AddWaitlistUserScreenProps> = ({
+ navigation,
+}) => {
+ const phoneRef = React.useRef();
+ const lnameRef = React.useRef();
+
+ const [form, setForm] = React.useState({
+ phone_number: {value: '', isValid: false},
+ first_name: {value: '', isValid: false},
+ last_name: {value: '', isValid: false},
+ attemptedSubmit: false,
+ });
+
+ //Handlers
+ const handleFocusChange = (field: string): void => {
+ switch (field) {
+ case 'last_name':
+ const lnameField: any = lnameRef.current;
+ lnameField.focus();
+ break;
+ case 'phone_number':
+ const phoneField: any = phoneRef.current;
+ phoneField.focus();
+ break;
+ default:
+ return;
+ }
+ };
+
+ const validate = (value: string, type: string) => {
+ let isValid: boolean = false;
+ switch (type) {
+ case 'phone_number':
+ isValid = phoneRegex.test(value);
+ break;
+ default:
+ isValid = nameRegex.test(value);
+ break;
+ }
+ return isValid;
+ };
+
+ const handleUpdate = (value: string, type: string) => {
+ value = value.trim();
+ const isValid = validate(value, type);
+ setForm({
+ ...form,
+ [type]: {value, isValid},
+ });
+ };
+
+ const handleAddUser = async () => {
+ if (!form.attemptedSubmit) {
+ setForm({
+ ...form,
+ attemptedSubmit: true,
+ });
+ }
+ try {
+ const {phone_number, first_name, last_name} = form;
+ if (phone_number.isValid && first_name.isValid && last_name.isValid) {
+ const success = await adduserToWaitlist(
+ phone_number.value,
+ first_name.value,
+ last_name.value,
+ );
+ if (success) {
+ navigation.navigate('WaitlistSuccess');
+ }
+ } else {
+ setForm({...form, attemptedSubmit: false});
+ setTimeout(() => setForm({...form, attemptedSubmit: true}));
+ }
+ } catch (err) {
+ console.log(err);
+ }
+ };
+
+ //Components
+ const Footer = () => (
+ <View style={styles.footer}>
+ <ArrowButton
+ direction="backward"
+ onPress={() => navigation.navigate('InvitationCodeVerification')}
+ />
+ </View>
+ );
+
+ const {phone_number, first_name, last_name} = form;
+
+ return (
+ <Background
+ style={styles.container}
+ gradientType={BackgroundGradientType.Light}>
+ <StatusBar barStyle="light-content" />
+ <KeyboardAvoidingView
+ behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
+ style={styles.container}>
+ <View>
+ <Text style={styles.formHeader}>JOIN WAITLIST</Text>
+ </View>
+ <TaggInput
+ accessibilityHint="Enter your first name."
+ accessibilityLabel="First name input field."
+ placeholder="First Name"
+ autoCompleteType="name"
+ textContentType="name"
+ returnKeyType="next"
+ onChangeText={(text) => handleUpdate(text, 'first_name')}
+ onSubmitEditing={() => handleFocusChange('first_name')}
+ blurOnSubmit={false}
+ valid={first_name.isValid}
+ invalidWarning="Please enter a valid first name."
+ attemptedSubmit={form.attemptedSubmit}
+ width={280}
+ />
+ <TaggInput
+ accessibilityHint="Enter your last name."
+ accessibilityLabel="Last name input field."
+ placeholder="Last Name"
+ autoCompleteType="name"
+ textContentType="name"
+ returnKeyType="next"
+ onChangeText={(text) => handleUpdate(text, 'last_name')}
+ blurOnSubmit={false}
+ ref={lnameRef}
+ valid={last_name.isValid}
+ invalidWarning="Please enter a valid last name."
+ onSubmitEditing={() => handleFocusChange('phone_number')}
+ attemptedSubmit={form.attemptedSubmit}
+ width={280}
+ />
+ <TaggInput
+ maxLength={12}
+ accessibilityHint="Enter your phone number."
+ accessibilityLabel="Phone number input field."
+ placeholder="Phone Number"
+ autoCompleteType="tel"
+ textContentType="telephoneNumber"
+ autoCapitalize="none"
+ returnKeyType="next"
+ keyboardType="phone-pad"
+ onChangeText={(text) => handleUpdate(text, 'phone_number')}
+ blurOnSubmit={false}
+ ref={phoneRef}
+ valid={phone_number.isValid}
+ invalidWarning="Please enter a valid 10 digit number."
+ onSubmitEditing={handleAddUser}
+ attemptedSubmit={form.attemptedSubmit}
+ width={280}
+ />
+ <TouchableOpacity onPress={handleAddUser} style={styles.finalAction}>
+ <Text style={styles.finalActionLabel}>Submit</Text>
+ </TouchableOpacity>
+ <LoadingIndicator />
+ </KeyboardAvoidingView>
+ <Footer />
+ </Background>
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ alignItems: 'center',
+ justifyContent: 'center',
+ },
+ finalAction: {
+ backgroundColor: 'white',
+ justifyContent: 'center',
+ alignItems: 'center',
+ width: 150,
+ height: 40,
+ borderRadius: 5,
+ borderWidth: 1,
+ borderColor: '#fff',
+ marginVertical: SCREEN_HEIGHT / 20,
+ },
+ finalActionLabel: {
+ fontSize: 16,
+ fontWeight: '500',
+ color: 'black',
+ },
+ formHeader: {
+ color: '#fff',
+ fontSize: 30,
+ fontWeight: '600',
+ marginBottom: '16%',
+ },
+ footer: {
+ width: '100%',
+ flexDirection: 'row',
+ justifyContent: 'space-around',
+ ...Platform.select({
+ ios: {
+ bottom: '20%',
+ },
+ android: {
+ bottom: '10%',
+ },
+ }),
+ },
+});
+
+export default AddWaitlistUserScreen;
diff --git a/src/screens/onboarding/InvitationCodeVerification.tsx b/src/screens/onboarding/InvitationCodeVerification.tsx
index a9d1c12e..cc7cd678 100644
--- a/src/screens/onboarding/InvitationCodeVerification.tsx
+++ b/src/screens/onboarding/InvitationCodeVerification.tsx
@@ -10,7 +10,10 @@ import {
LoadingIndicator,
} from '../../components';
-import {VERIFY_INVITATION_CODE_ENDPOUNT} from '../../constants';
+import {
+ TAGG_LIGHT_PURPLE,
+ VERIFY_INVITATION_CODE_ENDPOUNT,
+} from '../../constants';
import {Text} from 'react-native-animatable';
import {
@@ -83,6 +86,10 @@ const InvitationCodeVerification: React.FC<InvitationCodeVerificationProps> = ({
}
};
+ const navigateToAddWaitList = () => {
+ navigation.navigate('AddWaitlistUser');
+ };
+
const Footer = () => (
<View style={styles.footer}>
<ArrowButton
@@ -131,6 +138,13 @@ const InvitationCodeVerification: React.FC<InvitationCodeVerificationProps> = ({
accessibilityHint="Select this after entering your invitation code"
onPress={handleInvitationCodeVerification}
/>
+ <View style={styles.noInviteCode}>
+ <Text style={styles.inviteCodeText}>Don't have an invite? </Text>
+ <Text style={styles.inviteCodeLink} onPress={navigateToAddWaitList}>
+ {' '}
+ Join the Waitlist
+ </Text>
+ </View>
<LoadingIndicator />
</KeyboardAvoidingView>
<Footer />
@@ -206,6 +220,19 @@ const styles = StyleSheet.create({
},
}),
},
+ noInviteCode: {
+ flexDirection: 'row',
+ justifyContent: 'center',
+ },
+ inviteCodeText: {
+ color: TAGG_LIGHT_PURPLE,
+ fontSize: 18,
+ },
+ inviteCodeLink: {
+ color: 'white',
+ fontSize: 18,
+ textDecorationLine: 'underline',
+ },
});
export default InvitationCodeVerification;
diff --git a/src/screens/onboarding/Login.tsx b/src/screens/onboarding/Login.tsx
index 006b38db..d1717fc1 100644
--- a/src/screens/onboarding/Login.tsx
+++ b/src/screens/onboarding/Login.tsx
@@ -15,7 +15,11 @@ import {
import {fcmService} from '../../services';
import {OnboardingStackParams} from '../../routes/onboarding';
import {Background, TaggInput, SubmitButton} from '../../components';
-import {usernameRegex, LOGIN_ENDPOINT} from '../../constants';
+import {
+ usernameRegex,
+ LOGIN_ENDPOINT,
+ TAGG_LIGHT_PURPLE,
+} from '../../constants';
import AsyncStorage from '@react-native-community/async-storage';
import {BackgroundGradientType, UserType} from '../../types';
import {useDispatch} from 'react-redux';
@@ -351,7 +355,7 @@ const styles = StyleSheet.create({
},
newUser: {
fontSize: 14,
- color: '#f4ddff',
+ color: TAGG_LIGHT_PURPLE,
},
getStarted: {
fontSize: 14,
diff --git a/src/screens/onboarding/WaitlistSuccessScreen.tsx b/src/screens/onboarding/WaitlistSuccessScreen.tsx
new file mode 100644
index 00000000..1f603e3a
--- /dev/null
+++ b/src/screens/onboarding/WaitlistSuccessScreen.tsx
@@ -0,0 +1,156 @@
+import {StackNavigationProp} from '@react-navigation/stack';
+import * as React from 'react';
+import {
+ KeyboardAvoidingView,
+ Linking,
+ Platform,
+ StatusBar,
+ StyleSheet,
+ Text,
+ TouchableOpacity,
+ View,
+} from 'react-native';
+import {ArrowButton, Background, SubmitButton} from '../../components';
+import {OnboardingStackParams} from '../../routes';
+import {BackgroundGradientType} from '../../types';
+import CelebrationLogo from '../../assets/icons/celebration-logo.svg';
+import {SCREEN_HEIGHT} from '../../utils';
+import {TAGG_WEBSITE} from '../../constants';
+
+type WaitlistSuccessScreenProp = StackNavigationProp<
+ OnboardingStackParams,
+ 'WaitlistSuccess'
+>;
+
+interface WaitlistSuccessScreenProps {
+ navigation: WaitlistSuccessScreenProp;
+}
+
+const WaitlistSuccessScreen: React.FC<WaitlistSuccessScreenProps> = ({
+ navigation,
+}) => {
+ const handleSignIn = () => {
+ navigation.navigate('InvitationCodeVerification');
+ };
+
+ const Footer = () => (
+ <View style={styles.footer}>
+ <ArrowButton
+ direction="backward"
+ onPress={() => navigation.navigate('AddWaitlistUser')}
+ />
+ </View>
+ );
+ return (
+ <Background
+ style={styles.container}
+ gradientType={BackgroundGradientType.Light}>
+ <KeyboardAvoidingView
+ behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
+ style={styles.container}>
+ <StatusBar barStyle="light-content" />
+ <CelebrationLogo width={100} height={100} />
+ <Text style={styles.heading}>
+ You've successfully joined{'\n'}
+ the waitlist, we'll let you know{'\n'}
+ as soon as your invite is{'\n'}ready!
+ </Text>
+ <Text style={[styles.subHeading, styles.subHeadOneMargin]}>
+ To learn more about Tagg you can visit our{'\n'}{' '}
+ <Text
+ style={styles.link}
+ onPress={() => {
+ Linking.openURL(TAGG_WEBSITE);
+ }}>
+ website
+ </Text>
+ . Thank you!
+ </Text>
+ <Text style={[styles.subHeading, styles.subHeadTwoMargin]}>
+ Got your invite text?
+ </Text>
+ <TouchableOpacity onPress={handleSignIn} style={styles.finalAction}>
+ <Text style={styles.finalActionLabel}>Sign In</Text>
+ </TouchableOpacity>
+ </KeyboardAvoidingView>
+ <Footer />
+ </Background>
+ );
+};
+
+const styles = StyleSheet.create({
+ container: {
+ flex: 1,
+ flexDirection: 'column',
+ alignItems: 'center',
+ justifyContent: 'center',
+ },
+ wizard: {
+ ...Platform.select({
+ ios: {
+ top: 50,
+ },
+ android: {
+ bottom: 40,
+ },
+ }),
+ },
+ link: {
+ textDecorationLine: 'underline',
+ },
+ finalAction: {
+ backgroundColor: 'white',
+ justifyContent: 'center',
+ alignItems: 'center',
+ width: 150,
+ height: 40,
+ borderRadius: 5,
+ borderWidth: 1,
+ borderColor: '#fff',
+ marginBottom: SCREEN_HEIGHT / 20,
+ marginTop: SCREEN_HEIGHT / 45,
+ },
+ finalActionLabel: {
+ fontSize: 16,
+ fontWeight: '500',
+ color: 'black',
+ },
+ formHeader: {
+ color: '#fff',
+ fontSize: 30,
+ fontWeight: '600',
+ marginBottom: '16%',
+ },
+ footer: {
+ width: '100%',
+ flexDirection: 'row',
+ justifyContent: 'space-around',
+ ...Platform.select({
+ ios: {
+ bottom: '20%',
+ },
+ android: {
+ bottom: '10%',
+ },
+ }),
+ },
+ heading: {
+ fontSize: 25,
+ fontWeight: 'bold',
+ color: 'white',
+ marginTop: SCREEN_HEIGHT / 25,
+ textAlign: 'center',
+ },
+ subHeading: {
+ color: 'white',
+ textAlign: 'center',
+ },
+ subHeadOneMargin: {
+ marginTop: SCREEN_HEIGHT / 30,
+ },
+ subHeadTwoMargin: {
+ marginTop: SCREEN_HEIGHT / 10,
+ },
+});
+
+export default WaitlistSuccessScreen;
diff --git a/src/screens/onboarding/index.ts b/src/screens/onboarding/index.ts
index 20a8020d..14d0e405 100644
--- a/src/screens/onboarding/index.ts
+++ b/src/screens/onboarding/index.ts
@@ -11,4 +11,6 @@ export {default as PasswordResetRequest} from './PasswordResetRequest';
export {default as PasswordReset} from './PasswordReset';
export {default as WelcomeScreen} from './WelcomeScreen';
export {default as CategorySelection} from './CategorySelection';
+export {default as AddWaitlistUserScreen} from './AddWaitlistUserScreen';
+export {default as WaitlistSuccessScreen} from './WaitlistSuccessScreen';
export {default as CreateCustomCategory} from './CreateCustomCategory';
diff --git a/src/services/WaitlistUserService.tsx b/src/services/WaitlistUserService.tsx
new file mode 100644
index 00000000..516affe3
--- /dev/null
+++ b/src/services/WaitlistUserService.tsx
@@ -0,0 +1,45 @@
+import {Alert} from 'react-native';
+import {WAITLIST_USER_ENDPOINT} from '../constants';
+
+export const adduserToWaitlist: (
+ phone_number: string,
+ first_name: string,
+ last_name: string,
+) => Promise<boolean> = async (phone_number, first_name, last_name) => {
+ try {
+ console.log(phone_number, first_name, last_name);
+ const response = await fetch(WAITLIST_USER_ENDPOINT, {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/json',
+ },
+ body: JSON.stringify({
+ phone_number,
+ first_name,
+ last_name,
+ }),
+ });
+ const status = response.status;
+ const message = await response.json();
+ if (status === 200) {
+ return true;
+ } else {
+ if (status === 409) {
+ Alert.alert('You are already on our waitlist / on our app');
+ } else if (status === 400) {
+ Alert.alert('Some information needed was missing / ill-formatted');
+ } else if (status === 500) {
+ Alert.alert(
+ 'Something went wrong. Sorry unable to add you to the waitlist 😔',
+ );
+ }
+ console.log(message);
+ }
+ } catch (err) {
+ Alert.alert(
+ 'Something went wrong. Sorry unable to add you to the waitlist 😔',
+ );
+ console.log(err);
+ }
+ return false;
+};
diff --git a/src/services/index.ts b/src/services/index.ts
index 7ea5bf5d..56cefddd 100644
--- a/src/services/index.ts
+++ b/src/services/index.ts
@@ -8,3 +8,4 @@ export * from './BlockUserService';
export * from './MomentCategoryService';
export * from './NotificationService';
export * from './FCMService';
+export * from './WaitlistUserService';