aboutsummaryrefslogtreecommitdiff
path: root/src/screens/onboarding
diff options
context:
space:
mode:
Diffstat (limited to 'src/screens/onboarding')
-rw-r--r--src/screens/onboarding/Login.tsx24
-rw-r--r--src/screens/onboarding/ProfileOnboarding.tsx47
-rw-r--r--src/screens/onboarding/UpdateRequired.tsx84
-rw-r--r--src/screens/onboarding/WelcomeScreen.tsx5
-rw-r--r--src/screens/onboarding/index.ts1
5 files changed, 126 insertions, 35 deletions
diff --git a/src/screens/onboarding/Login.tsx b/src/screens/onboarding/Login.tsx
index 2db039c1..450c5039 100644
--- a/src/screens/onboarding/Login.tsx
+++ b/src/screens/onboarding/Login.tsx
@@ -13,7 +13,7 @@ import {
TouchableOpacity,
} from 'react-native';
import SplashScreen from 'react-native-splash-screen';
-import {useDispatch} from 'react-redux';
+import {useDispatch, useSelector} from 'react-redux';
import {Background, TaggInput, TaggSquareButton} from '../../components';
import {LOGIN_ENDPOINT, usernameRegex} from '../../constants';
import {
@@ -25,8 +25,10 @@ import {
} from '../../constants/strings';
import {OnboardingStackParams} from '../../routes/onboarding';
import {fcmService} from '../../services';
+import {RootState} from '../../store/rootReducer';
import {BackgroundGradientType, UserType} from '../../types';
import {normalize, userLogin} from '../../utils';
+import UpdateRequired from './UpdateRequired';
type VerificationScreenRouteProp = RouteProp<OnboardingStackParams, 'Login'>;
type VerificationScreenNavigationProp = StackNavigationProp<
@@ -45,11 +47,6 @@ const Login: React.FC<LoginProps> = ({navigation}: LoginProps) => {
// ref for focusing on input fields
const inputRef = useRef();
- const NO_USER: UserType = {
- userId: '',
- username: '',
- };
-
// login form state
const [form, setForm] = React.useState({
username: '',
@@ -59,7 +56,7 @@ const Login: React.FC<LoginProps> = ({navigation}: LoginProps) => {
attemptedSubmit: false,
token: '',
});
- const [user, setUser] = useState<UserType>(NO_USER);
+ const {newVersionAvailable} = useSelector((state: RootState) => state.user);
/**
* Redux Store stuff
@@ -167,7 +164,6 @@ const Login: React.FC<LoginProps> = ({navigation}: LoginProps) => {
userLogin(dispatch, {userId: data.UserID, username});
fcmService.sendFcmTokenToServer();
} catch (err) {
- setUser(NO_USER);
console.log(data);
Alert.alert(ERROR_INVALID_LOGIN);
}
@@ -216,6 +212,8 @@ const Login: React.FC<LoginProps> = ({navigation}: LoginProps) => {
style={styles.container}
gradientType={BackgroundGradientType.Light}>
<StatusBar barStyle="light-content" />
+ {/* <Modal visible={newVersionAvailable} /> */}
+ <UpdateRequired visible={newVersionAvailable} />
<KeyboardAvoidingView
behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
style={styles.keyboardAvoidingView}>
@@ -259,14 +257,16 @@ const Login: React.FC<LoginProps> = ({navigation}: LoginProps) => {
<TaggSquareButton
onPress={handleLogin}
title={'Login'}
- mode={'normal'}
- color={'white'}
+ buttonStyle={'normal'}
+ buttonColor={'white'}
+ labelColor={'blue'}
/>
<TaggSquareButton
onPress={startRegistrationProcess}
title={'Sign up'}
- mode={'normal'}
- color={'purple'}
+ buttonStyle={'normal'}
+ buttonColor={'purple'}
+ labelColor={'blue'}
/>
</KeyboardAvoidingView>
</Background>
diff --git a/src/screens/onboarding/ProfileOnboarding.tsx b/src/screens/onboarding/ProfileOnboarding.tsx
index 26ad93a7..c173c8e3 100644
--- a/src/screens/onboarding/ProfileOnboarding.tsx
+++ b/src/screens/onboarding/ProfileOnboarding.tsx
@@ -1,38 +1,34 @@
-import React from 'react';
+import AsyncStorage from '@react-native-community/async-storage';
import {RouteProp} from '@react-navigation/native';
-import moment from 'moment';
import {StackNavigationProp} from '@react-navigation/stack';
+import moment from 'moment';
+import React, {useMemo} from 'react';
import {
- Text,
+ Alert,
+ Image,
StatusBar,
StyleSheet,
- Image,
+ Text,
TouchableOpacity,
- Alert,
View,
} from 'react-native';
+import ImagePicker from 'react-native-image-crop-picker';
+import Animated from 'react-native-reanimated';
import {
Background,
+ BirthDatePicker,
TaggBigInput,
- TaggInput,
TaggDropDown,
- BirthDatePicker,
+ TaggInput,
} from '../../components';
-import {OnboardingStackParams} from '../../routes/onboarding';
-import ImagePicker from 'react-native-image-crop-picker';
import {
- EDIT_PROFILE_ENDPOINT,
- websiteRegex,
bioRegex,
- genderRegex,
CLASS_YEAR_LIST,
+ EDIT_PROFILE_ENDPOINT,
+ genderRegex,
TAGG_PURPLE,
+ websiteRegex,
} from '../../constants';
-import AsyncStorage from '@react-native-community/async-storage';
-import {BackgroundGradientType} from '../../types';
-import {PickerSelectProps} from 'react-native-picker-select';
-import Animated from 'react-native-reanimated';
-import {SCREEN_WIDTH} from '../../utils';
import {
ERROR_DOUBLE_CHECK_CONNECTION,
ERROR_PROFILE_CREATION_SHORT,
@@ -41,6 +37,9 @@ import {
ERROR_UPLOAD_LARGE_PROFILE_PIC,
ERROR_UPLOAD_SMALL_PROFILE_PIC,
} from '../../constants/strings';
+import {OnboardingStackParams} from '../../routes/onboarding';
+import {BackgroundGradientType} from '../../types';
+import {SCREEN_WIDTH} from '../../utils';
type ProfileOnboardingScreenRouteProp = RouteProp<
OnboardingStackParams,
@@ -383,6 +382,15 @@ const ProfileOnboarding: React.FC<ProfileOnboardingProps> = ({
}
};
+ const profilePics = useMemo(() => {
+ return (
+ <View style={styles.profile}>
+ <LargeProfilePic />
+ <SmallProfilePic />
+ </View>
+ );
+ }, [form.largePic, form.smallPic]);
+
return (
<Animated.ScrollView bounces={false}>
<Background
@@ -390,10 +398,7 @@ const ProfileOnboarding: React.FC<ProfileOnboardingProps> = ({
gradientType={BackgroundGradientType.Light}
style={styles.container}>
<StatusBar barStyle="light-content" />
- <View style={styles.profile}>
- <LargeProfilePic />
- <SmallProfilePic />
- </View>
+ {profilePics}
<View style={styles.contentContainer}>
<TaggInput
accessibilityHint="Enter a website."
diff --git a/src/screens/onboarding/UpdateRequired.tsx b/src/screens/onboarding/UpdateRequired.tsx
new file mode 100644
index 00000000..adf7ba71
--- /dev/null
+++ b/src/screens/onboarding/UpdateRequired.tsx
@@ -0,0 +1,84 @@
+import React from 'react';
+import {Image, Linking, Modal, StyleSheet, View} from 'react-native';
+import {Text} from 'react-native-animatable';
+import {CenteredView, TaggSquareButton} from '../../components';
+import {normalize, SCREEN_WIDTH} from '../../utils';
+
+interface UpdateRequiredProps {
+ visible: boolean;
+}
+
+const UpdateRequired: React.FC<UpdateRequiredProps> = ({visible}) => {
+ return (
+ <Modal animationType={'slide'} transparent={true} visible={visible}>
+ <CenteredView>
+ <View style={styles.contentContainer}>
+ <Image
+ style={styles.logo}
+ source={require('../../assets/images/logo-purple.png')}
+ />
+ <Text style={styles.header}>Update Required</Text>
+ <Text style={styles.body}>
+ You have to update your app to continue using Tagg, please download
+ the latest version from the app store
+ </Text>
+ <TaggSquareButton
+ title={'Update'}
+ onPress={() => {
+ Linking.openURL(
+ 'https://apps.apple.com/us/app/tagg-discover-your-community/id1537853613',
+ );
+ }}
+ buttonStyle={'normal'}
+ buttonColor={'purple'}
+ labelColor={'white'}
+ labelStyle={styles.button}
+ />
+ </View>
+ </CenteredView>
+ </Modal>
+ );
+};
+
+const styles = StyleSheet.create({
+ contentContainer: {
+ marginTop: '20%',
+ width: SCREEN_WIDTH * 0.9,
+ backgroundColor: 'white',
+ borderRadius: 5,
+ padding: '10%',
+ alignItems: 'center',
+ shadowColor: '#000',
+ shadowOffset: {
+ width: 0,
+ height: 2,
+ },
+ shadowOpacity: 0.25,
+ shadowRadius: 3.84,
+ elevation: 5,
+ },
+ logo: {
+ width: normalize(60),
+ height: normalize(60),
+ marginBottom: '10%',
+ },
+ header: {
+ fontSize: normalize(17),
+ fontWeight: '700',
+ lineHeight: 20,
+ marginBottom: '5%',
+ },
+ body: {
+ fontSize: normalize(13),
+ color: 'grey',
+ lineHeight: 20,
+ textAlign: 'center',
+ width: SCREEN_WIDTH * 0.8,
+ marginBottom: '10%',
+ },
+ button: {
+ fontWeight: '700',
+ },
+});
+
+export default UpdateRequired;
diff --git a/src/screens/onboarding/WelcomeScreen.tsx b/src/screens/onboarding/WelcomeScreen.tsx
index bfb1a127..ae31f933 100644
--- a/src/screens/onboarding/WelcomeScreen.tsx
+++ b/src/screens/onboarding/WelcomeScreen.tsx
@@ -39,8 +39,9 @@ const WelcomeScreen: React.FC<WelcomeScreenProps> = ({navigation}) => {
<TaggSquareButton
onPress={handleNext}
title={'Next'}
- mode={'large'}
- color={'purple'}
+ buttonStyle={'large'}
+ buttonColor={'purple'}
+ labelColor={'white'}
style={styles.nextButton}
/>
</Background>
diff --git a/src/screens/onboarding/index.ts b/src/screens/onboarding/index.ts
index 14d0e405..596683e5 100644
--- a/src/screens/onboarding/index.ts
+++ b/src/screens/onboarding/index.ts
@@ -14,3 +14,4 @@ export {default as CategorySelection} from './CategorySelection';
export {default as AddWaitlistUserScreen} from './AddWaitlistUserScreen';
export {default as WaitlistSuccessScreen} from './WaitlistSuccessScreen';
export {default as CreateCustomCategory} from './CreateCustomCategory';
+export {default as UpdateRequired} from './UpdateRequired';
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-07 01:08:50 +0000