66 lines
1.3 KiB
TypeScript
66 lines
1.3 KiB
TypeScript
import React, { useEffect } from "react";
|
|
import { Snackbar, Portal } from "react-native-paper";
|
|
import { StyleSheet, Text } from "react-native";
|
|
|
|
interface CustomSnackbarProps {
|
|
message: string;
|
|
bgColor: string;
|
|
textColor: string;
|
|
duration: number;
|
|
visible: boolean;
|
|
onDismiss: () => void;
|
|
}
|
|
|
|
const CustomSnackbar: React.FC<CustomSnackbarProps> = ({
|
|
message,
|
|
bgColor,
|
|
textColor,
|
|
duration,
|
|
visible,
|
|
onDismiss,
|
|
}) => {
|
|
useEffect(() => {
|
|
if (visible) {
|
|
const timer = setTimeout(() => {
|
|
onDismiss();
|
|
}, duration * 1000);
|
|
|
|
return () => clearTimeout(timer);
|
|
}
|
|
}, [visible, duration, onDismiss]);
|
|
|
|
return (
|
|
<Snackbar
|
|
visible={visible}
|
|
onDismiss={onDismiss}
|
|
style={[
|
|
styles.snackbar,
|
|
{ backgroundColor: bgColor, zIndex: 999, elevation: 999 },
|
|
]}
|
|
duration={Snackbar.DURATION_SHORT}
|
|
>
|
|
<Text style={{ color: textColor, ...styles.message }}>{message}</Text>
|
|
</Snackbar>
|
|
);
|
|
};
|
|
|
|
const styles = StyleSheet.create({
|
|
message: {
|
|
fontStyle: "normal",
|
|
fontWeight: "bold",
|
|
},
|
|
success: {
|
|
color: "#242C3B",
|
|
},
|
|
error: {
|
|
color: "#D51D10",
|
|
},
|
|
snackbar: {
|
|
borderRadius: 5,
|
|
marginBottom: 60,
|
|
color: "#242C3B",
|
|
},
|
|
});
|
|
|
|
export default CustomSnackbar;
|