import { FC, ReactNode } from "react";
import { modals } from "@mantine/modals";

type Props = {
    defaultValue?: string;
    onComplete: (value: string) => void;
    getChildren: (startEditing: () => void) => ReactNode;
    modalTitle?: string;
};

const InPlaceInputMobile: FC<Props> = ({
    onComplete,
    getChildren,
    modalTitle = "",
    defaultValue = "",
}) => {
    const onStartCreating = () => {
        modals.openContextModal({
            modal: "enterNameModal",
            title: modalTitle,
            withCloseButton: true,
            innerProps: {
                onComplete,
                defaultValue,
            },
        });
    };

    return getChildren(onStartCreating);
};

export default InPlaceInputMobile;