transporter-app/screens/notfication.js

81 lines
3.2 KiB
JavaScript
Raw Permalink Normal View History

2024-06-26 23:24:26 +03:00
import {ScrollView, Text, View} from "react-native";
import Card from "../components/card";
import Accordion from "../components/acordion";
import {LayoutScrollView} from "../components/screens/layout";
import {useSnapshot} from "valtio";
import NotificationStore, {getNotifications} from "../store/notificationStore";
import {useEffect} from "react";
import {useNavigation} from "@react-navigation/native";
import Api from "../services/api";
const Notification = () => {
const {notifications} = useSnapshot(NotificationStore)
const navigation = useNavigation();
useEffect(() => {
navigation.addListener('blur', () => {
NotificationStore.newNotificationBadge = 0
// todo set notification to recited by calling http endpoint
Api.setNotificationsRecited({notificationIds: notifications.map(elem => elem.id)})
.then(() => {
// Revalidate it
getNotifications()
})
})
}, []);
return (
<LayoutScrollView title={"Уведомления"}>
<Accordion title={"Новые"} style={{marginBottom: 20}}>
{
notifications
.filter(notification => !notification.is_recited)
.map((notification) => (
<Card.Block key={notification.id}>
<Card.Header>
<Card.TitleHeader>
{notification.title}
</Card.TitleHeader>
</Card.Header>
<Card.Body>
<Card.TextSmall>
{notification.description}
</Card.TextSmall>
</Card.Body>
</Card.Block>
))
}
</Accordion>
<Accordion title={"Прочитанные"} style={{marginBottom: 20}}>
{
notifications
.filter(notification => notification.is_recited)
.map(notification => (
<Card.Block key={notification.id}>
<Card.Header>
<Card.TitleHeader>
{notification.title}
</Card.TitleHeader>
</Card.Header>
<Card.Body>
<Card.TextSmall>
{notification.description}
</Card.TextSmall>
</Card.Body>
</Card.Block>
))
}
</Accordion>
</LayoutScrollView>
)
}
export default Notification