Add files via upload

1_app/App.tsx

@@ -0,0 +1,25 @@
+import React, {useEffect} from 'react';
+import Navigation from '../2_processes/navigation/Navigation';
+
+import {ThemeProvider} from './theme/ThemeProvider';
+import {ApolloProvider} from '@apollo/client';
+import {Provider} from 'react-redux';
+import store, {persistor} from './redux/store';
+import {PersistGate} from 'redux-persist/integration/react';
+import {client} from '../7_shared/api';
+
+function App(): React.JSX.Element {
+  return (
+    <ApolloProvider client={client}>
+      <Provider store={store}>
+        <PersistGate persistor={persistor}>
+          <ThemeProvider>
+            <Navigation />
+          </ThemeProvider>
+        </PersistGate>
+      </Provider>
+    </ApolloProvider>
+  );
+}
+
+export default App;

1_app/redux/duck/acccountData/index.tsx

@@ -0,0 +1,8 @@
+export {accountDataSelectors} from './selectors';
+
+export {
+  changeIsLoginStatus,
+  changeThemeToDark,
+  changeThemeToLight,
+  leaveToAccount,
+} from './slice';

1_app/redux/duck/acccountData/selectors.tsx

@@ -0,0 +1,6 @@
+import {RootState} from '../../store';
+
+export const accountDataSelectors = {
+  getIsLoginStatus: (state: RootState) => state.accountData.isLogin,
+  getCurrentTheme: (state: RootState) => state.accountData.theme,
+};

1_app/redux/duck/acccountData/slice.tsx

@@ -0,0 +1,35 @@
+import {createSlice} from '@reduxjs/toolkit';
+
+type accountDataType = {
+  theme: string;
+  isLogin: boolean;
+};
+
+const accountDataSlice = createSlice({
+  name: 'token',
+  initialState: {
+    theme: 'light',
+  } as accountDataType,
+  reducers: {
+    changeIsLoginStatus(state) {
+      state.isLogin = true;
+    },
+    leaveToAccount(state) {
+      state.isLogin = false;
+    },
+    changeThemeToLight(state) {
+      state.theme = 'light';
+    },
+    changeThemeToDark(state) {
+      state.theme = 'dark';
+    },
+  },
+});
+
+export const {
+  changeIsLoginStatus,
+  leaveToAccount,
+  changeThemeToLight,
+  changeThemeToDark,
+} = accountDataSlice.actions;
+export default accountDataSlice.reducer;

1_app/redux/duck/token/index.tsx

@@ -0,0 +1,2 @@
+export {tokenSelectors} from './selectors';
+export {setCurrentToken} from './slice';

1_app/redux/duck/token/selectors.tsx

@@ -0,0 +1,5 @@
+import {RootState} from '../../store';
+
+export const tokenSelectors = {
+  getToken: (state: RootState) => state.token.token,
+};

1_app/redux/duck/token/slice.tsx

@@ -0,0 +1,20 @@
+import {createSlice, PayloadAction} from '@reduxjs/toolkit';
+import {changeTokenTypes} from '../../types/tokenTypes';
+type tokenType = {
+  token: string | undefined;
+};
+
+const tokenSlice = createSlice({
+  name: 'token',
+  initialState: {
+    token: '',
+  } as tokenType,
+  reducers: {
+    setCurrentToken(state, action: PayloadAction<changeTokenTypes>) {
+      state.token = action.payload.token;
+    },
+  },
+});
+
+export const {setCurrentToken} = tokenSlice.actions;
+export default tokenSlice.reducer;

1_app/redux/store.tsx

@@ -0,0 +1,41 @@
+import {configureStore, combineReducers} from '@reduxjs/toolkit';
+import {
+  persistStore,
+  persistReducer,
+  FLUSH,
+  REHYDRATE,
+  PAUSE,
+  PERSIST,
+  PURGE,
+  REGISTER,
+} from 'redux-persist';
+import tokenReducer from './duck/token/slice';
+import accountDataReducer from './duck/acccountData/slice';
+import AsyncStorage from '@react-native-community/async-storage';
+
+const rootReducer = combineReducers({
+  token: tokenReducer,
+  accountData: accountDataReducer,
+});
+
+const persistConfig = {
+  key: 'root',
+  storage: AsyncStorage,
+};
+
+const persistedReducer = persistReducer(persistConfig, rootReducer);
+
+const store = configureStore({
+  reducer: persistedReducer,
+  middleware: getDefaultMiddleware =>
+    getDefaultMiddleware({
+      serializableCheck: {
+        ignoredActions: [FLUSH, REHYDRATE, PAUSE, PERSIST, PURGE, REGISTER],
+      },
+    }),
+});
+export const persistor = persistStore(store);
+export default store;
+
+export type RootState = ReturnType<typeof store.getState>;
+export type AppDispatch = typeof store.dispatch;

1_app/redux/types/accountDataTypes.ts

@@ -0,0 +1,3 @@
+export type changeIsLoginType = {
+    isLogin:boolean;
+}

1_app/redux/types/tokenTypes.ts

@@ -0,0 +1,3 @@
+export type changeTokenTypes = {
+  token: string | undefined;
+};

1_app/theme/ThemeProvider.tsx

@@ -0,0 +1,26 @@
+import React, {FC} from 'react';
+import {ThemeContext} from '../../7_shared/theme/theme.context';
+import {darkTheme, lightTheme} from '../../7_shared/theme';
+import {DefaultProviderProps} from '../../7_shared/types/types';
+import {useAppSelector} from '../../7_shared/hooks/reduxHoooks';
+import {accountDataSelectors} from '../redux/duck/acccountData';
+
+export const ThemeProvider: FC<DefaultProviderProps> = ({children}) => {
+  const theme = useAppSelector(state =>
+    accountDataSelectors.getCurrentTheme(state),
+  );
+  const handleCurrentTheme = () => {
+    if (theme === 'dark') {
+      return darkTheme;
+    }
+    if (theme === 'light') {
+      return lightTheme;
+    }
+    return lightTheme;
+  };
+  return (
+    <ThemeContext.Provider value={handleCurrentTheme()}>
+      {children}
+    </ThemeContext.Provider>
+  );
+};

2_processes/navigation/Navigation.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+import {UserIsGuest} from './UserIsGuest';
+import {NavigationContainer} from '@react-navigation/native';
+import {useAppSelector} from '../../7_shared/hooks/reduxHoooks';
+import {UserIsRegistred} from './UserIsRegistred';
+import {accountDataSelectors} from '../../1_app/redux/duck/acccountData/selectors';
+
+export default function Navigation() {
+  const checkIsLoginStatus = useAppSelector(state =>
+    accountDataSelectors.getIsLoginStatus(state),
+  );
+  return (
+    <NavigationContainer>
+      {checkIsLoginStatus === false || checkIsLoginStatus === undefined ? (
+        <UserIsGuest />
+      ) : (
+        <UserIsRegistred />
+      )}
+    </NavigationContainer>
+  );
+}

2_processes/navigation/UserIsGuest.tsx

@@ -0,0 +1,33 @@
+import React from 'react';
+import {createNativeStackNavigator} from '@react-navigation/native-stack';
+import Registration from '../../3_pages/UserIsGuest/Registration/Registration';
+import Congrats from '../../3_pages/UserIsGuest/Congrats/Congrats';
+import LogIn from '../../3_pages/UserIsGuest/LogIn/LogIn';
+import GetStarted from '../../3_pages/UserIsGuest/GetStarted/GetStarted';
+const Stack = createNativeStackNavigator();
+export const UserIsGuest = () => {
+  return (
+    <Stack.Navigator>
+      <Stack.Screen
+        name="splash"
+        component={GetStarted}
+        options={{headerShown: false}}
+      />
+      <Stack.Screen
+        name="registration"
+        component={Registration}
+        options={{headerShown: false}}
+      />
+      <Stack.Screen
+        name="congrats"
+        component={Congrats}
+        options={{headerShown: false}}
+      />
+      <Stack.Screen
+        name="login"
+        component={LogIn}
+        options={{headerShown: false}}
+      />
+    </Stack.Navigator>
+  );
+};

2_processes/navigation/UserIsRegistred.tsx

@@ -0,0 +1,129 @@
+import React from 'react';
+import {createNativeStackNavigator} from '@react-navigation/native-stack';
+import MainPage from '../../3_pages/UserIsRegistred/MainPage/MainPage';
+import {Profile} from '../../3_pages/UserIsRegistred/Profile/Profile';
+import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
+import Favorites from '../../3_pages/UserIsRegistred/Favorites/Favorites';
+import MyPosts from '../../3_pages/UserIsRegistred/MyPosts/MyPosts';
+import {useTheme} from '../../7_shared/hooks/useTheme';
+import {getStyles} from '../styles';
+import {Text, View} from 'react-native';
+import SvgHome from '../../../--no-index/home';
+import SvgBookmark from '../../../--no-index/bookmark';
+import SvgPhoto from '../../../--no-index/photo';
+import CreatePost from '../../3_pages/UserIsRegistred/CreatePost/CreatePost';
+
+const Stack = createNativeStackNavigator();
+const Tab = createBottomTabNavigator();
+const MainScreen = () => {
+  const styles = useTheme(getStyles);
+  return (
+    <Tab.Navigator
+      initialRouteName="Main"
+      screenOptions={{
+        headerShown: false,
+        tabBarShowLabel: false,
+        tabBarStyle: styles.tabBarStyles,
+      }}>
+      <Tab.Screen
+        name="Main"
+        component={MainPage}
+        options={{
+          headerShown: false,
+          tabBarIcon: ({focused}) => (
+            <View style={styles.tapBarItem}>
+              <SvgHome
+                color={
+                  focused
+                    ? styles.tapBarItemFocusedColor.color
+                    : styles.tapBarItemDefaultColor.color
+                }
+              />
+              <Text
+                style={
+                  focused
+                    ? styles.tapBarItemFocusedColor
+                    : styles.tapBarItemDefaultColor
+                }>
+                Main
+              </Text>
+            </View>
+          ),
+        }}
+      />
+      <Tab.Screen
+        name="Favorites"
+        component={Favorites}
+        options={{
+          headerShown: false,
+          tabBarIcon: ({focused}) => (
+            <View style={styles.tapBarItem}>
+              <SvgBookmark
+                color={
+                  focused
+                    ? styles.tapBarItemFocusedColor.color
+                    : styles.tapBarItemDefaultColor.color
+                }
+              />
+              <Text
+                style={
+                  focused
+                    ? styles.tapBarItemFocusedColor
+                    : styles.tapBarItemDefaultColor
+                }>
+                Favorites
+              </Text>
+            </View>
+          ),
+        }}
+      />
+      <Tab.Screen
+        name="My posts"
+        component={MyPosts}
+        options={{
+          headerShown: false,
+          tabBarIcon: ({focused}) => (
+            <View style={styles.tapBarItem}>
+              <SvgPhoto
+                color={
+                  focused
+                    ? styles.tapBarItemFocusedColor.color
+                    : styles.tapBarItemDefaultColor.color
+                }
+              />
+              <Text
+                style={
+                  focused
+                    ? styles.tapBarItemFocusedColor
+                    : styles.tapBarItemDefaultColor
+                }>
+                My posts
+              </Text>
+            </View>
+          ),
+        }}
+      />
+    </Tab.Navigator>
+  );
+};
+export const UserIsRegistred = () => {
+  return (
+    <Stack.Navigator>
+      <Stack.Screen
+        name="MainPage"
+        component={MainScreen}
+        options={{headerShown: false}}
+      />
+      <Stack.Screen
+        name="Profile"
+        component={Profile}
+        options={{headerShown: false}}
+      />
+      <Stack.Screen
+        name="CreatePost"
+        component={CreatePost}
+        options={{headerShown: false}}
+      />
+    </Stack.Navigator>
+  );
+};

2_processes/styles.ts

@@ -0,0 +1,24 @@
+import {StyleSheet} from 'react-native';
+import {ThemeType} from '../7_shared/theme';
+import {typography} from '../../typography';
+
+export const getStyles = (theme: ThemeType) =>
+  StyleSheet.create({
+    tabBarStyles: {
+      backgroundColor: theme.grayscale.white,
+      borderTopColor: theme.grayscale.white,
+      height: 60,
+    },
+    tapBarItem: {
+      justifyContent: 'center',
+      alignItems: 'center',
+    },
+    tapBarItemDefaultColor: {
+      color: theme.grayscale.grayscale400,
+      ...typography.captionRegular12,
+    },
+    tapBarItemFocusedColor: {
+      color: theme.primary.default,
+      ...typography.captionRegular12,
+    },
+  });