102 lines
3.4 KiB
JavaScript
102 lines
3.4 KiB
JavaScript
// Dependencies
|
|
import { linkClasses } from '@freesewing/utils'
|
|
|
|
// Context
|
|
import { LoadingStatusContext } from '@freesewing/react/context/LoadingStatus'
|
|
import { ModalContext } from '@freesewing/react/context/Modal'
|
|
|
|
// Hooks
|
|
import React, { useContext } from 'react'
|
|
import { useAccount } from '@freesewing/react/hooks/useAccount'
|
|
import { useBackend } from '@freesewing/react/hooks/useBackend'
|
|
|
|
// Components
|
|
import { Link as WebLink } from '@freesewing/react/components/Link'
|
|
import { BackIcon, NoIcon } from '@freesewing/react/components/Icon'
|
|
import { IconButton } from '@freesewing/react/components/Button'
|
|
import { ModalWrapper } from '@freesewing/react/components/Modal'
|
|
|
|
/**
|
|
* A component to manage the user's options to restrict processing of their data
|
|
*
|
|
* @component
|
|
* @param {object} props - All component props
|
|
* @param {React.Component} props.Link - A framework specific Link component for client-side routing
|
|
* @returns {JSX.Element}
|
|
*/
|
|
export const Restrict = ({ Link = false }) => {
|
|
if (!Link) Link = WebLink
|
|
|
|
// Hooks
|
|
const backend = useBackend()
|
|
const { signOut, account } = useAccount()
|
|
|
|
// Context
|
|
const { setLoadingStatus } = useContext(LoadingStatusContext)
|
|
const { setModal, clearModal } = useContext(ModalContext)
|
|
|
|
// Helper method to restrict the account
|
|
const restrictAccount = async () => {
|
|
setLoadingStatus([true, 'Talking to the backend'])
|
|
const [status] = await backend.restrictAccount()
|
|
if (status === 200) {
|
|
setLoadingStatus([true, 'Done. Consider yourself restrcited.', true, true])
|
|
signOut()
|
|
} else setLoadingStatus([true, 'An error occured. Please report this', true, false])
|
|
}
|
|
|
|
if (account.control === 5)
|
|
return (
|
|
<>
|
|
<p>This button is red for a reason.</p>
|
|
<IconButton onClick={restrictAccount} color="error">
|
|
<NoIcon />
|
|
Remove your FreeSewing account
|
|
</IconButton>
|
|
</>
|
|
)
|
|
|
|
return (
|
|
<div className="tw:w-full">
|
|
<p>
|
|
The GDPR guarantees{' '}
|
|
<Link href="/docs/about/rights/#the-right-to-restrict-processing" className={linkClasses}>
|
|
your right to restrict processing
|
|
</Link>{' '}
|
|
of your personal data.
|
|
</p>
|
|
<p>This will disable your account, but not remove any data.</p>
|
|
<IconButton
|
|
onClick={() =>
|
|
setModal(
|
|
<ModalWrapper keepOpenOnClick>
|
|
<div className="tw:text-center tw:w-full tw:max-w-xl">
|
|
<h2>Proceed with caution</h2>
|
|
<p>
|
|
While no data will be removed, this will disable your account. Furthermore, you
|
|
can not undo this on your own, but will have to contact support when you want to
|
|
restore access to your account.
|
|
</p>
|
|
<IconButton onClick={restrictAccount} color="error" className="tw:mx-auto">
|
|
<NoIcon stroke={3} />
|
|
Restrict processing of your FreeSewing data
|
|
</IconButton>
|
|
<IconButton
|
|
onClick={clearModal}
|
|
color="primary"
|
|
className="tw:mx-auto tw:daisy-btn-outline tw:mt-4"
|
|
>
|
|
<BackIcon />
|
|
Back to safety
|
|
</IconButton>
|
|
</div>
|
|
</ModalWrapper>
|
|
)
|
|
}
|
|
>
|
|
<NoIcon stroke={3} />
|
|
Restrict processing of your FreeSewing data
|
|
</IconButton>
|
|
</div>
|
|
)
|
|
}
|