Forráskód Böngészése

fix: profile screen

Oleksandr Honcharov 1 éve
szülő
commit
b964c6a9e1

+ 21 - 2
src/screens/InAppScreens/ProfileScreen/Settings/index.tsx

@@ -17,6 +17,7 @@ import UserXMark from '../../../../../assets/icons/user-xmark.svg';
 import type { MenuButtonType } from '../../../../types/components';
 import { Switch, Text, View } from 'react-native';
 import { getOnlineStatus, storage } from 'src/storage';
+import { CommonActions } from '@react-navigation/native';
 
 const buttons: MenuButtonType[] = [
   {
@@ -53,7 +54,18 @@ const buttons: MenuButtonType[] = [
   {
     label: 'Logout',
     icon: <ExitIcon fill={Colors.RED} width={20} height={20} />,
-    red: true
+    red: true,
+    buttonFn: (navigation) => {
+      storage.remove('token');
+      storage.remove('uid');
+
+      navigation.dispatch(
+        CommonActions.reset({
+          index: 1,
+          routes: [{ name: NAVIGATION_PAGES.WELCOME }]
+        })
+      );
+    }
   },
   {
     label: 'Delete account',
@@ -84,7 +96,14 @@ const Settings = () => {
           buttonFn={button.buttonFn}
         />
       ))}
-      <View style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', marginTop: 20 }}>
+      <View
+        style={{
+          display: 'flex',
+          flexDirection: 'row',
+          justifyContent: 'space-between',
+          marginTop: 20
+        }}
+      >
         <Text style={{ color: Colors.DARK_BLUE, fontSize: 16, fontWeight: 'bold' }}>
           Offline mode
         </Text>

+ 31 - 3
src/screens/InAppScreens/ProfileScreen/index.tsx

@@ -2,11 +2,11 @@ import React, { FC, ReactNode } from 'react';
 import { Text, TouchableOpacity, View } from 'react-native';
 import { Image } from 'expo-image';
 import { createMaterialTopTabNavigator } from '@react-navigation/material-top-tabs';
-import { NavigationProp } from '@react-navigation/native';
+import { CommonActions, NavigationProp, useNavigation } from '@react-navigation/native';
 
 import { type Score, type Series, type SocialData, usePostGetProfileInfoQuery } from '@api/user';
 
-import { PageWrapper } from '../../../components';
+import { BigText, Button, PageWrapper } from '../../../components';
 import { Colors } from '../../../theme';
 import { styles } from './styles';
 
@@ -27,6 +27,7 @@ import IconGlobe from '../../../../assets/icons/bottom-navigation/globe.svg';
 import IconLink from '../../../../assets/icons/link.svg';
 import GearIcon from '../../../../assets/icons/gear.svg';
 import Loading from '../../../components/Loading';
+import { ButtonVariants } from '../../../types/components';
 
 const Tab = createMaterialTopTabNavigator();
 
@@ -37,6 +38,8 @@ type Props = {
 const ProfileScreen: FC<Props> = ({ navigation }) => {
   const token = storage.get('token', StoreType.STRING) as string;
 
+  if (!token) return <UnauthenticatedProfileScreen />;
+
   const { data, error } = usePostGetProfileInfoQuery(token, true);
 
   if (!data) return <Loading />;
@@ -152,7 +155,7 @@ const PersonalInfo: FC<PersonalInfoProps> = ({ data }) => {
         })}
       </InfoItem>
       <InfoItem inline={true} title={'SERIES BADGES'}>
-        {data.series.map((data) => (
+        {data.series?.map((data) => (
           <View style={{ display: 'flex', flexDirection: 'column', gap: 5, alignItems: 'center' }}>
             <Image source={{ uri: API_HOST + data.icon_png }} style={{ width: 28, height: 28 }} />
             <Text style={[styles.headerText, { flex: 0 }]}>{data.score}</Text>
@@ -210,4 +213,29 @@ const InfoItem: FC<{ title: string; inline?: boolean; children: ReactNode }> = (
   </View>
 );
 
+const UnauthenticatedProfileScreen = () => {
+  const navigation = useNavigation();
+
+  return (
+    <PageWrapper>
+      <View style={{ marginTop: 15, display: 'flex', gap: 10 }}>
+        <BigText children={'You are not logged in. Please login or register to access profile.'} />
+        <Button
+          onPress={() =>
+            navigation.dispatch(
+              CommonActions.reset({
+                index: 1,
+                routes: [{ name: NAVIGATION_PAGES.WELCOME }]
+              })
+            )
+          }
+          variant={ButtonVariants.FILL}
+        >
+          Go to login/register
+        </Button>
+      </View>
+    </PageWrapper>
+  );
+};
+
 export default ProfileScreen;

+ 1 - 1
src/screens/LoginScreen/index.tsx

@@ -22,7 +22,7 @@ const LoginSchema = yup.object({
 });
 
 const LoginScreen: FC<Props> = ({ navigation }) => {
-  const { dispatch, navigate } = useNavigation();
+  const { dispatch } = useNavigation();
 
   const { data, mutate: userLogin } = useLoginMutation();