import { FaRegEdit } from "react-icons/fa"
import { Button } from "./ui/button"
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "./ui/dialog"
import { Field, Stack, Text, Textarea } from "@chakra-ui/react"

function TermsAndConditionsAddModel() {
    return (

        <DialogRoot placement="center">
            <DialogTrigger asChild>
                {/* <Button bg={"transparent"} size="sm">
                    <MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
                </Button> */}
                <Button bgColor={'#EEEEEE'} pl={3} pr={3}> <FaRegEdit color="#000" style={{height:'14px', width:'14px'}}/> <Text color={"#000"} mt={1}>Edit</Text></Button>

            </DialogTrigger>

            <DialogContent
                bg={"#fff"}
                w={{ base: "90%", md: "400px" }}
                maxW="90vw"
                h="auto"
                p={4}
            >
                <DialogHeader bg="white" py={3} >
                    <DialogTitle alignSelf="center" color="black">Edit</DialogTitle>
                </DialogHeader>

                <DialogBody bg="white">
                    <Stack  >

                        <Field.Root>
                            <Field.Label color="black" pt={2}>TermsAndConditions</Field.Label>
                            <Textarea placeholder="" bgColor="#EEEEEE" color="black" border="none" pl={2} pt={2}/>
                        </Field.Root>
                    </Stack>
                </DialogBody>
                <DialogFooter display="flex" justifyContent="center" pt={"5"}>
                    <Button w="100%" bg="#02A0A0" color={"#fff"}>
                        Save
                    </Button>
                </DialogFooter>

                <DialogCloseTrigger color="black" />
            </DialogContent>
        </DialogRoot >

    )
}

export default TermsAndConditionsAddModel