import { SafeAreaView, StyleSheet, Text, View } from 'react-native'
import React from 'react'
import fonts from '../../../constants/fonts'
import colors from '../../../constants/colors'
import images from '../../../assets/images/images'
import { getDate } from '../../../constants/functions'
import NotificationCard from '../../molecules/Cards/NotificationCard'
import { horizontalScale, moderateScale, verticalScale } from '../../../constants/metrics'


const NotificationSection = ({ navigation, timestamp, notifications }) => {


  const styles = StyleSheet.create({
    timestampText: {
      paddingHorizontal: horizontalScale(16),
      paddingVertical: verticalScale(8),
      fontFamily: fonts.type.light,
      color: colors().grayShade_400
    },
    notificationContainer: {
      backgroundColor: colors().dominant,
      minHeight: '100%'
    }
  })

  return (
    <View style={styles.notificationContainer}>
      <Text style={styles.timestampText}>{getDate("2023-06-16T11:57:52.458032Z")}</Text>
      <View style={{ paddingHorizontal: horizontalScale(16), gap: moderateScale(8) }}>
        <NotificationCard
          image={images.imageCard}
          profileImage={images.horizontalCard}
          headline={"semi has posted new politics news"}
          tagline={"semi has posted new  politics news"}
          timestamp={"2023-04-16T11:57:52.458032Z"}
        />
        <NotificationCard />
        <NotificationCard />
        <NotificationCard />
      </View>

    </View>
  )
}

export default NotificationSection
