Rebeka Dekany
d751b88e6b
* Remove icons folder * Create folders for badge, button, and dropdown components * Remove Bootstrap 5 from test * Rename `getBootstrap5Breakpoint` to `getBootstrapBreakpoint` * Cleanup and update BS 5 comments * Move components to the shared folder * Rename `tooltips-bs5` to `tooltip` * Remove `-bs5` suffix * Fix path * Delete BS3 version file * Rename `_form_marketing-bootstrap-5` to `_form_marketing` * Delete BS3 version file * Rename `_contact_general_modal-marketing-bootstrap-5` to `_contact_general_modal-marketing` * Delete BS3 version file * Rename `_contact_modal-marketing-bootstrap-5` to `_contact_modal-marketing` * Delete BS3 version file * Rename `thin-footer-bootstrap-5` to `thin-footer` * Delete BS3 version file * Rename `language-picker-bootstrap-5` to `language-picker` * Rename `fat-footer-react-bootstrap-5` to `fat-footer-react` * Delete BS3 version file * Rename `navbar-marketing-bootstrap-5` to `navbar-marketing` * Rename `navbar-marketing-react-bootstrap-5` to `navbar-marketing-react` * Delete BS3 version file * Rename `layout-website-redesign-cms-bootstrap-5` to `layout-website-redesign-cms` * Source format * Fix path GitOrigin-RevId: cf0f5db7c84cf545c69213dcc271d9ff17fe5db7
111 lines
2.6 KiB
TypeScript
111 lines
2.6 KiB
TypeScript
import { useState, Dispatch, SetStateAction } from 'react'
|
|
import { useTranslation, Trans } from 'react-i18next'
|
|
import getMeta from '../../../../utils/meta'
|
|
import LeaveModalForm, { LeaveModalFormProps } from './modal-form'
|
|
import OLButton from '@/shared/components/ol/ol-button'
|
|
import {
|
|
OLModalBody,
|
|
OLModalFooter,
|
|
OLModalHeader,
|
|
OLModalTitle,
|
|
} from '@/shared/components/ol/ol-modal'
|
|
|
|
type LeaveModalContentProps = {
|
|
handleHide: () => void
|
|
inFlight: boolean
|
|
setInFlight: Dispatch<SetStateAction<boolean>>
|
|
}
|
|
|
|
function LeaveModalContentBlock({
|
|
setInFlight,
|
|
isFormValid,
|
|
setIsFormValid,
|
|
}: LeaveModalFormProps) {
|
|
const { t } = useTranslation()
|
|
const { isOverleaf } = getMeta('ol-ExposedSettings')
|
|
const hasPassword = getMeta('ol-hasPassword')
|
|
|
|
if (isOverleaf && !hasPassword) {
|
|
return (
|
|
<p>
|
|
<b>
|
|
<a href="/user/password/reset">{t('delete_acct_no_existing_pw')}</a>
|
|
</b>
|
|
</p>
|
|
)
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<LeaveModalForm
|
|
setInFlight={setInFlight}
|
|
isFormValid={isFormValid}
|
|
setIsFormValid={setIsFormValid}
|
|
/>
|
|
<p>
|
|
<Trans
|
|
i18nKey="if_you_need_to_delete_your_writefull_account"
|
|
components={{
|
|
a: (
|
|
// eslint-disable-next-line jsx-a11y/anchor-has-content
|
|
<a
|
|
href="https://my.writefull.com/account"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
/>
|
|
),
|
|
}}
|
|
/>
|
|
</p>
|
|
</>
|
|
)
|
|
}
|
|
|
|
function LeaveModalContent({
|
|
handleHide,
|
|
inFlight,
|
|
setInFlight,
|
|
}: LeaveModalContentProps) {
|
|
const { t } = useTranslation()
|
|
const [isFormValid, setIsFormValid] = useState(false)
|
|
|
|
return (
|
|
<>
|
|
<OLModalHeader closeButton>
|
|
<OLModalTitle>{t('delete_account')}</OLModalTitle>
|
|
</OLModalHeader>
|
|
|
|
<OLModalBody>
|
|
<p>
|
|
<Trans
|
|
i18nKey="delete_account_warning_message_3"
|
|
components={{ strong: <strong /> }}
|
|
/>
|
|
</p>
|
|
<LeaveModalContentBlock
|
|
setInFlight={setInFlight}
|
|
isFormValid={isFormValid}
|
|
setIsFormValid={setIsFormValid}
|
|
/>
|
|
</OLModalBody>
|
|
|
|
<OLModalFooter>
|
|
<OLButton disabled={inFlight} onClick={handleHide} variant="secondary">
|
|
{t('cancel')}
|
|
</OLButton>
|
|
|
|
<OLButton
|
|
form="leave-form"
|
|
type="submit"
|
|
variant="danger"
|
|
disabled={inFlight || !isFormValid}
|
|
>
|
|
{inFlight ? <>{t('deleting')}…</> : t('delete')}
|
|
</OLButton>
|
|
</OLModalFooter>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default LeaveModalContent
|