Files
mobile-darmasaba/components/loadingOverlay.tsx
amaliadwiy 588df062f1 upd: loading overlay
Deskripsi:
- update loading saat aksi tambah dan edit pada fitur pengumuman, diskusi umum dan diskusi divisi

No Issues
2026-01-19 16:36:37 +08:00

51 lines
1.0 KiB
TypeScript

import React from "react";
import { View, ActivityIndicator, StyleSheet, Text } from "react-native";
type Props = {
visible: boolean;
text?: string;
};
export default function LoadingOverlay({
visible,
text = "Loading...",
}: Props) {
if (!visible) return null;
return (
<View style={styles.overlay}>
<View style={styles.box}>
<ActivityIndicator size="small" color="#2c3e50" />
<Text style={styles.text}>{text}</Text>
</View>
</View>
);
}
const styles = StyleSheet.create({
overlay: {
...StyleSheet.absoluteFillObject,
backgroundColor: "rgba(0,0,0,0.35)",
justifyContent: "center",
alignItems: "center",
zIndex: 9999,
},
box: {
paddingVertical: 5,
paddingHorizontal: 15,
backgroundColor: "#fff",
borderRadius: 8,
alignItems: "center",
elevation: 6, // Android
shadowColor: "#000", // iOS
shadowOpacity: 0.25,
shadowRadius: 5,
shadowOffset: { width: 0, height: 4 },
},
text: {
marginTop: 5,
fontSize: 14,
color: "#2c3e50",
},
});