import React from "react";
import { ActivityIndicator } from "react-native";
import { useColors } from "../commons";
import { View } from "../components";
import { StyledProps } from "./Styled";

export type SpinnerProps = StyledProps & {
  size?: number;
  color?: string;
};

export const Spinner = (props: SpinnerProps) => {
  const colors = useColors();

  return (
    <View
      allCenter
      {...props}
      style={{ transform: [{ scale: (props.size || 20) / 20 }] }}
    >
      <ActivityIndicator color={props.color || colors.colorApp} />
    </View>
  );
};