diff --git a/app/(tabs)/settings/index.tsx b/app/(tabs)/settings/index.tsx
index 1f7dd11..8cf6a73 100644
--- a/app/(tabs)/settings/index.tsx
+++ b/app/(tabs)/settings/index.tsx
@@ -3,7 +3,6 @@ import { useRouter } from 'expo-router';
import ParallaxScrollView from '@/components/default/ParallaxScrollView';
import { ThemedText, ThemedTextButton, ThemedView } from '@/components/theme';
import { IconSymbol } from '@/components/ui/IconSymbol';
-import Logout_Button from '@/components/auth/Logout_Button';
const SettingsScreen = () => {
const router = useRouter();
@@ -35,7 +34,6 @@ const SettingsScreen = () => {
-
);
diff --git a/app/(tabs)/settings/profile.tsx b/app/(tabs)/settings/profile.tsx
index ba7812f..6c4dcd0 100644
--- a/app/(tabs)/settings/profile.tsx
+++ b/app/(tabs)/settings/profile.tsx
@@ -6,6 +6,7 @@ import { ThemedView, ThemedText, ThemedTextButton, ThemedTextInput } from '@/com
import { IconSymbol } from '@/components/ui/IconSymbol';
import Avatar from '@/components/auth/Profile_Avatar';
import { Session } from '@supabase/supabase-js'
+import Logout_Button from '@/components/auth/Logout_Button';
export default function ProfileScreen() {
const [loading, setLoading] = useState(false);
@@ -101,6 +102,12 @@ export default function ProfileScreen() {
width='90%'
style={styles.saveButton}
/>
+
);
@@ -150,7 +157,12 @@ const styles = StyleSheet.create({
marginBottom: 20,
},
saveButton: {
- paddingVertical: 14,
+ borderRadius: 8,
+ alignItems: 'center',
+ },
+ logoutButton: {
+ backgroundColor: 'red',
+ marginTop: 50,
borderRadius: 8,
alignItems: 'center',
},
diff --git a/components/auth/Logout_Button.tsx b/components/auth/Logout_Button.tsx
index de7a513..fd51a3a 100644
--- a/components/auth/Logout_Button.tsx
+++ b/components/auth/Logout_Button.tsx
@@ -1,8 +1,33 @@
import { supabase } from '@/lib/supabase';
import { ThemedView, ThemedText, ThemedTextButton, ThemedTextInput } from '@/components/theme';
import { Alert, StyleSheet, AppState } from 'react-native';
+import React from 'react';
+import { TextStyle, PressableProps, DimensionValue } from 'react-native';
+import ThemedButton from '@/components/theme/buttons/ThemedButton';
+import { Colors } from '@/constants/Colors';
+import { useColorScheme } from '@/hooks/useColorScheme';
-const Logout_Button = () => {
+// Extend ThemedButton props (which already extends PressableProps)
+type ThemedTextButtonProps = Omit & {
+ width?: DimensionValue;
+ height?: DimensionValue;
+ fontSize?: number;
+ fontWeight?: 'normal' | 'semibold' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
+ textStyle?: TextStyle;
+ containerStyle?: object;
+ buttonStyle?: object;
+};
+
+const Logout_Button: React.FC = ({
+ width,
+ height,
+ fontSize = 16,
+ fontWeight = 'normal',
+ textStyle,
+ containerStyle,
+ buttonStyle,
+ ...restProps
+}) => {
const signOut = async () => {
const { error } = await supabase.auth.signOut();
if (error) Alert.alert(error.message);
@@ -10,11 +35,15 @@ const Logout_Button = () => {
return (
signOut()}
+ {...restProps}
/>
);
};