Refresh control dan Blockir user di forum
### No Issue
This commit is contained in:
59
components/_ShareComponent/SkeletonCustom.tsx
Normal file
59
components/_ShareComponent/SkeletonCustom.tsx
Normal file
@@ -0,0 +1,59 @@
|
||||
// components/CustomSkeleton.tsx
|
||||
import React from "react";
|
||||
import { View, StyleProp, ViewStyle, DimensionValue } from "react-native";
|
||||
import { MotiView } from "moti";
|
||||
import { AccentColor, MainColor } from "@/constants/color-palet";
|
||||
|
||||
interface CustomSkeletonProps {
|
||||
isLoading?: boolean;
|
||||
style?: StyleProp<ViewStyle>;
|
||||
width?: DimensionValue;
|
||||
height?: DimensionValue;
|
||||
radius?: number;
|
||||
}
|
||||
|
||||
const CustomSkeleton: React.FC<CustomSkeletonProps> = ({
|
||||
isLoading = true,
|
||||
style,
|
||||
width = "100%",
|
||||
height = 16,
|
||||
radius = 8,
|
||||
}) => {
|
||||
if (!isLoading) return null;
|
||||
|
||||
return (
|
||||
<View
|
||||
style={[
|
||||
{
|
||||
width,
|
||||
height,
|
||||
borderRadius: radius,
|
||||
backgroundColor: AccentColor.darkblue,
|
||||
overflow: "hidden",
|
||||
position: "relative",
|
||||
},
|
||||
style,
|
||||
]}
|
||||
>
|
||||
<MotiView
|
||||
from={{ translateY: -100 }}
|
||||
animate={{ translateY: 100 }}
|
||||
transition={{
|
||||
duration: 1200,
|
||||
repeat: Infinity,
|
||||
type: "timing",
|
||||
}}
|
||||
style={{
|
||||
position: "absolute",
|
||||
left: 0,
|
||||
right: 0,
|
||||
height: 100,
|
||||
backgroundColor: MainColor.soft_darkblue,
|
||||
borderRadius: 4,
|
||||
}}
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
export default CustomSkeleton;
|
||||
Reference in New Issue
Block a user