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&source=gmail&ust=1695930593689000&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)