From bf22da655fabfa7ab1d20079ab21227b0b5b24fc Mon Sep 17 00:00:00 2001
From: whysman <whysman@whystech.com>
Date: Sat, 22 Mar 2025 18:05:35 -0400
Subject: [PATCH] Added scrolling lists

---
 components/Status.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/components/Status.tsx b/components/Status.tsx
index 2ed8349..bbb211b 100644
--- a/components/Status.tsx
+++ b/components/Status.tsx
@@ -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}>