From 71b0eb97c296c5eca6f8f89a6ccb5091ab87fad1 Mon Sep 17 00:00:00 2001 From: ilkin-overleaf <100852799+ilkin-overleaf@users.noreply.github.com> Date: Fri, 8 Apr 2022 14:01:21 +0300 Subject: [PATCH] Merge pull request #7481 from overleaf/ta-leave-modal-no-password [DeleteAccount] Handle Password-Less Users GitOrigin-RevId: b7d03d26d43b9ab7f50a199d9aabd226ac79972d --- .../components/leave/modal-content.tsx | 33 +++++++++++++++++-- .../settings/components/leave/modal-form.tsx | 2 +- .../stories/settings/leave.stories.js | 24 +++++++++++--- .../components/leave/modal-content.test.tsx | 25 ++++++++++++++ 4 files changed, 76 insertions(+), 8 deletions(-) diff --git a/services/web/frontend/js/features/settings/components/leave/modal-content.tsx b/services/web/frontend/js/features/settings/components/leave/modal-content.tsx index 91655cd2a9..f10111c1ef 100644 --- a/services/web/frontend/js/features/settings/components/leave/modal-content.tsx +++ b/services/web/frontend/js/features/settings/components/leave/modal-content.tsx @@ -1,7 +1,8 @@ import { useState, Dispatch, SetStateAction } from 'react' import { Modal, Button } from 'react-bootstrap' import { useTranslation, Trans } from 'react-i18next' -import LeaveModalForm from './modal-form' +import getMeta from '../../../../utils/meta' +import LeaveModalForm, { LeaveModalFormProps } from './modal-form' type LeaveModalContentProps = { handleHide: () => void @@ -9,6 +10,34 @@ type LeaveModalContentProps = { setInFlight: Dispatch> } +function LeaveModalContentBlock({ + setInFlight, + isFormValid, + setIsFormValid, +}: LeaveModalFormProps) { + const { t } = useTranslation() + const isSaas = getMeta('ol-isSaas') as boolean + const hasPassword = getMeta('ol-hasPassword') as boolean + + if (isSaas && !hasPassword) { + return ( +

+ + {t('delete_acct_no_existing_pw')} + +

+ ) + } + + return ( + + ) +} + function LeaveModalContent({ handleHide, inFlight, @@ -30,7 +59,7 @@ function LeaveModalContent({ components={[]} // eslint-disable-line react/jsx-key />

- > isFormValid: boolean setIsFormValid: Dispatch> diff --git a/services/web/frontend/stories/settings/leave.stories.js b/services/web/frontend/stories/settings/leave.stories.js index 427ac1c9b9..31c028d0e3 100644 --- a/services/web/frontend/stories/settings/leave.stories.js +++ b/services/web/frontend/stories/settings/leave.stories.js @@ -11,9 +11,15 @@ function defaultSetupMocks(fetchMock) { }) } -export const Section = args => { +function setDefaultMeta() { window.metaAttributesCache.set('ol-userDefaultEmail', 'user@primary.com') + window.metaAttributesCache.set('ol-isSaas', true) + window.metaAttributesCache.set('ol-hasPassword', true) +} + +export const Section = args => { useFetchMock(defaultSetupMocks) + setDefaultMeta() return } @@ -21,14 +27,22 @@ Section.component = LeaveSection Section.parameters = { controls: { include: [], hideNoControlsWarning: true } } export const ModalSuccess = args => { - window.metaAttributesCache.set('ol-userDefaultEmail', 'user@primary.com') + setDefaultMeta() + useFetchMock(defaultSetupMocks) + + return +} + +export const ModalWithoutPassword = args => { + setDefaultMeta() + window.metaAttributesCache.set('ol-hasPassword', false) useFetchMock(defaultSetupMocks) return } export const ModalAuthError = args => { - window.metaAttributesCache.set('ol-userDefaultEmail', 'user@primary.com') + setDefaultMeta() useFetchMock(fetchMock => { fetchMock.post(/\/user\/delete/, 403) }) @@ -37,7 +51,7 @@ export const ModalAuthError = args => { } export const ModalServerError = args => { - window.metaAttributesCache.set('ol-userDefaultEmail', 'user@primary.com') + setDefaultMeta() useFetchMock(fetchMock => { fetchMock.post(/\/user\/delete/, 500) }) @@ -46,7 +60,7 @@ export const ModalServerError = args => { } export const ModalSubscriptionError = args => { - window.metaAttributesCache.set('ol-userDefaultEmail', 'user@primary.com') + setDefaultMeta() useFetchMock(fetchMock => { fetchMock.post(/\/user\/delete/, { status: 422, diff --git a/services/web/test/frontend/features/settings/components/leave/modal-content.test.tsx b/services/web/test/frontend/features/settings/components/leave/modal-content.test.tsx index c8d85ca3ac..786c03926f 100644 --- a/services/web/test/frontend/features/settings/components/leave/modal-content.test.tsx +++ b/services/web/test/frontend/features/settings/components/leave/modal-content.test.tsx @@ -5,7 +5,14 @@ import fetchMock from 'fetch-mock' import LeaveModalContent from '../../../../../../frontend/js/features/settings/components/leave/modal-content' describe('', function () { + beforeEach(function () { + window.metaAttributesCache = new Map() + window.metaAttributesCache.set('ol-isSaas', false) + window.metaAttributesCache.set('ol-hasPassword', true) + }) + afterEach(function () { + window.metaAttributesCache = new Map() fetchMock.reset() }) @@ -17,10 +24,28 @@ describe('', function () { setInFlight={() => {}} /> ) + screen.getByLabelText('Email') const deleteButton = screen.getByRole('button', { name: 'Delete', }) expect(deleteButton.hasAttribute('disabled')).to.be.true }) + + it('shows no password message', function () { + window.metaAttributesCache.set('ol-isSaas', true) + window.metaAttributesCache.set('ol-hasPassword', false) + render( + {}} + inFlight={false} + setInFlight={() => {}} + /> + ) + + const link = screen.getByRole('link', { + name: 'Please use the password reset form to set a password before deleting your account', + }) + expect(link.getAttribute('href')).to.equal('/user/password/reset') + }) })