import {
    type FC
} from "react";
import {
    ScrollView,
    View
} from "react-native";
import type IPageContainerProps from "./type";
import stylesheet from "./stylesheet";
import {
    NCoreUIKitTheme
} from "../../core/hooks";

const PageContainer: FC<IPageContainerProps> = ({
    backgroundColor = "default" as keyof NCoreUIKit.ContainerContentColors,
    isScrollable = false,
    scrollViewStyle,
    scrollViewProps,
    children,
    style,
    ...props
}) => {
    const {
        colors,
        spaces
    } = NCoreUIKitTheme.useContext();

    const renderScrollview = () => {
        if(style) {
            console.error("Hey!. You make wrong things. If you must be use isScrollable={true}, you must be use scrollViewStyle. Do not use style prop for this case.");
        }

        if(props) {
            console.error("Hey!. You make wrong things. If you must be use isScrollable={true}, you must be use scrollViewProps. Do not use default view props for this case.");
        }

        return <ScrollView
            {...scrollViewProps}
            contentContainerStyle={[
                {
                    padding: spaces.spacingMd
                },
                scrollViewProps?.contentContainerStyle
            ]}
            style={[
                {
                    backgroundColor: colors.content.container[backgroundColor]
                },
                stylesheet.container,
                scrollViewStyle
            ]}
        >
            {children}
        </ScrollView>;
    };

    const renderView = () => {
        if(scrollViewStyle) {
            console.error("Hey!. You make wrong things. If you must be use isScrollable={false}, you must be use style. Do not use scrollViewStyle prop for this case.");
        }

        if(scrollViewProps) {
            console.error("Hey!. You make wrong things. If you must be use isScrollable={false}, you musn't use scrollViewProps.");
        }

        return <View
            {...props}
            style={[
                {
                    backgroundColor: colors.content.container[backgroundColor],
                    padding: spaces.spacingMd
                },
                stylesheet.container,
                style
            ]}
        >
            {children}
        </View>;
    };

    return isScrollable ? renderScrollview() : renderView();
};
export default PageContainer;
