Added scrolling lists

This commit is contained in:
whysman 2025-03-22 18:05:35 -04:00
parent 6eff2b311f
commit bf22da655f

View File

@ -1,7 +1,7 @@
import React, { useEffect, useState, useRef } from "react";
import useWebSocket from "react-use-websocket";
import axios from "axios";
import {Animated, Easing, ImageBackground, useColorScheme, View} from "react-native";
import {Animated, Easing, ImageBackground, ScrollView, useColorScheme, View} from "react-native";
import { Avatar, List, Button, useTheme, } from "react-native-paper";
import themes from "@/assets/themes";
import styles from "@/assets/styles";
@ -171,6 +171,7 @@ const Status: React.FC<StatusProps> = ({ id, name, image, currentStatus, setStat
<View style={styles.listContainer}>
<List.Section style={styles.listColumn}>
<List.Subheader style={[styles.listSubheader, { color: theme.colors.primary }]}>On the Way</List.Subheader>
<ScrollView>
{messages.filter(msg => msg.Status === "On the Way")
.sort((a, b) => new Date(a.Timestamp).getTime() - new Date(b.Timestamp).getTime())
.map(item => (
@ -184,9 +185,11 @@ const Status: React.FC<StatusProps> = ({ id, name, image, currentStatus, setStat
left={(props) => <Avatar.Image {...props} size={50} source={{ uri: `data:image/png;base64,${item.Image}` }} />}
/>
))}
</ScrollView>
</List.Section>
<List.Section style={styles.listColumn}>
<List.Subheader style={[styles.listSubheader, { color: theme.colors.primary }]}>Arrived</List.Subheader>
<ScrollView>
{messages.filter(msg => msg.Status === "Arrived")
.sort((a, b) => new Date(a.Timestamp).getTime() - new Date(b.Timestamp).getTime())
.map(item => (
@ -200,6 +203,7 @@ const Status: React.FC<StatusProps> = ({ id, name, image, currentStatus, setStat
left={(props) => <Avatar.Image {...props} size={50} source={{ uri: `data:image/png;base64,${item.Image}` }} />}
/>
))}
</ScrollView>
</List.Section>
</View>
<View style={styles.buttonContainer}>