import Text from "@/components/ui/Text";
import React, {forwardRef} from "react";
import {Image, View, ViewProps} from "react-native";
import BackButton from "@/components/BackButton";

export interface ProblemProps extends ViewProps{
    picture: string;
    problem: string;
    description: string;
    information: string;
    isVisible?: boolean;
}

export default forwardRef<any, ProblemProps> (({className, ...Props}, ref) => {
    return (
        <View className={"gap-4 justify-between h-full" + " " + className} {...Props} ref={ref}>
            <View className="flex-row justify-between items-center p-4">
                <BackButton/>
            </View>

            <Image source={Props.picture}/>
            <Text position="center" weight="bold" size="3xl"> {Props.problem} </Text>
            <Text size="lg" position="center"> {Props.description} </Text>

            <Text size="lg" position="center"> {Props.information} </Text>
        </View>
    );
});