thêm chức năng Sos và thêm glustack-ui

app/(tabs)/diary.tsx

@@ -1,7 +1,7 @@
+import AlarmList from "@/components/AlarmList";
 import { Link } from "expo-router";
 import {
   Platform,
-  ScrollView,
   StyleSheet,
   Text,
   TouchableOpacity,
@@ -9,20 +9,49 @@ import {
 } from "react-native";
 import { SafeAreaView } from "react-native-safe-area-context";
 
+const alarmExample = {
+  alarms: [
+    {
+      name: "Ngập nước có cảnh báo",
+      t: 1762226488,
+      level: 1,
+      id: "0:8:1",
+    },
+    {
+      name: "Tầu cảnh báo sos",
+      t: 1762226596,
+      level: 3,
+      id: "50:15",
+    },
+    {
+      name: "Khói có cảnh báo",
+      t: 1762226589,
+      level: 1,
+      id: "0:1:1",
+    },
+    {
+      name: "Cửa có cảnh báo",
+      t: 1762226547,
+      level: 1,
+      id: "0:7:1",
+    },
+  ],
+  level: 3,
+};
+
 export default function Warning() {
   return (
     <SafeAreaView style={{ flex: 1 }}>
-      <ScrollView contentContainerStyle={styles.scrollContent}>
-        <View style={styles.container}>
-          <Text style={styles.titleText}>Nhật Ký Chuyến Đi</Text>
+      <View style={styles.container}>
+        <Text style={styles.titleText}>Nhật Ký Chuyến Đi</Text>
 
-          <Link href="/modal" asChild>
-            <TouchableOpacity style={styles.button}>
-              <Text style={styles.buttonText}>Mở Modal</Text>
-            </TouchableOpacity>
-          </Link>
-        </View>
-      </ScrollView>
+        <Link href="/modal" asChild>
+          <TouchableOpacity style={styles.button}>
+            <Text style={styles.buttonText}>Mở Modal</Text>
+          </TouchableOpacity>
+        </Link>
+        <AlarmList alarmsData={alarmExample.alarms} />
+      </View>
     </SafeAreaView>
   );
 }