Commit 15fae481 by G

add a loading props to the button component

parent d4bc002f
import type { BoxProps, VariantProps } from "@shopify/restyle"; import type { BoxProps, VariantProps } from "@shopify/restyle";
import type { Theme } from "@themes/Theme"; import type { Theme } from "@themes/Theme";
import { TouchableOpacity } from "react-native"; import { ActivityIndicator, TouchableOpacity } from "react-native";
import ButtonBase from "./bases/ButtonBase"; import ButtonBase from "./bases/ButtonBase";
import Text from "./bases/Text"; import Text from "./bases/Text";
...@@ -9,13 +9,25 @@ type Props = BoxProps<Theme> & ...@@ -9,13 +9,25 @@ type Props = BoxProps<Theme> &
VariantProps<Theme, "textVariants", "textVariants"> & { VariantProps<Theme, "textVariants", "textVariants"> & {
label: string; label: string;
onPress: () => void; onPress: () => void;
isLoading?: boolean;
}; };
const Button = ({ onPress, label, textVariants, variant, ...rest }: Props) => { const Button = ({ onPress, label, isLoading, textVariants, variant, ...rest }: Props) => {
return ( return (
<TouchableOpacity onPress={onPress}> <TouchableOpacity onPress={onPress}>
<ButtonBase variant={variant} justifyContent="center" alignItems="center" {...rest}> <ButtonBase
variant={variant}
justifyContent="center"
alignItems="center"
flexDirection={"row"}
{...rest}
gap={"m"}
>
{isLoading ? (
<ActivityIndicator color="white" />
) : (
<Text variant={textVariants}>{label}</Text> <Text variant={textVariants}>{label}</Text>
)}
</ButtonBase> </ButtonBase>
</TouchableOpacity> </TouchableOpacity>
); );
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment