cally/components/shared/DrawerButton.tsx

import React from "react";
import { Button, View, Text } from "react-native-ui-lib";
interface IDrawerButtonProps {
  bgColor: string;
  color: string;
  pressFunc: () => void;
  icon: React.ReactNode;
  title: string;
}
const DrawerButton = (props: IDrawerButtonProps) => {
  return (
    <Button
      onPress={props.pressFunc}
      label={props.title}
      labelStyle={{ fontSize: 14 }}
      color={props.color}
      backgroundColor="white"
      iconSource={() => (
        <View
          backgroundColor={props.bgColor}
          width={60}
          height={60}
          style={{ borderRadius: 50 }}
          centerV
          centerH
        >
          {props.icon}
        </View>
      )}
      style={{
        aspectRatio: 1,
        borderRadius: 15,
        marginBottom: 12,
        flexDirection: "column",
        justifyContent: "space-between",
        paddingVertical: 15,

        // Shadow for iOS
        shadowColor: "#000",
        shadowOffset: { width: 0, height: 2 },
        shadowOpacity: 0.3,
        shadowRadius: 10, // This will create a blurry shadow

        // Shadow for Android
        elevation: 1, 
      }}
    ></Button>
  );
};

export default DrawerButton;