keannu125/Reactnative-notesapp
1
0
Fork 0
mirror of https://github.com/lemeow125/Reactnative-notesapp.git synced 2025-06-29 00:45:44 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge commit '958e62d733' into feature/initial_frontend

Browse source
This commit is contained in:
Keannu Christian Bernasol 2023-04-08 16:47:25 +08:00
commit 7388b851d5
11 changed files with 5071 additions and 641 deletions
Download patch file Download diff file Expand all files Collapse all files

50
src/Routes/Home/Home.tsx
View file

@ -1,34 +1,40 @@
import * as React from 'react';
import {View, Text} from 'react-native';
import styles from '../../styles';
import Background from '../../Components/Background/Background';
import * as React from "react";
import { View, Text, TouchableOpacity } from "react-native";
import styles from "../../styles";
import Background from "../../Components/Background/Background";
import AppIcon from "../../Components/Icons/AppIcon/AppIcon";
import { useNavigation } from "@react-navigation/native";
import {TouchableOpacity,} from "react-native";
import { useDispatch } from "react-redux";
import { RootDrawerParamList } from "../../Interfaces/Interfaces";
export default function Home() {
const navigation = useNavigation<RootDrawerParamList>();
const navigation = useNavigation<RootDrawerParamList>();
const dispatch = useDispatch();
return (
<Background>
<Text style={{...styles.text_white, ...{fontSize: 25}}}>Clip Notes</Text>
<Text style={{ ...styles.text_white, ...{ fontSize: 25 } }}>
Clip Notes
</Text>
<View
style={{
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
justifyContent: 'center',
}}>
<View style={styles.homecont}>
<TouchableOpacity
onPress={() => {
navigation.navigate("Add Note");
}}>
<Text style={styles.newnote}>+</Text>
</TouchableOpacity>
<Text style={styles.no}>New note...</Text>
<View style={{margin: 16}} />
</View>
display: "flex",
flexDirection: "row",
alignItems: "center",
justifyContent: "center",
}}
>
<View style={styles.homecont}>
<TouchableOpacity
onPress={() => {
navigation.navigate("Add Note");
}}
>
<Text style={styles.newnote}>+</Text>
</TouchableOpacity>
<Text style={styles.no}>New note...</Text>
<View style={{ margin: 16 }} />
</View>
</View>
</Background>
);

138
src/Routes/Login/Login.tsx
View file

@ -1,61 +1,99 @@
import * as React from 'react';
import {View, Text, TextInput} from 'react-native';
import styles from '../../styles';
import Background from '../../Components/Background/Background';
import { SafeAreaView} from "react-native";
import * as React from "react";
import { View, Text, TextInput } from "react-native";
import styles from "../../styles";
import Background from "../../Components/Background/Background";
import {
SafeAreaView,
NativeSyntheticEvent,
TextInputChangeEventData,
} from "react-native";
import { StatusBar } from "expo-status-bar";
import { useState } from "react";
import {TouchableOpacity,} from "react-native";
import { TouchableOpacity } from "react-native";
import {
NavigationHelpersContext,
useNavigation,
} from "@react-navigation/native";
import { useDispatch } from "react-redux";
import { SetUser } from "../../Features/Redux/Slices/LoggedInUserSlice/LoggedInUserSlice";
import { SetLoggedIn } from "../../Features/Redux/Slices/LoginSlice/LoginSlice";
import { UserInfo, UserLogin } from "../../Components/Api/Api";
import { RootDrawerParamList } from "../../Interfaces/Interfaces";
import { useNavigation } from "@react-navigation/native";
export default function Login() {
const [username, setUsername] = useState("");
const [password, setPassword] = useState("");
const navigation = useNavigation<RootDrawerParamList>();
const dispatch = useDispatch();
const [user, setUser] = useState({
username: "",
password: "",
});
const [error, setError] = useState("");
return (
<Background>
<Text style={{...styles.text_white, ...{fontSize: 32}}}></Text>
<Text style={{ ...styles.text_white, ...{ fontSize: 32 } }}></Text>
<SafeAreaView>
<View style={styles.container}>
<Text style ={styles.loginlabel}>Login to Clip Notes</Text>
<StatusBar style="auto" />
<View style={styles.inputView}>
<TextInput
style={styles.TextInput}
placeholder="Username"
placeholderTextColor="white"
onChangeText={setUsername}
value={username}
/>
</View>
<View style={styles.inputView}>
<TextInput
style={styles.TextInput}
placeholder="Password"
placeholderTextColor="white"
secureTextEntry={true}
onChangeText={setPassword}
value={password}
/>
</View>
<View style={styles.container}>
<Text style={styles.loginlabel}>Login to Clip Notes</Text>
<StatusBar style="auto" />
<View style={styles.inputView}>
<TextInput
style={styles.TextInput}
placeholder="Username"
placeholderTextColor="white"
value={user.username}
maxLength={20}
onChange={(
e: NativeSyntheticEvent<TextInputChangeEventData>
): void => {
setUser({ ...user, username: e.nativeEvent.text });
console.log(user.username);
}}
/>
</View>
<TouchableOpacity>
<Text style={styles.forgot_button}>Forgot Password?</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.loginBtn}>
<Text style={styles.loginText}>LOGIN</Text>
</TouchableOpacity>
<TouchableOpacity style={styles.registerbtn}
onPress={() => {
navigation.navigate("Register");
}}>
<Text style={styles.registertext}>REGISTER</Text>
</TouchableOpacity>
</View>
<View style={styles.inputView}>
<TextInput
style={styles.TextInput}
placeholder="Password"
placeholderTextColor="white"
secureTextEntry={true}
value={user.password}
onChange={(
e: NativeSyntheticEvent<TextInputChangeEventData>
): void => {
setUser({ ...user, password: e.nativeEvent.text });
console.log(user.password);
}}
/>
</View>
<TouchableOpacity>
<Text style={styles.forgot_button}>Forgot Password?</Text>
</TouchableOpacity>
<TouchableOpacity
onPress={async () => {
setUser({
username: "",
password: "",
});
if (await UserLogin(user)) {
await dispatch(SetLoggedIn());
await dispatch(SetUser(await UserInfo()));
navigation.navigate("Home");
} else {
setError("Invalid Login");
}
}}
style={styles.loginBtn}
>
<Text style={styles.loginText}>LOGIN</Text>
</TouchableOpacity>
<Text style={styles.text_small_red}>{error}</Text>
<TouchableOpacity style={styles.registerbtn}>
<Text style={styles.registertext}>REGISTER</Text>
</TouchableOpacity>
</View>
</SafeAreaView>
</Background>
);
};
</Background>
);
}