import React from "react";
import { View } from "react-native";
import {Drawer, useTheme} from "react-native-paper";
import styles from "@/assets/styles";

interface DrawerMenuProps {
    isMenuActive: boolean;
    onClose: () => void;
    toggleAbout: () => void;
    togglePrivacy: () => void;
    toggleBug: () => void;
    toggleProfile: () => void;
    toggleLocation: () => void;
}

const DrawerMenu: React.FC<DrawerMenuProps> = ({ isMenuActive, onClose, toggleAbout, togglePrivacy, toggleBug, toggleProfile, toggleLocation }) => {
    const theme = useTheme();
    if (!isMenuActive) {
        return null;
    }
    return (
        <View style={[styles.drawerContainer, { backgroundColor: theme.colors.background }]}>
            <Drawer.Section>
                <Drawer.Item
                    label="Profile"
                    onPress={() => {
                        toggleProfile();
                        onClose();
                    }}
                />
                <Drawer.Item
                    label="Location"
                    onPress={() => {
                        toggleLocation();
                        onClose();
                    }}
                />
            </Drawer.Section>
            <Drawer.Section>
                <Drawer.Item
                    label="About Us"
                    onPress={() => {
                        toggleAbout();
                        onClose();
                    }}
                />
                <Drawer.Item
                    label="Privacy Policy"
                    onPress={() => {
                        togglePrivacy();
                        onClose();
                    }}
                />
                <Drawer.Item
                    label="Report a Bug"
                    onPress={() => {
                        toggleBug();
                        onClose();
                    }}
                />
            </Drawer.Section>
        </View>
    );
};

export default DrawerMenu;