import {jsx,jsxs}from'react/jsx-runtime';import {useState,useRef}from'react';import {useToast,ChakraProvider,Box,Text,Link,Textarea,Button}from'@chakra-ui/react';import {Formik,Form}from'formik';import {contactUsSchema}from'../Validation/Schema.js';import {ToastContainer}from'react-toastify';import emailjs from'emailjs-com';import {config}from'../config/env-config.js';// import Editor from '../components/editor';
const links = () => [];
function News() {
  const [sentFeedback, setSentFeedback] = useState(false);
  const {
    EMAILJS_SERVICE_ID,
    EMAILJS_TEMPLATE_ID_FEEDBACK,
    EMAILJS_USER_ID
  } = config;
  const toast = useToast();
  const form = useRef();
  const experiences = [{
    title: 'Changing or canceling an experience'
  }, {
    title: 'Experience cost'
  }, {
    title: 'Experience quality & communication'
  }, {
    title: 'Finding or booking an experience'
  }, {
    title: 'Hosting an experience'
  }, {
    title: ' Online Experiences'
  }, {
    title: 'Places & guidebooks'
  }, {
    title: 'Other'
  }];
  const hosting = [{
    title: 'Resortifi Categories'
  }, {
    title: 'Becoming a host'
  }, {
    title: 'Getting help'
  }, {
    title: 'Getting paid'
  }, {
    title: 'Host standards'
  }, {
    title: 'Managing my calendar'
  }, {
    title: 'Managing my listing'
  }, {
    title: 'Managing my reservations'
  }, {
    title: 'Messaging'
  }, {
    title: 'My account or profile'
  }, {
    title: 'Reviews'
  }, {
    title: 'Setting pricing'
  }, {
    title: 'Superhost'
  }, {
    title: 'Other'
  }];
  const traveling = [{
    title: 'Booking a trip'
  }, {
    title: 'Finding a place'
  }, {
    title: 'Getting help'
  }, {
    title: 'Messaging'
  }, {
    title: 'My account or profile'
  }, {
    title: 'Reviews'
  }, {
    title: 'Paying for my trip'
  }, {
    title: 'Pricing'
  }, {
    title: 'Other'
  }];
  const sendEmail = (e, values) => {
    e.preventDefault();
    if (values) {
      const emailParms = {
        feedbackOptions: values.feedbackOptions,
        feedbackFeature: values.feedbackFeature,
        feedbackDetails: values.feedbackDetails
      };
      emailjs.send(EMAILJS_SERVICE_ID, EMAILJS_TEMPLATE_ID_FEEDBACK, emailParms, EMAILJS_USER_ID).then(result => {
        toast({
          title: 'Feedback sent Successfully!',
          duration: 1000,
          status: 'success',
          isClosable: true
        });
        setSentFeedback(true);
        console.log(result.text, 'email is send ');
      }, error => {
        toast({
          title: 'Feedback not sent!',
          duration: 1000,
          status: 'error',
          isClosable: true
        });
        console.log(error.text, 'email is not send');
      });
    }
  };
  return jsx(ChakraProvider, {
    children: jsx(Box, {
      w: '60%',
      margin: 'auto',
      pt: '50px',
      marginTop: '10px',
      children: jsxs(Box, {
        display: 'flex',
        justifyContent: 'space-between',
        children: [jsx(Box, {
          w: '55%',
          children: sentFeedback ? jsxs(Box, {
            children: [jsx(Box, {
              fontSize: '2rem',
              fontWeight: '600',
              color: '#222222',
              mb: '60px',
              children: "Thanks for your feedback!"
            }), jsxs(Text, {
              fontSize: '1rem',
              lineHeight: '1.5rem',
              mb: '30px',
              children: ["We appreciate you sharing your ideas and comments. If you need help resolving a problem, feel free to", ' ', jsx(Link, {
                href: "/contact-us",
                fontWeight: '600',
                textDecoration: 'underline !important',
                children: "contact us."
              })]
            }), jsxs(Text, {
              children: ["Continue", ' ', jsx(Link, {
                href: "https://resortifi.com/",
                fontWeight: '600',
                textDecoration: 'underline !important',
                children: "exploring Resortifi"
              }), ' ', "or visit our", ' ', jsx(Link, {
                href: "/",
                fontWeight: '600',
                textDecoration: 'underline !important',
                children: "Help Center."
              })]
            })]
          }) : jsxs(Box, {
            children: [jsx(Box, {
              fontSize: '2rem',
              fontWeight: '600',
              color: '#222222',
              mb: '60px',
              children: "Share your feedback"
            }), jsx(Text, {
              fontSize: '1rem',
              lineHeight: '1.5rem',
              mb: '30px',
              children: "Thanks for sending us your ideas, issues, or appreciations. We can\u2019t respond individually, but we\u2019ll pass it on to the teams who are working to help make Resortifi better for everyone."
            }), jsxs(Text, {
              children: ["If you do have a specific question, or need help resolving a problem, you can visit our", ' ', jsx(Link, {
                href: "/",
                fontWeight: '600',
                textDecoration: 'underline !important',
                children: "Help Center"
              }), ' ', "or", ' ', jsx(Link, {
                href: "/contact-us",
                fontWeight: '600',
                textDecoration: 'underline !important',
                children: "contact us"
              }), ' ', "to connect with our support team."]
            }), jsx(Box, {
              children: jsxs(Box, {
                className: "max-w-[1160px] mx-auto px-[5%] lg:px-0 lg:w-[90%]",
                children: [jsx(ToastContainer, {}), jsx(Box, {
                  className: "w-full",
                  children: jsx(Box, {
                    className: "w-full",
                    children: jsx(Formik, {
                      initialValues: {
                        feedbackOptions: '',
                        feedbackFeature: '',
                        feedbackDetails: ''
                      },
                      validationSchema: contactUsSchema,
                      onSubmit: e => {},
                      children: ({
                        touched,
                        errors,
                        values,
                        handleSubmit,
                        handleChange,
                        isSubmitting,
                        setFieldValue,
                        setSubmitting
                      }) => jsxs(Form, {
                        ref: form,
                        className: "mt-4",
                        onSubmit: e => {
                          sendEmail(e, values);
                        },
                        children: [jsx(Box, {
                          className: "mb-4",
                          children: jsxs(Box, {
                            className: "mb-4 text-[13px]",
                            children: [jsx("label", {
                              className: "text-[0.9rem] text-gray-500",
                              children: "What's your feedback about?"
                            }), jsxs("select", {
                              name: "feedbackOptions",
                              id: "feedbackOptions",
                              className: "mt-2 block w-full py-1.5 px-3 text-sm text-gray-800 font-light border border-gray-300 rounded bg-transparent focus:border-[#3182ce] focus:outline-none",
                              value: values.feedbackOptions,
                              onChange: handleChange,
                              children: [jsx("option", {
                                children: "Please select"
                              }), jsx("option", {
                                children: "Experiences"
                              }), jsx("option", {
                                children: "Hosting"
                              }), jsx("option", {
                                children: "Traveling"
                              })]
                            })]
                          })
                        }), values.feedbackOptions ? jsx(Box, {
                          className: "mb-4",
                          children: jsxs(Box, {
                            className: "mb-4 text-[13px]",
                            children: [jsx("label", {
                              className: "text-[0.9rem] text-gray-500",
                              children: "What feedback topic or feature?"
                            }), jsx("select", {
                              name: "feedbackFeature",
                              id: "feedbackFeature",
                              className: "mt-2 block w-full py-1.5 px-3 text-sm text-gray-800 font-light border border-gray-300 rounded bg-transparent focus:border-[#3182ce] focus:outline-none",
                              value: values.feedbackFeature,
                              onChange: handleChange,
                              children: values?.feedbackOptions == 'Experiences' ? experiences.map((exp, i) => {
                                return jsx("option", {
                                  children: exp.title
                                }, i);
                              }) : values?.feedbackOptions == 'Hosting' ? hosting.map((exp, i) => {
                                return jsx("option", {
                                  children: exp.title
                                }, i);
                              }) : values?.feedbackOptions == 'Traveling' ? traveling.map((exp, i) => {
                                return jsx("option", {
                                  children: exp.title
                                }, i);
                              }) : null
                            })]
                          })
                        }) : null, values?.feedbackFeature ? jsx(Box, {
                          className: "mb-4",
                          children: jsxs(Box, {
                            className: "mb-4 text-[13px]",
                            children: [jsx("label", {
                              className: "text-[0.9rem] text-gray-500",
                              children: "Add details"
                            }), jsx(Textarea, {
                              height: '200px',
                              name: "feedbackDetails",
                              id: "feedbackDetails",
                              value: values.feedbackDetails,
                              onChange: handleChange,
                              placeholder: "Write a feedback detail ..."
                            })]
                          })
                        }) : null, values.feedbackFeature ? jsx(Button, {
                          type: "submit",
                          id: "contact-us",
                          disabled: isSubmitting,
                          padding: '14px 24px',
                          fontSize: '16px',
                          fontWeight: '500',
                          textAlign: 'center',
                          borderRadius: '8px',
                          backgroundColor: 'transparent',
                          border: '1px solid',
                          children: isSubmitting ? jsxs("span", {
                            children: [jsx("i", {
                              className: "fa fa-spinner fa-spin"
                            }), ' ', "Sending..."]
                          }) : 'Submit'
                        }) : null]
                      })
                    })
                  })
                })]
              })
            })]
          })
        }), jsxs(Box, {
          w: '25%',
          children: [jsx(Box, {
            fontSize: '1.375rem',
            lineHeight: '1.625rem',
            fontWeight: '600',
            mb: '10px',
            children: "Need to get in touch?"
          }), jsx(Text, {
            children: "We\u2019ll start with some questions and get you to the right place."
          }), jsx(Link, {
            href: "/contact-us",
            children: jsx(Button, {
              padding: '14px 24px',
              fontSize: '16px',
              fontWeight: '500',
              textAlign: 'center',
              borderRadius: '8px',
              backgroundColor: 'transparent',
              border: '1px solid',
              children: "Contact us"
            })
          })]
        })]
      })
    })
  });
}export{News as default,links};//# sourceMappingURL=feedback.js.map
