crazycharge-app/app/(auth)/(tabs)/(home)/notificationPage.tsx

import { View, Text, Pressable, Image, ScrollView, Alert, ImageBackground, ActivityIndicator } from 'react-native';
import { SafeAreaView } from 'react-native-safe-area-context';
import { router, useLocalSearchParams } from 'expo-router';
import { PreviousPageBlackSvg } from '../../../../component/global/SVG';
import { useEffect, useState } from 'react';

import { FlashList } from '@shopify/flash-list';

interface TransactionRecordItem {
    date: string;
    title: string;
    description: string;
}
const TransactionRow: React.FC<TransactionRecordItem> = ({ date, description, amount, actual_total_power }) => (
    <View className="flex flex-row w-full py-4 border-b border-[#CCCCCC]">
        <Text className="flex-[0.25] text-sm">{date}</Text>
        <Text className="flex-[0.25] text-sm">{description}</Text>
        <Text className="flex-[0.25] text-sm text-right">
            {actual_total_power !== '-' ? Number(actual_total_power).toFixed(1) : actual_total_power}
        </Text>
        <Text className="flex-[0.25] text-sm text-right">${Number.isInteger(amount) ? amount : amount.toFixed(1)}</Text>
    </View>
);
const NotificationPageComponent = () => {
    const params = useLocalSearchParams();

    const [loading, setLoading] = useState(false);
    const [loading1, setLoading1] = useState(false);

    return (
        <SafeAreaView className="flex-1 bg-white" edges={['top', 'right', 'left']}>
            <ScrollView style={{ flex: 1 }} className="mx-[5%]" showsVerticalScrollIndicator={false}>
                <View style={{ marginTop: 25 }}>
                    <Pressable
                        onPress={() => {
                            if (router.canGoBack()) {
                                router.back();
                            } else {
                                router.replace('/accountMainPage');
                            }
                        }}
                    >
                        <PreviousPageBlackSvg />
                    </Pressable>
                    <Text style={{ fontSize: 45, marginVertical: 25 }}>最新消息</Text>
                </View>

                <View className="flex flex-row w-full py-2 border-b border-[#CCCCCC]">
                    <Text className="flex-[0.25] text-sm text-[#888888]">日期</Text>
                    <Text className="flex-[0.25] text-sm text-[#888888]">標題</Text>

                    <Text className="flex-[0.25] text-sm text-right text-[#888888]"></Text>
                </View>
                <View className="border-t  border-[#CCCCCC]" />
            </ScrollView>
        </SafeAreaView>
    );
};

export default NotificationPageComponent;