Untitled

 avatar
dom
plain_text
a year ago
24 kB
1
Indexable
import React, { useState } from 'react'
import App from '@components/App'
import SEOPageHead from '@components/SEO'
import Link from '@components/Link'
import styles from './styles.css'
import KCLFullLogoLg from '@components/KCLIdentity/KCLFullLogo/KCLFullLogoLg'
import useAnalytics from '@lib/analytics'
import { encrypt, emailApiAppKey } from '@lib/cryptography'

const emailText = `
<table cellspacing="0" cellpadding="0" style="width:500px;border: 1px solid black;">
  <tbody>
    <tr>
      <td valign="top" style="width: 100%">
        <table
          cellpadding="0"
          cellspacing="0"
          width="100%"
          style="background-color: transparent; min-width: 100%"
        >
          <tbody>
            <tr>
              <td style="padding: 40px 30px 30px">
                <table cellspacing="0" cellpadding="0" style="width: 100%">
                  <tbody>
                    <tr>
                      <td>
                        <table
                          cellspacing="0"
                          cellpadding="0"
                          dir="rtl"
                          style="width: 100%"
                        >
                          <tbody>
                            <tr>
                              <td
                                valign="top"
                                dir="ltr"
                                style="width: 15%; padding-left: 4px"
                              >
                                <table
                                  cellpadding="0"
                                  cellspacing="0"
                                  width="100%"
                                  style="
                                    background-color: transparent;
                                    min-width: 100%;
                                  "
                                >
                                  <tbody>
                                    <tr>
                                      <td style="padding: 5px">
                                        <table
                                          width="100%"
                                          cellspacing="0"
                                          cellpadding="0"
                                        >
                                          <tbody>
                                            <tr>
                                              <td align="center">
                                                <a
                                                  href="https://click.email.thekrazycouponlady.com/?qs=e0363bc63812acdbe7a4a73726c265579b1cfafc55609f0a2b4c5fb1c252f115b735ea181e41d53687ba4f1911252dcd25063e338f2e3d9c493cfbf8699cfb82"
                                                  title=""
                                                  target="_blank"
                                                  data-saferedirecturl="https://www.google.com/url?q=https://click.email.thekrazycouponlady.com/?qs%3De0363bc63812acdbe7a4a73726c265579b1cfafc55609f0a2b4c5fb1c252f115b735ea181e41d53687ba4f1911252dcd25063e338f2e3d9c493cfbf8699cfb82&amp;source=gmail&amp;ust=1695930593689000&amp;usg=AOvVaw1Tt6VsrCPrrAaYo9zgdZuJ"
                                                  ><img
                                                    src="https://ci4.googleusercontent.com/proxy/vrX7dpWMiZzLhOJi6W8LmZNDThkGFX7LHI76rsK77OavLYB5ks_TliNJTi1rb0VoWP3D4OesXLix73buFBL4UcLH78f9lh7MV12GbO4JVMdpN9g2sCckWgmGiPZDyxtWBifGHENWfPBL11oG_SIbpAZHUgvHsdF2gfovYjOmOos5i0WV=s0-d-e1-ft#http://image.email.thekrazycouponlady.com/lib/fe36157075640474711c73/m/1/b3b40416-cd90-4b6a-ba84-17ea3ebee4a1.png"
                                                    height="50"
                                                    width="50"
                                                    style="
                                                      display: block;
                                                      padding: 0px;
                                                      text-align: center;
                                                      height: 50px;
                                                      width: 50px;
                                                      border: 0px;
                                                    "
                                                    class="CToWUd"
                                                    data-bit="iit"
                                                /></a>
                                              </td>
                                            </tr>
                                          </tbody>
                                        </table>
                                      </td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                              <td
                                valign="top"
                                dir="ltr"
                                style="
                                  width: 35%;
                                  padding-right: 2px;
                                  padding-left: 2px;
                                "
                              >
                                <table
                                  cellpadding="0"
                                  cellspacing="0"
                                  width="100%"
                                  style="
                                    background-color: #ffffff;
                                    min-width: 100%;
                                  "
                                >
                                  <tbody>
                                    <tr>
                                      <td style="padding: 0px">
                                        <div style="display: none"></div>
                                      </td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                              <td
                                valign="top"
                                dir="ltr"
                                style="width: 50%; padding-right: 4px"
                              >
                                <table
                                  cellpadding="0"
                                  cellspacing="0"
                                  width="100%"
                                  style="
                                    background-color: transparent;
                                    min-width: 100%;
                                  "
                                >
                                  <tbody>
                                    <tr>
                                      <td style="padding: 15px 10px 0px"></td>
                                    </tr>
                                  </tbody>
                                </table>
                              </td>
                            </tr>
                          </tbody>
                        </table>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </td>
            </tr>
          </tbody>
        </table>

        <table
          cellpadding="0"
          cellspacing="0"
          width="100%"
          style="
            min-width: 100%;
            border-top: 0px;
            border-right: 40px solid #ffffff;
            border-bottom: 0px;
            border-left: 45px solid #ffffff;
          "
        >
          <tbody>
            <tr>
              <td style="padding: 0px">
                <table width="100%" cellspacing="0" cellpadding="0">
                  <tbody>
                    <tr>
                      <td
                        align="left"
                        style="
                          font-family: Helvetica, Arial, sans-serif;
                          font-weight: bold;
                          font-size: 20px;
                          background-color: white;
                          padding-right: 10px;
                          padding-bottom: 35px;
                          color: #333;
                        "
                        nowrap=""
                      >
                        OptOut - Request Form Response
                        <br>
                      </td>
                    </tr>
                    <tr>
                      <td
                        style="
                          width: 100%;
                          font-family: Helvetica, Arial, sans-serif;
                          font-size: 14px;
                        "
                      >
                        <span style="font-weight: bold">Email:</span>
                        <a href="mailto:Kat.Davis1111@gmail.com" target="_blank"
                          >%%user_email%%</a
                        > <br>
                        <span style="font-weight: bold">Name:</span>
                        %%user_name%% <br />
                        <span style="font-weight: bold">Phone Number:</span>
                        %%user_phone%% <br />
                        <span style="font-weight: bold"
                          >Additional Information:</span
                        >
                        %%user_message%%
                        <br> <br><br><br>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </td>
            </tr>
          </tbody>
        </table>

        <table
          cellpadding="0"
          cellspacing="0"
          width="100%"
          style="
            background-color: transparent;
            border: 0px solid transparent;
            min-width: 100%;
          "
        >
          <tbody>
            <tr>
              <td style="padding: 0px">
                <div style="background-color: #fafafa">
                  <div
                    style="
                      margin: 0 auto;
                      min-width: 320px;
                      max-width: 600px;
                      word-wrap: break-word;
                      word-break: break-word;
                      background-color: #fafafa;
                    "
                  >
                    <div
                      style="
                        border-collapse: collapse;
                        display: table;
                        width: 100%;
                        background-color: #fafafa;
                      "
                    >
                      <div
                        style="
                          min-width: 320px;
                          max-width: 600px;
                          display: table-cell;
                          vertical-align: top;
                        "
                      >
                        <div
                          style="
                            background-color: transparent;
                            width: 100% !important;
                          "
                        >
                          <div
                            style="
                              border-top: 0px solid transparent;
                              border-left: 0px solid transparent;
                              border-bottom: 0px solid transparent;
                              border-right: 0px solid transparent;
                              padding-top: 15px;
                              padding-bottom: 0px;
                              padding-right: 0px;
                              padding-left: 0px;
                            "
                          >
                            <div
                              style="
                                line-height: 120%;
                                font-family: 'Helvetica Neue', Helvetica, Arial,
                                  sans-serif;
                                color: #555555;
                                padding-right: 10px;
                                padding-left: 10px;
                                padding-top: 10px;
                                padding-bottom: 30px;
                              "
                            >
                              <div
                                style="
                                  font-size: 12px;
                                  line-height: 14px;
                                  color: #555555;
                                  font-family: 'Helvetica Neue', Helvetica,
                                    Arial, sans-serif;
                                  text-align: left;
                                "
                              >
                                <p
                                  style="
                                    margin: 0;
                                    font-size: 12px;
                                    line-height: 14px;
                                    text-align: center;
                                  "
                                >
                                  <span
                                    style="
                                      color: rgb(0, 0, 0);
                                      font-size: 10px;
                                      line-height: 12px;
                                    "
                                    >Copyright 2019 Krazy Coupon Lady. All
                                    Rights reserved.
                                  </span>
                                </p>

                                <p
                                  style="
                                    margin: 0;
                                    font-size: 12px;
                                    line-height: 14px;
                                    text-align: center;
                                  "
                                ></p>

                                <p
                                  style="
                                    margin: 0;
                                    font-size: 12px;
                                    line-height: 14px;
                                    text-align: center;
                                  "
                                >
                                  <span
                                    style="
                                      color: rgb(0, 0, 0);
                                      font-size: 10px;
                                      line-height: 12px;
                                    "
                                    >Our mailing address is:</span
                                  >
                                </p>

                                <p
                                  style="
                                    margin: 0;
                                    font-size: 12px;
                                    line-height: 14px;
                                    text-align: center;
                                  "
                                >
                                  <span
                                    style="
                                      color: rgb(0, 0, 0);
                                      font-size: 10px;
                                      line-height: 12px;
                                    "
                                    >Krazy Coupon Lady</span
                                  >
                                </p>

                                <p
                                  style="
                                    margin: 0;
                                    font-size: 12px;
                                    line-height: 14px;
                                    text-align: center;
                                  "
                                >
                                  <span
                                    style="
                                      color: rgb(0, 0, 0);
                                      font-size: 10px;
                                      line-height: 12px;
                                    "
                                    >P.O. Box 836, Eagle, ID, 83616, United
                                    States</span
                                  >
                                </p>

                                <p
                                  style="
                                    margin: 0;
                                    font-size: 12px;
                                    line-height: 14px;
                                    text-align: center;
                                  "
                                ></p>

                                <p
                                  style="
                                    margin: 0;
                                    font-size: 12px;
                                    line-height: 14px;
                                    text-align: center;
                                  "
                                ></p>

                                <p
                                  style="
                                    margin: 0;
                                    font-size: 12px;
                                    line-height: 14px;
                                    text-align: center;
                                  "
                                ></p>

                                <p
                                  style="
                                    margin: 0;
                                    font-size: 12px;
                                    line-height: 14px;
                                    text-align: center;
                                  "
                                ></p>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </td>
            </tr>
          </tbody>
        </table>
      </td>
    </tr>
  </tbody>
</table>
`

const DoNotSellOrShareMyInfo = () => {
  const analytics = useAnalytics()
  const [errorText, setErrorText] = useState(null)
  const [successText, setSuccessText] = useState(null)
  const [isButtonDisabled, setIsButtonDisabled] = useState(false)

  const submitData = async event => {
    event?.preventDefault()
    const form = event?.target
    const rawdata = new FormData(form)
    const data = {
      fullname: rawdata.get('fullname'),
      email: rawdata.get('email'),
      phone: rawdata.get('phone'),
      request: rawdata.get('request')
    }

 

    if (!data.fullname || !data.email || !data.phone) {
      setErrorText('Please fill out all fields.')
      return
    }
   if (data.fullname || data.email || data.phone) {
      setSuccessText('Thank you for submitting.')
      return
    }
    setIsButtonDisabled(true)

    analytics.track('opt_out_privacy_policy', {
      data: data
    })

    const emailTextReplace = emailText
      .replace('%%user_email%%', data.email)
      .replace('%%user_name%%', data.fullname)
      .replace('%%user_phone%%', data.phone)
      .replace('%%user_message%%', data.request)

    const encryptedKey = encrypt(emailApiAppKey)

    const res = await fetch('/api/sendEmail', {
      body: JSON.stringify({
        to: 'privacy@thekrazycouponlady.com',
        from: 'noreply@thekrazycouponlady.com',
        subject: 'Request to opt out of privacy policy',
        html: emailTextReplace
      }),
      headers: {
        'Content-Type': 'application/json',
        'x-api-key': encryptedKey
      },
      method: 'POST'
    })

    return false
  }

  return (
    <App pageData={{ name: 'Privacy Policy' }}>
      <div>
        <style jsx>{styles}</style>
        <SEOPageHead
          pageDescription={'Privacy Policy'}
          pageIndexablityMask={SEOPageHead.INDEXABILITY_ALL}
          pageCanonicalLink={'/do-not-sell-or-share-my-info'}
          pageTitle={'Privacy Policy'}
        />
        <div className="do-not-sell-container">
          <div className="main-text">
            <h1>DO NOT SELL OR SHARE MY INFO</h1>
            <p>
              Welcome, and thanks for visiting The Krazy Coupon Lady! Please
              complete the form below to submit your request and we will respond
              as soon as possible.
            </p>
            <p>
              <strong>California Residents </strong>
              <br />
              Under the California Consumer Privacy Act of 2018 (CCPA),
              California residents can request what personal information we may
              collect from you about you or a device you use to access KCL’s
              website or mobile application, and how we may use, disclose or
              sell that information. You have the right to choose whether your
              collected personal information is sold.
            </p>
            <p>
              <strong>Virginia Residents </strong>
              <br />
              “Do Not Sell My Info” and “Do Not Share My Info” Notice to
              California and/or Virginia Residents: If you are a California
              and/or Virginia resident, you have the right to direct The Krazy
              Coupon Lady not to sell your personal information. This request
              form may also be used to opt-out of sharing personal information
              with third partys (other than third party vendors) and/or
              cooperative database(s). To exercise your right, please complete
              the form below or contact us via email at{' '}
              <Link href="mailto:privacy@thekrazycouponlady.com">
                <span className="link-child privacy-black">
                  privacy@thekrazycouponlady.com
                </span>
              </Link>{' '}
              with your name, email address, phone number and information about
              whether you'd like to opt out or request your information. For
              more information about our privacy practices, please refer to our{' '}
              <Link
                className="privacy-black"
                href="/krazy-coupon-lady-privacy-policy"
              >
                Privacy Policy
              </Link>
              .
            </p>
          </div>
          <p>
            Opt-Out State <br /> - California <br />- Virginia{' '}
          </p>
          <form onSubmit={submitData}>
            <br />
            <label>
              Full Name <br />
            </label>
            <input type="text" id="fullname" name="fullname" />
            <br />
            <label>
              Email Address <br />
            </label>
            <input type="email" id="email" name="email" />
            <br />
            <label>
              Phone Number <br />
            </label>
            <input type="tel" id="phone" name="phone" />
            <br />
            <label>
              Request Information <br />
            </label>
            <textarea id="request" name="request"></textarea>
            <br />
            <button
              type="submit"
              className="submit-button"
              disabled={isButtonDisabled}
            >
              Submit
            </button>
            {errorText && <div className="error-message">{errorText}</div>}
            {!errorText && successText && (
              <div className="success-message">{successText}</div>
            )}
          </form>
          <br />
        </div>
      </div>
    </App>
  )
}
export default DoNotSellOrShareMyInfo




<button
              type="submit"
              className="submit-button"
              disabled={isButtonDisabled}
            >
              Submit
            </button>

setErrorText('Thank you for submitting.')
    setIsButtonDisabled(true)