diff --git a/packages/react/components/Newsletter/index.mjs b/packages/react/components/Newsletter/index.mjs index bb9d26c814a..ff9d8aab744 100644 --- a/packages/react/components/Newsletter/index.mjs +++ b/packages/react/components/Newsletter/index.mjs @@ -1,5 +1,5 @@ // Dependencies -import { linkClasses, validateEmail } from '@freesewing/utils' +import { linkClasses, validateEmail, getSearchParam } from '@freesewing/utils' // Context import { LoadingStatusContext } from '@freesewing/react/context/LoadingStatus' @@ -15,6 +15,7 @@ import { NoIcon, OkIcon, SaveIcon, RightIcon, WarningIcon } from '@freesewing/re import { EmailInput } from '@freesewing/react/components/Input' import { Popout } from '@freesewing/react/components/Popout' import { IconButton } from '@freesewing/react/components/Button' +import { MiniTip } from '@freesewing/react/components/Mini' /* * Component for newsletter signup (by visitors) @@ -118,3 +119,77 @@ export const NewsletterSignup = ({ Link = false, noP = false, noTitle = false, n ) } + +/* + * Component to handle newsletter unsubscribe links + * + * @params {object} props - All React props + * @param {function} props.Link - An optional framework-specific Link component + */ +export const NewsletterUnsubscribe = ({ Link = false }) => { + if (!Link) Link = WebLink + const ehash = getSearchParam('x') + + // Hooks + const backend = useBackend() + + // State + const [gone, setGone] = useState(false) + const [error, setError] = useState(false) + + // Helper method to handle subscription + const unsubscribe = async () => { + const [status, body] = await backend.newsletterUnsubscribe(ehash) + if (status === 204 || status === 404) setGone(true) + else setError(true) + } + + if (!ehash) return
This does not seem to be a valid unsubscribe link.
+ + if (gone) + return ( + <> +This email address is no longer subscribed to the FreeSewing newsletter
+ > + ) + + if (error) + return ( + <> ++ Something went wrong. This is unexpected. Please{' '} + + Contact support + +
+ > + ) + + return ( + <> ++ To confirm you want to unsubscribe from the FreeSewing newsletter, click the button below: +
+ +Unsubscribe here {ehash}
+} diff --git a/sites/org/newsletter/unsubscribe/index.mdx b/sites/org/newsletter/unsubscribe/index.mdx new file mode 100644 index 00000000000..14c799d25b3 --- /dev/null +++ b/sites/org/newsletter/unsubscribe/index.mdx @@ -0,0 +1,14 @@ +--- +title: Unsubscribe +sidebar_label: '' +sidebar_class_name: tw-hidden +--- + +import { NewsletterUnsubscribe } from '@freesewing/react/components/Newsletter' +import Link from '@docusaurus/Link' + +