added logout button in drawer

This commit is contained in:
leKimChiii 2023-04-16 17:42:58 +08:00
parent f95268a57c
commit f5d5da0246
2 changed files with 21 additions and 0 deletions

View file

@ -33,6 +33,7 @@ export default function App() {
<Drawer.Screen name="User Info" component={UserInfo} /> <Drawer.Screen name="User Info" component={UserInfo} />
<Drawer.Screen name="Login" component={Login} /> <Drawer.Screen name="Login" component={Login} />
<Drawer.Screen name="Register" component={Register} /> <Drawer.Screen name="Register" component={Register} />
<Drawer.Screen name="LogOut" component={Register} />
</Drawer.Navigator> </Drawer.Navigator>
</NavigationContainer> </NavigationContainer>

View file

@ -13,6 +13,7 @@ import LoginIcon from "../../../Icons/LoginIcon/LoginIcon";
import SignupIcon from "../../../Icons/SignupIcon/SignupIcon"; import SignupIcon from "../../../Icons/SignupIcon/SignupIcon";
import UserIcon from "../../../Icons/UserIcon/UserIcon"; import UserIcon from "../../../Icons/UserIcon/UserIcon";
import AppIcon from "../../../Icons/AppIcon/AppIcon"; import AppIcon from "../../../Icons/AppIcon/AppIcon";
import LogoutIcon from "../../../Icons/LogoutIcon/LogoutIcon";
export default function CustomDrawerContent(props: {}) { export default function CustomDrawerContent(props: {}) {
const navigation = useNavigation<RootDrawerParamList>(); const navigation = useNavigation<RootDrawerParamList>();
@ -30,6 +31,7 @@ export default function CustomDrawerContent(props: {}) {
Clip Notes Clip Notes
</Text> </Text>
</View> </View>
<ButtonAlignLeft <ButtonAlignLeft
color="Blue" color="Blue"
width={width} width={width}
@ -40,6 +42,7 @@ export default function CustomDrawerContent(props: {}) {
<HomeIcon size={32} color="white" /> <HomeIcon size={32} color="white" />
<Text style={{ ...styles.text_white, ...{ fontSize: 32 } }}>Home</Text> <Text style={{ ...styles.text_white, ...{ fontSize: 32 } }}>Home</Text>
</ButtonAlignLeft> </ButtonAlignLeft>
<ButtonAlignLeft <ButtonAlignLeft
color="Green" color="Green"
width={width} width={width}
@ -52,6 +55,7 @@ export default function CustomDrawerContent(props: {}) {
New Note New Note
</Text> </Text>
</ButtonAlignLeft> </ButtonAlignLeft>
<ButtonAlignLeft <ButtonAlignLeft
color="Green" color="Green"
width={width} width={width}
@ -62,6 +66,7 @@ export default function CustomDrawerContent(props: {}) {
<LoginIcon size={32} color="white" /> <LoginIcon size={32} color="white" />
<Text style={{ ...styles.text_white, ...{ fontSize: 32 } }}>Login</Text> <Text style={{ ...styles.text_white, ...{ fontSize: 32 } }}>Login</Text>
</ButtonAlignLeft> </ButtonAlignLeft>
<ButtonAlignLeft <ButtonAlignLeft
color="Yellow" color="Yellow"
width={width} width={width}
@ -74,6 +79,7 @@ export default function CustomDrawerContent(props: {}) {
User Info User Info
</Text> </Text>
</ButtonAlignLeft> </ButtonAlignLeft>
<ButtonAlignLeft <ButtonAlignLeft
color="Yellow" color="Yellow"
width={width} width={width}
@ -86,6 +92,20 @@ export default function CustomDrawerContent(props: {}) {
Register Register
</Text> </Text>
</ButtonAlignLeft> </ButtonAlignLeft>
<ButtonAlignLeft
color="Red"
width={width}
onPress={() => {
navigation.navigate("Register");
}}
>
<LogoutIcon size={32} color="white" />
<Text style={{ ...styles.text_white, ...{ fontSize: 32 } }}>
Log Out
</Text>
</ButtonAlignLeft>
</DrawerContentScrollView> </DrawerContentScrollView>
); );
} }