Commit 8d79be54 authored by Peter Skaar Nordby's avatar Peter Skaar Nordby
Browse files

La til login redirect og utlogging

parent 97e9386c
......@@ -34,14 +34,8 @@ const { formState: { errors }, handleSubmit } = methods;
const [isLogin, setIsLogin] = useState(true);
const dispatch = useDispatch();
const { loading, error, loggedIn } = useSelector(({ auth }: ApplicationState) => auth);
// TODO Redirect to homepage if user is already logged in
useEffect(() => {
if (loggedIn) {
console.log("push");
}
}, [loggedIn, location]);
const { loading, error } = useSelector(({ auth }: ApplicationState) => auth);
// Form completed
const onFinish = (values: FormValues) => {
......
......@@ -28,6 +28,7 @@ export default function ProfileInfo({ user }: { user: UserEntity }) {
const styles = StyleSheet.create({
profileInfoContainer: {
marginTop: 10,
alignItems: 'center',
marginHorizontal: 50,
},
......
......@@ -36,7 +36,7 @@ const UserRatingCard = (props: UserRatingCardProps): JSX.Element => {
size={20}
/>
<Text style={styles.titleText} lightColor="rgba(0,0,0,0.8)" darkColor="rgba(255,255,255,0.8)">{movie.title}</Text>
<Text style={styles.comment} lightColor="rgba(0,0,0,0.8)" darkColor="rgba(255,255,255,0.8)">{comment}</Text>
<Text style={styles.comment} lightColor="rgba(0,0,0,0.7)" darkColor="rgba(255,255,255,0.7)">{comment}</Text>
<Text style={styles.date} lightColor="rgba(0,0,0,0.6)" darkColor="rgba(255,255,255,0.6)">{date.split('T')[0]}</Text>
</View>
</View>
......@@ -55,16 +55,16 @@ const styles = StyleSheet.create({
marginVertical: 10,
},
titleText: {
marginHorizontal: 5,
marginHorizontal: 10,
fontSize: 18,
fontWeight: 'bold',
},
comment: {
marginHorizontal: 5,
marginHorizontal: 10,
fontSize: 12,
},
date: {
marginHorizontal: 5,
marginHorizontal: 10,
fontSize: 12,
position: 'absolute',
bottom: 10,
......
......@@ -17,7 +17,6 @@ export default function UserRatings(): JSX.Element {
useEffect(() => {
if (auth.token) {
console.log(auth.token);
dispatch(getRatings({token: auth.token}));
}
}, []);
......@@ -29,6 +28,7 @@ export default function UserRatings(): JSX.Element {
renderItem={({item}) => <UserRatingCard userRating={item} />}
keyExtractor={item => item.movie.id}
showsVerticalScrollIndicator={false}
ItemSeparatorComponent={() => <View style={styles.separator} lightColor="#rgba(0,0,0,0.5)" darkColor="rgba(255,255,255,0.5)" />}
/>
)
......@@ -48,4 +48,9 @@ const styles = StyleSheet.create({
textAlign: 'left',
paddingBottom: 10
},
separator: {
marginVertical: 5,
height: 1,
width: '100%',
},
});
\ No newline at end of file
......@@ -3,33 +3,33 @@
* https://reactnavigation.org/docs/getting-started
*
*/
import { FontAwesome } from '@expo/vector-icons';
import { MaterialIcons } from '@expo/vector-icons';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import { FontAwesome } from "@expo/vector-icons";
import { MaterialIcons } from "@expo/vector-icons";
import { createBottomTabNavigator } from "@react-navigation/bottom-tabs";
import {
NavigationContainer,
DefaultTheme,
DarkTheme,
} from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import * as React from 'react';
import { ColorSchemeName, Pressable } from 'react-native';
} from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
import * as React from "react";
import { ColorSchemeName, Pressable } from "react-native";
import Colors from '../constants/Colors';
import useColorScheme from '../hooks/useColorScheme';
import ModalScreen from '../screens/ModalScreen';
import MovieTableScreen from '../screens/MovieTableScreen';
import NotFoundScreen from '../screens/NotFoundScreen';
import TabOneScreen from '../screens/TabOneScreen';
import Profile from '../screens/Profile';
import Colors from "../constants/Colors";
import useColorScheme from "../hooks/useColorScheme";
import ModalScreen from "../screens/ModalScreen";
import MovieTableScreen from "../screens/MovieTableScreen";
import NotFoundScreen from "../screens/NotFoundScreen";
import TabOneScreen from "../screens/TabOneScreen";
import Profile from "../screens/Profile";
import {
RootStackParamList,
RootTabParamList,
RootTabScreenProps,
} from '../types';
import LinkingConfiguration from './LinkingConfiguration';
} from "../types";
import LinkingConfiguration from "./LinkingConfiguration";
import { useDispatch } from "react-redux";
import { signOut } from "../store/ducks/auth/actions";
export default function Navigation({
colorScheme,
......@@ -38,8 +38,8 @@ export default function Navigation({
}) {
return (
<NavigationContainer
linking={LinkingConfiguration}
theme={colorScheme === 'dark' ? DarkTheme : DefaultTheme}
linking={LinkingConfiguration}
theme={colorScheme === "dark" ? DarkTheme : DefaultTheme}
>
<RootNavigator />
</NavigationContainer>
......@@ -59,13 +59,13 @@ function RootNavigator() {
name="Root"
component={BottomTabNavigator}
options={{ headerShown: false }}
/>
/>
<Stack.Screen
name="NotFound"
component={NotFoundScreen}
options={{ title: 'Oops!' }}
/>
<Stack.Group screenOptions={{ presentation: 'modal' }}>
options={{ title: "Oops!" }}
/>
<Stack.Group screenOptions={{ presentation: "modal" }}>
<Stack.Screen name="Modal" component={ModalScreen} />
</Stack.Group>
</Stack.Navigator>
......@@ -78,32 +78,50 @@ function RootNavigator() {
*/
const BottomTab = createBottomTabNavigator<RootTabParamList>();
function BottomTabNavigator() {
const colorScheme = useColorScheme();
const BottomTabNavigator = () => {
const dispatch = useDispatch();
const colorScheme = useColorScheme();
return (
<BottomTab.Navigator
initialRouteName="Movies"
screenOptions={{
tabBarActiveTintColor: Colors[colorScheme].tint,
initialRouteName="Movies"
screenOptions={{
tabBarActiveTintColor: Colors[colorScheme].tint,
}}
>
>
<BottomTab.Screen
name="Movies"
component={MovieTableScreen}
options={{
title: 'Movies',
tabBarIcon: ({color}) => <MaterialIcons name="movie" size={30} style={{ marginBottom: -3 }} color={color} />,
title: "Movies",
tabBarIcon: ({ color }) => (
<MaterialIcons
name="movie"
size={30}
style={{ marginBottom: -3 }}
color={color}
/>
),
}}
/>
/>
<BottomTab.Screen
name="Profile"
component={Profile}
options={{
title: 'Profile',
tabBarIcon: ({ color }) => <MaterialIcons name="person-outline" size={30} style={{ marginBottom: -3 }} color={color} />,
title: "Profile",
tabBarIcon: ({ color }) => (
<MaterialIcons
name="person-outline"
size={30}
style={{ marginBottom: -3 }}
color={color}
/>
),
headerRight: () => (
<Pressable
onPress={() => 0}
onPress={() => dispatch(signOut())}
style={({ pressed }) => ({
opacity: pressed ? 0.5 : 1,
})}
......
......@@ -27,7 +27,7 @@ export default function Profile() {
</View>
);
}
else if (auth.user) {
else if (auth.loggedIn && auth.user) {
return (
<View style={styles.container}>
<ProfileInfo user={auth.user} />
......
......@@ -21,10 +21,12 @@ export const signIn = (params: SignInParams): ApolloClientAction =>
export const setToken = () => async (dispatch: Dispatch<PayloadAction<string, Token | undefined>>) => {
const token = await getToken();
dispatch({
type: AuthActionTypes.SET_TOKEN,
payload: token,
});
if (token) {
dispatch({
type: AuthActionTypes.SET_TOKEN,
payload: token,
});
}
}
export const signUp = (params: SignUpParams): ApolloClientAction =>
......
import { Action, PayloadAction, TypeConstant } from "typesafe-actions";
import { getToken } from "./helpers";
import { AuthState, AuthActionTypes } from "./types";
// Fetch JWT-token from storage
const jwtToken = getToken();
export const signedOutState: AuthState = {
token: null,
user: null,
......@@ -17,21 +13,6 @@ export const signedOutState: AuthState = {
export const initialState: AuthState = signedOutState;
// export const initialState: AuthState = jwtToken
// ? {
// token: jwtToken.encodedToken,
// user: {
// id: jwtToken.id,
// email: jwtToken.email,
// username: jwtToken.username,
// },
// loggedIn: true,
// error: null,
// loading: false,
// ratings: [],
// }
// : signedOutState;
export const authReducer = (
state: AuthState = initialState,
action: Action<TypeConstant> & PayloadAction<TypeConstant, any>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment