Deskripsi: - update loading saat aksi tambah dan edit pada fitur pengumuman, diskusi umum dan diskusi divisi No Issues
51 lines
1.0 KiB
TypeScript
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",
|
|
},
|
|
});
|