From 5d0f08dd6756211045bdcf489f097840d26ab4fc Mon Sep 17 00:00:00 2001 From: joerger Date: Fri, 13 Dec 2024 17:48:38 -0800 Subject: [PATCH] Fix stories. --- .../teleport/src/Account/Account.story.tsx | 4 +- .../teleport/src/Account/Account.test.tsx | 4 +- .../ChangePasswordWizard.story.tsx | 28 ++++++------- .../ChangePasswordWizard.test.tsx | 1 - .../wizards/AddAuthDeviceWizard.story.tsx | 23 +++++++---- .../wizards/AddAuthDeviceWizard.test.tsx | 5 +-- .../wizards/DeleteAuthDeviceWizard.story.tsx | 28 ++++++------- .../ReAuthenticate/ReAuthenticate.story.tsx | 41 ++++++++++++------- .../ReAuthenticate/ReAuthenticate.tsx | 17 ++++---- 9 files changed, 83 insertions(+), 68 deletions(-) diff --git a/web/packages/teleport/src/Account/Account.story.tsx b/web/packages/teleport/src/Account/Account.story.tsx index c1803ab8aeb6d..7cae89ccc7c35 100644 --- a/web/packages/teleport/src/Account/Account.story.tsx +++ b/web/packages/teleport/src/Account/Account.story.tsx @@ -87,7 +87,7 @@ export const LoadingDevicesFailed = () => ( ); export const RemoveDialog = () => ( - + ); export const RestrictedTokenCreateProcessing = () => ( @@ -110,7 +110,6 @@ export const RestrictedTokenCreateFailed = () => ( ); const props: AccountProps = { - token: '', onAddDevice: () => null, fetchDevicesAttempt: { status: 'success' }, createRestrictedTokenAttempt: { status: '' }, @@ -179,7 +178,6 @@ const props: AccountProps = { }, ], onDeviceAdded: () => {}, - isReauthenticationRequired: false, addDeviceWizardVisible: false, closeAddDeviceWizard: () => {}, passwordState: PasswordState.PASSWORD_STATE_SET, diff --git a/web/packages/teleport/src/Account/Account.test.tsx b/web/packages/teleport/src/Account/Account.test.tsx index 671750591a71b..e8e3ae37b9ea0 100644 --- a/web/packages/teleport/src/Account/Account.test.tsx +++ b/web/packages/teleport/src/Account/Account.test.tsx @@ -16,8 +16,8 @@ * along with this program. If not, see . */ -import { render, screen, waitFor } from 'design/utils/testing'; import { within } from '@testing-library/react'; +import { render, screen, waitFor } from 'design/utils/testing'; import userEvent from '@testing-library/user-event'; @@ -27,9 +27,9 @@ import TeleportContext from 'teleport/teleportContext'; import { AccountPage as Account } from 'teleport/Account/Account'; import cfg from 'teleport/config'; import { createTeleportContext } from 'teleport/mocks/contexts'; -import { PasswordState } from 'teleport/services/user'; import auth from 'teleport/services/auth/auth'; import MfaService, { MfaDevice } from 'teleport/services/mfa'; +import { PasswordState } from 'teleport/services/user'; const defaultAuthType = cfg.auth.second_factor; const defaultPasswordless = cfg.auth.allowPasswordless; diff --git a/web/packages/teleport/src/Account/ChangePasswordWizard/ChangePasswordWizard.story.tsx b/web/packages/teleport/src/Account/ChangePasswordWizard/ChangePasswordWizard.story.tsx index 3876fdd06b8fb..a280c0fe194e1 100644 --- a/web/packages/teleport/src/Account/ChangePasswordWizard/ChangePasswordWizard.story.tsx +++ b/web/packages/teleport/src/Account/ChangePasswordWizard/ChangePasswordWizard.story.tsx @@ -16,24 +16,24 @@ * along with this program. If not, see . */ -import React from 'react'; - import Dialog from 'design/Dialog'; -import { createTeleportContext } from 'teleport/mocks/contexts'; import { ContextProvider } from 'teleport'; +import { createTeleportContext } from 'teleport/mocks/contexts'; import { MFA_OPTION_SSO_DEFAULT, MFA_OPTION_TOTP, + MFA_OPTION_WEBAUTHN, WebauthnAssertionResponse, } from 'teleport/services/mfa'; +import { makeEmptyAttempt } from 'shared/hooks/useAsync'; +import { ReauthState } from 'teleport/components/ReAuthenticate/useReAuthenticate'; + import { ChangePasswordStep, ChangePasswordWizardStepProps, - REAUTH_OPTION_PASSKEY, - REAUTH_OPTION_WEBAUTHN, ReauthenticateStep, } from './ChangePasswordWizard'; @@ -91,15 +91,15 @@ const stepProps = { onSuccess() {}, // ReauthenticateStepProps - reauthOptions: [ - REAUTH_OPTION_PASSKEY, - REAUTH_OPTION_WEBAUTHN, - MFA_OPTION_TOTP, - MFA_OPTION_SSO_DEFAULT, - ], - onReauthMethodChange: () => {}, - submitWithPasswordless: async () => {}, - submitWithMfa: async () => {}, + hasPasswordless: true, + setReauthMethod: () => {}, + reauthState: { + initAttempt: { status: 'success' }, + mfaOptions: [MFA_OPTION_WEBAUTHN, MFA_OPTION_TOTP, MFA_OPTION_SSO_DEFAULT], + submitWithMfa: async () => null, + submitAttempt: makeEmptyAttempt(), + clearSubmitAttempt: () => {}, + } as ReauthState, // ChangePasswordStepProps webauthnResponse: {} as WebauthnAssertionResponse, diff --git a/web/packages/teleport/src/Account/ChangePasswordWizard/ChangePasswordWizard.test.tsx b/web/packages/teleport/src/Account/ChangePasswordWizard/ChangePasswordWizard.test.tsx index eeeb4da32cf88..e7212af322784 100644 --- a/web/packages/teleport/src/Account/ChangePasswordWizard/ChangePasswordWizard.test.tsx +++ b/web/packages/teleport/src/Account/ChangePasswordWizard/ChangePasswordWizard.test.tsx @@ -17,7 +17,6 @@ */ import { render, screen } from 'design/utils/testing'; -import React from 'react'; import { waitFor, within } from '@testing-library/react'; import { userEvent, UserEvent } from '@testing-library/user-event'; diff --git a/web/packages/teleport/src/Account/ManageDevices/wizards/AddAuthDeviceWizard.story.tsx b/web/packages/teleport/src/Account/ManageDevices/wizards/AddAuthDeviceWizard.story.tsx index c1b1acd279a12..b8cd81130afab 100644 --- a/web/packages/teleport/src/Account/ManageDevices/wizards/AddAuthDeviceWizard.story.tsx +++ b/web/packages/teleport/src/Account/ManageDevices/wizards/AddAuthDeviceWizard.story.tsx @@ -36,6 +36,10 @@ import { MFA_OPTION_WEBAUTHN, } from 'teleport/services/mfa'; +import { ReauthState } from 'teleport/components/ReAuthenticate/useReAuthenticate'; + +import { makeEmptyAttempt } from 'shared/hooks/useAsync'; + import { AddAuthDeviceWizardStepProps, CreateDeviceStep, @@ -67,7 +71,10 @@ export function ReauthenticateLimitedOptions() { return ( ); } @@ -170,14 +177,12 @@ const stepProps: AddAuthDeviceWizardStepProps = { usage: 'passwordless' as DeviceUsage, // Reauth props - reauthAttempt: {} as Attempt, - clearReauthAttempt: () => {}, - mfaChallengeOptions: [ - MFA_OPTION_WEBAUTHN, - MFA_OPTION_TOTP, - MFA_OPTION_SSO_DEFAULT, - ], - submitWithMfa: async () => {}, + reauthState: { + mfaOptions: [MFA_OPTION_WEBAUTHN, MFA_OPTION_TOTP, MFA_OPTION_SSO_DEFAULT], + submitWithMfa: async () => null, + submitAttempt: makeEmptyAttempt(), + clearSubmitAttempt: () => {}, + } as ReauthState, // Create props mfaRegisterOptions: [MFA_OPTION_WEBAUTHN, MFA_OPTION_TOTP], diff --git a/web/packages/teleport/src/Account/ManageDevices/wizards/AddAuthDeviceWizard.test.tsx b/web/packages/teleport/src/Account/ManageDevices/wizards/AddAuthDeviceWizard.test.tsx index 25750a77ef4b1..96a2fc05a404f 100644 --- a/web/packages/teleport/src/Account/ManageDevices/wizards/AddAuthDeviceWizard.test.tsx +++ b/web/packages/teleport/src/Account/ManageDevices/wizards/AddAuthDeviceWizard.test.tsx @@ -17,15 +17,14 @@ */ import { render, screen } from 'design/utils/testing'; -import React from 'react'; import { waitFor } from '@testing-library/react'; import { userEvent, UserEvent } from '@testing-library/user-event'; -import TeleportContext from 'teleport/teleportContext'; import { ContextProvider } from 'teleport'; -import MfaService from 'teleport/services/mfa'; import auth from 'teleport/services/auth'; +import MfaService from 'teleport/services/mfa'; +import TeleportContext from 'teleport/teleportContext'; import { AddAuthDeviceWizardStepProps } from './AddAuthDeviceWizard'; diff --git a/web/packages/teleport/src/Account/ManageDevices/wizards/DeleteAuthDeviceWizard.story.tsx b/web/packages/teleport/src/Account/ManageDevices/wizards/DeleteAuthDeviceWizard.story.tsx index 3cbde51f69c79..aa27cbf76432b 100644 --- a/web/packages/teleport/src/Account/ManageDevices/wizards/DeleteAuthDeviceWizard.story.tsx +++ b/web/packages/teleport/src/Account/ManageDevices/wizards/DeleteAuthDeviceWizard.story.tsx @@ -16,14 +16,10 @@ * along with this program. If not, see . */ -import React from 'react'; - import Dialog from 'design/Dialog'; -import { Attempt } from 'shared/hooks/useAttemptNext'; - -import { createTeleportContext } from 'teleport/mocks/contexts'; import { ContextProvider } from 'teleport/index'; +import { createTeleportContext } from 'teleport/mocks/contexts'; import { MFA_OPTION_SSO_DEFAULT, @@ -32,6 +28,10 @@ import { MfaDevice, } from 'teleport/services/mfa'; +import { ReauthState } from 'teleport/components/ReAuthenticate/useReAuthenticate'; + +import { makeEmptyAttempt } from 'shared/hooks/useAsync'; + import { DeleteAuthDeviceWizardStepProps, DeleteDeviceStep, @@ -107,19 +107,17 @@ const stepProps: DeleteAuthDeviceWizardStepProps = { flowLength: 2, refCallback: () => {}, + // Reauth props + reauthState: { + mfaOptions: [MFA_OPTION_WEBAUTHN, MFA_OPTION_TOTP, MFA_OPTION_SSO_DEFAULT], + submitWithMfa: async () => null, + submitAttempt: makeEmptyAttempt(), + clearSubmitAttempt: () => {}, + } as ReauthState, + // Delete props deviceToDelete: dummyPasskey, privilegeToken: 'privilege-token', onClose: () => {}, onSuccess: () => {}, - - // Other props - reauthAttempt: {} as Attempt, - clearReauthAttempt: () => {}, - mfaChallengeOptions: [ - MFA_OPTION_WEBAUTHN, - MFA_OPTION_TOTP, - MFA_OPTION_SSO_DEFAULT, - ], - submitWithMfa: async () => {}, }; diff --git a/web/packages/teleport/src/components/ReAuthenticate/ReAuthenticate.story.tsx b/web/packages/teleport/src/components/ReAuthenticate/ReAuthenticate.story.tsx index a202663b5daa7..e97dacd7c4b29 100644 --- a/web/packages/teleport/src/components/ReAuthenticate/ReAuthenticate.story.tsx +++ b/web/packages/teleport/src/components/ReAuthenticate/ReAuthenticate.story.tsx @@ -16,15 +16,16 @@ * along with this program. If not, see . */ -import React from 'react'; - import { MFA_OPTION_SSO_DEFAULT, MFA_OPTION_TOTP, MFA_OPTION_WEBAUTHN, } from 'teleport/services/mfa'; +import { makeEmptyAttempt } from 'shared/hooks/useAsync'; + import { ReAuthenticate, State } from './ReAuthenticate'; +import { ReauthState } from './useReAuthenticate'; export default { title: 'Teleport/ReAuthenticate', @@ -33,26 +34,38 @@ export default { export const Loaded = () => ; export const Processing = () => ( - + ); export const Failed = () => ( ); const props: State = { - attempt: { status: '' }, - clearAttempt: () => null, - getMfaChallenge: () => null, - getMfaChallengeOptions: async () => [ - MFA_OPTION_WEBAUTHN, - MFA_OPTION_TOTP, - MFA_OPTION_SSO_DEFAULT, - ], - submitWithMfa: () => null, - submitWithPasswordless: () => null, + reauthState: { + initAttempt: { status: 'success' }, + mfaOptions: [MFA_OPTION_WEBAUTHN, MFA_OPTION_TOTP, MFA_OPTION_SSO_DEFAULT], + submitWithMfa: async () => null, + submitAttempt: makeEmptyAttempt(), + clearSubmitAttempt: () => {}, + } as ReauthState, + onClose: () => null, }; diff --git a/web/packages/teleport/src/components/ReAuthenticate/ReAuthenticate.tsx b/web/packages/teleport/src/components/ReAuthenticate/ReAuthenticate.tsx index 7add4a659fb55..6dfc8a0f96f3c 100644 --- a/web/packages/teleport/src/components/ReAuthenticate/ReAuthenticate.tsx +++ b/web/packages/teleport/src/components/ReAuthenticate/ReAuthenticate.tsx @@ -50,20 +50,23 @@ export type Props = ReauthProps & { export default function Container(props: Props) { const state = useReAuthenticate(props); - return ; + return ; } -export type State = ReauthState & { +export type State = { + reauthState: ReauthState; onClose: () => void; }; export function ReAuthenticate({ onClose, - initAttempt, - mfaOptions, - submitWithMfa, - submitAttempt, - clearSubmitAttempt, + reauthState: { + initAttempt, + mfaOptions, + submitWithMfa, + submitAttempt, + clearSubmitAttempt, + }, }: State) { const [otpCode, setOtpToken] = useState(''); const [mfaOption, setMfaOption] = useState();