user.js

import { Pressable, StyleSheet, Text, Button, View, Appearance, useColorScheme } from "react-native";
import { Link } from "expo-router";
import { StatusBar } from 'expo-status-bar';
import { SafeAreaProvider } from 'react-native-safe-area-context';
import Animated, { useSharedValue, withTiming, useAnimatedStyle, Easing, } from 'react-native-reanimated';

export default function Page() {

    const colorScheme = useColorScheme();

    const themeTextStyle = colorScheme === 'light' ? styles.lightThemeText : styles.darkThemeText;
    const themeContainerStyle =
        colorScheme === 'light' ? styles.lightContainer : styles.darkContainer;


    return (
        <SafeAreaProvider>
            <View style={[styles.container, themeContainerStyle]}>
                <Text style={[styles.text, themeTextStyle]}>This is a user page</Text>
                <Link replace href="/" asChild>
                    <Pressable>
                        <Text style={[styles.text, themeTextStyle]}>Press this to go to home page</Text>
                    </Pressable>
                </Link>
                <StatusBar style="auto" />
            </View>
        </SafeAreaProvider>
    );
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#fff',
        alignItems: 'center',
        justifyContent: 'center',
    },
    lightContainer: {
        // white
        backgroundColor: '#FFFFFF',
    },
    darkContainer: {
        // black
        backgroundColor: '#000000',
    },
    lightThemeText: {
        // white
        color: '#000000',
    },
    darkThemeText: {
        // black
        color: '#FFFFFF',
    },
});