@oneblink/apps-react 11.0.0-beta.12 → 11.0.0-beta.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -11,7 +11,7 @@ type Props = {
11
11
  detail?: string;
12
12
  mfaRequirementMessage?: string;
13
13
  mfaRequirementMessageIsWarning?: boolean;
14
- cypressPrefix: string;
14
+ cypressPrefix: 'mfa-authenticator' | 'mfa-sms';
15
15
  extraButtons?: React.ReactNode;
16
16
  onSetup: () => void;
17
17
  onDisable: () => void;
@@ -2,9 +2,12 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
2
2
  import { memo } from 'react';
3
3
  import { Alert, Box, Button, Chip, Grid, Tooltip, Typography, } from '@mui/material';
4
4
  function MfaMethodRow({ isEnabled, isPreferred, isUsedForLogin, isSettingUp, isSettingPreferredMfaMethod, isSetupDisabled, showSetupErrorTooltip, title, description, detail, mfaRequirementMessage, mfaRequirementMessageIsWarning, cypressPrefix, extraButtons, onSetup, onDisable, onSetPreferred, }) {
5
+ const smsSetupDisabledTooltip = cypressPrefix === 'mfa-sms' && !isEnabled
6
+ ? 'SMS MFA setup will be available in a future release. Please use Authenticator App in the meantime.'
7
+ : undefined;
5
8
  return (_jsxs(Box, { "data-cypress": `${cypressPrefix}-method-row`, children: [_jsxs(Grid, { container: true, spacing: 2, alignItems: "center", children: [_jsxs(Grid, { size: { xs: 'grow' }, children: [_jsxs(Box, { sx: { mb: 1 }, children: [_jsx(Typography, { variant: "subtitle1", component: "span", children: title }), isEnabled && (_jsx(Chip, { size: "small", label: "Enabled", color: "default", sx: { ml: 1 }, "data-cypress": `${cypressPrefix}-status-chip` })), isPreferred && (_jsx(Chip, { size: "small", label: "Preferred", color: "info", sx: { ml: 1 }, "data-cypress": `${cypressPrefix}-preferred-chip` })), isUsedForLogin && (_jsx(Chip, { size: "small", label: "Used for login", color: "success", sx: { ml: 1 }, "data-cypress": `${cypressPrefix}-used-for-login-chip` }))] }), _jsx(Typography, { variant: "body2", color: "text.secondary", children: description }), !!detail && (_jsx(Typography, { variant: "body2", color: "text.secondary", sx: { mt: 1 }, children: detail }))] }), _jsx(Grid, { size: "auto", children: _jsxs(Box, { display: "flex", gap: 1, flexWrap: "wrap", justifyContent: "flex-end", children: [extraButtons, isEnabled ? (_jsxs(_Fragment, { children: [!isPreferred && (_jsx(Button, { size: "small", variant: "outlined", loading: isSettingPreferredMfaMethod, disabled: isSettingPreferredMfaMethod, onClick: onSetPreferred, "data-cypress": `${cypressPrefix}-set-preferred-button`, children: "Set as Preferred" })), _jsx(Button, { size: "small", variant: "outlined", onClick: onDisable, "data-cypress": `${cypressPrefix}-disable-button`, children: "Disable" })] })) : (_jsx(Tooltip, { title: showSetupErrorTooltip
6
9
  ? 'We are unable to load your MFA status. Please try again by clicking the reload button on the chip above.'
7
- : '', children: _jsx("span", { children: _jsx(Button, { size: "small", variant: "contained", loading: isSettingUp, disabled: isSetupDisabled, onClick: onSetup, "data-cypress": `${cypressPrefix}-setup-button`, children: "Setup" }) }) }))] }) })] }), !!mfaRequirementMessage && (_jsx(Alert, { severity: mfaRequirementMessageIsWarning ? 'warning' : 'info', "data-cypress": `${cypressPrefix}-mfa-requirement-message`, children: mfaRequirementMessage }))] }));
10
+ : smsSetupDisabledTooltip !== null && smsSetupDisabledTooltip !== void 0 ? smsSetupDisabledTooltip : '', children: _jsx("span", { children: _jsx(Button, { size: "small", variant: "contained", loading: isSettingUp, disabled: isSetupDisabled, onClick: onSetup, "data-cypress": `${cypressPrefix}-setup-button`, children: "Setup" }) }) }))] }) })] }), !!mfaRequirementMessage && (_jsx(Alert, { severity: mfaRequirementMessageIsWarning ? 'warning' : 'info', "data-cypress": `${cypressPrefix}-mfa-requirement-message`, children: mfaRequirementMessage }))] }));
8
11
  }
9
12
  export default memo(MfaMethodRow);
10
13
  //# sourceMappingURL=MfaMethodRow.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"MfaMethodRow.js","sourceRoot":"","sources":["../../../src/components/mfa/MfaMethodRow.tsx"],"names":[],"mappings":"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","sourcesContent":["import { memo } from 'react'\nimport {\n Alert,\n Box,\n Button,\n Chip,\n Grid,\n Tooltip,\n Typography,\n} from '@mui/material'\n\ntype Props = {\n isEnabled: boolean\n isPreferred: boolean\n isUsedForLogin: boolean\n isSettingUp: boolean\n isSettingPreferredMfaMethod: boolean\n isSetupDisabled: boolean\n showSetupErrorTooltip?: boolean\n title: string\n description: string\n detail?: string\n mfaRequirementMessage?: string\n mfaRequirementMessageIsWarning?: boolean\n cypressPrefix: string\n extraButtons?: React.ReactNode\n onSetup: () => void\n onDisable: () => void\n onSetPreferred: () => void\n}\n\nfunction MfaMethodRow({\n isEnabled,\n isPreferred,\n isUsedForLogin,\n isSettingUp,\n isSettingPreferredMfaMethod,\n isSetupDisabled,\n showSetupErrorTooltip,\n title,\n description,\n detail,\n mfaRequirementMessage,\n mfaRequirementMessageIsWarning,\n cypressPrefix,\n extraButtons,\n onSetup,\n onDisable,\n onSetPreferred,\n}: Props) {\n return (\n <Box data-cypress={`${cypressPrefix}-method-row`}>\n <Grid container spacing={2} alignItems=\"center\">\n <Grid size={{ xs: 'grow' }}>\n <Box sx={{ mb: 1 }}>\n <Typography variant=\"subtitle1\" component=\"span\">\n {title}\n </Typography>\n {isEnabled && (\n <Chip\n size=\"small\"\n label=\"Enabled\"\n color=\"default\"\n sx={{ ml: 1 }}\n data-cypress={`${cypressPrefix}-status-chip`}\n />\n )}\n {isPreferred && (\n <Chip\n size=\"small\"\n label=\"Preferred\"\n color=\"info\"\n sx={{ ml: 1 }}\n data-cypress={`${cypressPrefix}-preferred-chip`}\n />\n )}\n {isUsedForLogin && (\n <Chip\n size=\"small\"\n label=\"Used for login\"\n color=\"success\"\n sx={{ ml: 1 }}\n data-cypress={`${cypressPrefix}-used-for-login-chip`}\n />\n )}\n </Box>\n <Typography variant=\"body2\" color=\"text.secondary\">\n {description}\n </Typography>\n {!!detail && (\n <Typography variant=\"body2\" color=\"text.secondary\" sx={{ mt: 1 }}>\n {detail}\n </Typography>\n )}\n </Grid>\n <Grid size=\"auto\">\n <Box display=\"flex\" gap={1} flexWrap=\"wrap\" justifyContent=\"flex-end\">\n {extraButtons}\n {isEnabled ? (\n <>\n {!isPreferred && (\n <Button\n size=\"small\"\n variant=\"outlined\"\n loading={isSettingPreferredMfaMethod}\n disabled={isSettingPreferredMfaMethod}\n onClick={onSetPreferred}\n data-cypress={`${cypressPrefix}-set-preferred-button`}\n >\n Set as Preferred\n </Button>\n )}\n <Button\n size=\"small\"\n variant=\"outlined\"\n onClick={onDisable}\n data-cypress={`${cypressPrefix}-disable-button`}\n >\n Disable\n </Button>\n </>\n ) : (\n <Tooltip\n title={\n showSetupErrorTooltip\n ? 'We are unable to load your MFA status. Please try again by clicking the reload button on the chip above.'\n : ''\n }\n >\n <span>\n <Button\n size=\"small\"\n variant=\"contained\"\n loading={isSettingUp}\n disabled={isSetupDisabled}\n onClick={onSetup}\n data-cypress={`${cypressPrefix}-setup-button`}\n >\n Setup\n </Button>\n </span>\n </Tooltip>\n )}\n </Box>\n </Grid>\n </Grid>\n\n {!!mfaRequirementMessage && (\n <Alert\n severity={mfaRequirementMessageIsWarning ? 'warning' : 'info'}\n data-cypress={`${cypressPrefix}-mfa-requirement-message`}\n >\n {mfaRequirementMessage}\n </Alert>\n )}\n </Box>\n )\n}\n\nexport default memo(MfaMethodRow)\n"]}
1
+ {"version":3,"file":"MfaMethodRow.js","sourceRoot":"","sources":["../../../src/components/mfa/MfaMethodRow.tsx"],"names":[],"mappings":"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","sourcesContent":["import { memo } from 'react'\nimport {\n Alert,\n Box,\n Button,\n Chip,\n Grid,\n Tooltip,\n Typography,\n} from '@mui/material'\n\ntype Props = {\n isEnabled: boolean\n isPreferred: boolean\n isUsedForLogin: boolean\n isSettingUp: boolean\n isSettingPreferredMfaMethod: boolean\n isSetupDisabled: boolean\n showSetupErrorTooltip?: boolean\n title: string\n description: string\n detail?: string\n mfaRequirementMessage?: string\n mfaRequirementMessageIsWarning?: boolean\n cypressPrefix: 'mfa-authenticator' | 'mfa-sms'\n extraButtons?: React.ReactNode\n onSetup: () => void\n onDisable: () => void\n onSetPreferred: () => void\n}\n\nfunction MfaMethodRow({\n isEnabled,\n isPreferred,\n isUsedForLogin,\n isSettingUp,\n isSettingPreferredMfaMethod,\n isSetupDisabled,\n showSetupErrorTooltip,\n title,\n description,\n detail,\n mfaRequirementMessage,\n mfaRequirementMessageIsWarning,\n cypressPrefix,\n extraButtons,\n onSetup,\n onDisable,\n onSetPreferred,\n}: Props) {\n const smsSetupDisabledTooltip =\n cypressPrefix === 'mfa-sms' && !isEnabled\n ? 'SMS MFA setup will be available in a future release. Please use Authenticator App in the meantime.'\n : undefined\n\n return (\n <Box data-cypress={`${cypressPrefix}-method-row`}>\n <Grid container spacing={2} alignItems=\"center\">\n <Grid size={{ xs: 'grow' }}>\n <Box sx={{ mb: 1 }}>\n <Typography variant=\"subtitle1\" component=\"span\">\n {title}\n </Typography>\n {isEnabled && (\n <Chip\n size=\"small\"\n label=\"Enabled\"\n color=\"default\"\n sx={{ ml: 1 }}\n data-cypress={`${cypressPrefix}-status-chip`}\n />\n )}\n {isPreferred && (\n <Chip\n size=\"small\"\n label=\"Preferred\"\n color=\"info\"\n sx={{ ml: 1 }}\n data-cypress={`${cypressPrefix}-preferred-chip`}\n />\n )}\n {isUsedForLogin && (\n <Chip\n size=\"small\"\n label=\"Used for login\"\n color=\"success\"\n sx={{ ml: 1 }}\n data-cypress={`${cypressPrefix}-used-for-login-chip`}\n />\n )}\n </Box>\n <Typography variant=\"body2\" color=\"text.secondary\">\n {description}\n </Typography>\n {!!detail && (\n <Typography variant=\"body2\" color=\"text.secondary\" sx={{ mt: 1 }}>\n {detail}\n </Typography>\n )}\n </Grid>\n <Grid size=\"auto\">\n <Box display=\"flex\" gap={1} flexWrap=\"wrap\" justifyContent=\"flex-end\">\n {extraButtons}\n {isEnabled ? (\n <>\n {!isPreferred && (\n <Button\n size=\"small\"\n variant=\"outlined\"\n loading={isSettingPreferredMfaMethod}\n disabled={isSettingPreferredMfaMethod}\n onClick={onSetPreferred}\n data-cypress={`${cypressPrefix}-set-preferred-button`}\n >\n Set as Preferred\n </Button>\n )}\n <Button\n size=\"small\"\n variant=\"outlined\"\n onClick={onDisable}\n data-cypress={`${cypressPrefix}-disable-button`}\n >\n Disable\n </Button>\n </>\n ) : (\n <Tooltip\n title={\n showSetupErrorTooltip\n ? 'We are unable to load your MFA status. Please try again by clicking the reload button on the chip above.'\n : smsSetupDisabledTooltip ?? ''\n }\n >\n <span>\n <Button\n size=\"small\"\n variant=\"contained\"\n loading={isSettingUp}\n disabled={isSetupDisabled}\n onClick={onSetup}\n data-cypress={`${cypressPrefix}-setup-button`}\n >\n Setup\n </Button>\n </span>\n </Tooltip>\n )}\n </Box>\n </Grid>\n </Grid>\n\n {!!mfaRequirementMessage && (\n <Alert\n severity={mfaRequirementMessageIsWarning ? 'warning' : 'info'}\n data-cypress={`${cypressPrefix}-mfa-requirement-message`}\n >\n {mfaRequirementMessage}\n </Alert>\n )}\n </Box>\n )\n}\n\nexport default memo(MfaMethodRow)\n"]}
@@ -35,7 +35,7 @@ function MfaMethodList({ mfaRequirement, accessScopeLabel = 'app', }) {
35
35
  return (_jsx(Typography, { variant: "body2", color: "error", children: "We are unable to load your MFA methods. Please try again by clicking the reload button on the chip above." }));
36
36
  }
37
37
  return (_jsxs(_Fragment, { children: [_jsx(MfaMethodRow, { isEnabled: mfaSettings.authenticator.enabled, isPreferred: mfaSettings.authenticator.preferred, isUsedForLogin: isMfaMethodUsedForLogin(mfaSettings, 'authenticatorApp'), isSettingUp: isSettingUpMfa && settingUpMfaMethod === 'authenticator', isSettingPreferredMfaMethod: isSettingPreferredMfaMethod, isSetupDisabled: !!loadingError || isSettingUpMfa, showSetupErrorTooltip: !!loadingError, title: "Authenticator App", description: "Use an app like Google Authenticator or Microsoft Authenticator to generate 6-digit verification codes.", mfaRequirementMessage: authenticatorMfaRequirementMessage, mfaRequirementMessageIsWarning: !!(mfaRequirement === null || mfaRequirement === void 0 ? void 0 : mfaRequirement.authenticatorApp) &&
38
- !!authenticatorMfaRequirementMessage, cypressPrefix: "mfa-authenticator", onSetup: () => beginMfaSetup('authenticator'), onDisable: () => beginDisablingMfaMethod('authenticator'), onSetPreferred: () => setPreferredMfaMethod('authenticator') }), _jsx(Divider, { sx: { my: 2 } }), _jsx(MfaMethodRow, { isEnabled: mfaSettings.sms.enabled, isPreferred: mfaSettings.sms.preferred, isUsedForLogin: isMfaMethodUsedForLogin(mfaSettings, 'sms'), isSettingUp: isSettingUpMfa && settingUpMfaMethod === 'sms', isSettingPreferredMfaMethod: isSettingPreferredMfaMethod, isSetupDisabled: !!loadingError || isSettingUpMfa, showSetupErrorTooltip: !!loadingError, title: "SMS", description: "Receive a one-time verification code via SMS each time MFA is required.", detail: phoneDetail, mfaRequirementMessage: smsMfaRequirementMessage, mfaRequirementMessageIsWarning: !!(mfaRequirement === null || mfaRequirement === void 0 ? void 0 : mfaRequirement.sms) && !!smsMfaRequirementMessage, cypressPrefix: "mfa-sms", onSetup: () => beginMfaSetup('sms'), onDisable: () => beginDisablingMfaMethod('sms'), onSetPreferred: () => setPreferredMfaMethod('sms'), extraButtons: !!mfaSettings.sms.phoneNumber && !mfaSettings.sms.enabled ? (_jsx(Button, { size: "small", variant: "outlined", disabled: !!loadingError, onClick: beginRemovingPhoneNumber, "data-cypress": "mfa-sms-remove-phone-button", children: "Remove Phone" })) : undefined })] }));
38
+ !!authenticatorMfaRequirementMessage, cypressPrefix: "mfa-authenticator", onSetup: () => beginMfaSetup('authenticator'), onDisable: () => beginDisablingMfaMethod('authenticator'), onSetPreferred: () => setPreferredMfaMethod('authenticator') }), _jsx(Divider, { sx: { my: 2 } }), _jsx(MfaMethodRow, { isEnabled: mfaSettings.sms.enabled, isPreferred: mfaSettings.sms.preferred, isUsedForLogin: isMfaMethodUsedForLogin(mfaSettings, 'sms'), isSettingUp: isSettingUpMfa && settingUpMfaMethod === 'sms', isSettingPreferredMfaMethod: isSettingPreferredMfaMethod, isSetupDisabled: !!loadingError || isSettingUpMfa || !mfaSettings.sms.enabled, showSetupErrorTooltip: !!loadingError, title: "SMS", description: "Receive a one-time verification code via SMS each time MFA is required.", detail: phoneDetail, mfaRequirementMessage: smsMfaRequirementMessage, mfaRequirementMessageIsWarning: !!(mfaRequirement === null || mfaRequirement === void 0 ? void 0 : mfaRequirement.sms) && !!smsMfaRequirementMessage, cypressPrefix: "mfa-sms", onSetup: () => beginMfaSetup('sms'), onDisable: () => beginDisablingMfaMethod('sms'), onSetPreferred: () => setPreferredMfaMethod('sms'), extraButtons: !!mfaSettings.sms.phoneNumber && !mfaSettings.sms.enabled ? (_jsx(Button, { size: "small", variant: "outlined", disabled: !!loadingError, onClick: beginRemovingPhoneNumber, "data-cypress": "mfa-sms-remove-phone-button", children: "Remove Phone" })) : undefined })] }));
39
39
  }
40
40
  function MfaSetup({ ssoSetupUrl, mfaRequirement, accessScopeLabel }) {
41
41
  const { isExternalIdentityProviderUser } = useMfa();
@@ -1 +1 @@
1
- {"version":3,"file":"MultiFactorAuthentication.js","sourceRoot":"","sources":["../../../src/components/mfa/MultiFactorAuthentication.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo } from 'react'\nimport {\n Box,\n Button,\n Divider,\n Grid,\n Paper,\n Tooltip,\n Typography,\n} from '@mui/material'\nimport { MiscTypes } from '@oneblink/types'\nimport MfaAuthenticatorAppDialog from './MfaAuthenticatorAppDialog'\nimport useMfa from '../../hooks/useMfa'\nimport MfaDisableDialog from './MfaDisableDialog'\nimport MfaRemovePhoneNumberDialog from './MfaRemovePhoneNumberDialog'\nimport MfaPhoneNumberDialog from './MfaPhoneNumberDialog'\nimport MfaMethodRow from './MfaMethodRow'\nimport MfaSuccessSnackbar from './MfaSuccessSnackbar'\nimport MfaErrorSnackbar from './MfaErrorSnackbar'\nimport MfaStatusChip from './MfaStatusChip'\nimport {\n formatMfaMethodRequirementMessage,\n isMfaMethodUsedForLogin,\n} from '../../utils/mfa-requirement'\n\ntype Props = {\n mfaRequirement: MiscTypes.MfaRequirement | undefined\n ssoSetupUrl?: string\n accessScopeLabel?: string\n}\n\nfunction MfaMethodList({\n mfaRequirement,\n accessScopeLabel = 'app',\n}: Pick<Props, 'mfaRequirement' | 'accessScopeLabel'>) {\n const {\n mfaSettings,\n loadingError,\n isLoading,\n isSettingUpMfa,\n settingUpMfaMethod,\n isSettingPreferredMfaMethod,\n beginMfaSetup,\n beginDisablingMfaMethod,\n setPreferredMfaMethod,\n beginRemovingPhoneNumber,\n } = useMfa()\n\n const phoneDetail = useMemo(() => {\n if (!mfaSettings.sms.phoneNumber) {\n return undefined\n }\n\n if (!mfaSettings.sms.isPhoneNumberVerified) {\n return `Phone number: ${mfaSettings.sms.phoneNumber} (not verified)`\n }\n\n return `Phone number: ${mfaSettings.sms.phoneNumber}`\n }, [mfaSettings])\n\n const authenticatorMfaRequirementMessage = useMemo(() => {\n return formatMfaMethodRequirementMessage(\n 'authenticatorApp',\n mfaRequirement,\n mfaSettings,\n accessScopeLabel,\n )\n }, [accessScopeLabel, mfaRequirement, mfaSettings])\n\n const smsMfaRequirementMessage = useMemo(() => {\n return formatMfaMethodRequirementMessage(\n 'sms',\n mfaRequirement,\n mfaSettings,\n accessScopeLabel,\n )\n }, [accessScopeLabel, mfaRequirement, mfaSettings])\n\n if (isLoading) {\n return (\n <Typography variant=\"body2\" color=\"text.secondary\">\n Loading MFA methods...\n </Typography>\n )\n }\n\n if (loadingError) {\n return (\n <Typography variant=\"body2\" color=\"error\">\n We are unable to load your MFA methods. Please try again by clicking the\n reload button on the chip above.\n </Typography>\n )\n }\n\n return (\n <>\n <MfaMethodRow\n isEnabled={mfaSettings.authenticator.enabled}\n isPreferred={mfaSettings.authenticator.preferred}\n isUsedForLogin={isMfaMethodUsedForLogin(\n mfaSettings,\n 'authenticatorApp',\n )}\n isSettingUp={isSettingUpMfa && settingUpMfaMethod === 'authenticator'}\n isSettingPreferredMfaMethod={isSettingPreferredMfaMethod}\n isSetupDisabled={!!loadingError || isSettingUpMfa}\n showSetupErrorTooltip={!!loadingError}\n title=\"Authenticator App\"\n description=\"Use an app like Google Authenticator or Microsoft Authenticator to generate 6-digit verification codes.\"\n mfaRequirementMessage={authenticatorMfaRequirementMessage}\n mfaRequirementMessageIsWarning={\n !!mfaRequirement?.authenticatorApp &&\n !!authenticatorMfaRequirementMessage\n }\n cypressPrefix=\"mfa-authenticator\"\n onSetup={() => beginMfaSetup('authenticator')}\n onDisable={() => beginDisablingMfaMethod('authenticator')}\n onSetPreferred={() => setPreferredMfaMethod('authenticator')}\n />\n <Divider sx={{ my: 2 }} />\n <MfaMethodRow\n isEnabled={mfaSettings.sms.enabled}\n isPreferred={mfaSettings.sms.preferred}\n isUsedForLogin={isMfaMethodUsedForLogin(mfaSettings, 'sms')}\n isSettingUp={isSettingUpMfa && settingUpMfaMethod === 'sms'}\n isSettingPreferredMfaMethod={isSettingPreferredMfaMethod}\n isSetupDisabled={!!loadingError || isSettingUpMfa}\n showSetupErrorTooltip={!!loadingError}\n title=\"SMS\"\n description=\"Receive a one-time verification code via SMS each time MFA is required.\"\n detail={phoneDetail}\n mfaRequirementMessage={smsMfaRequirementMessage}\n mfaRequirementMessageIsWarning={\n !!mfaRequirement?.sms && !!smsMfaRequirementMessage\n }\n cypressPrefix=\"mfa-sms\"\n onSetup={() => beginMfaSetup('sms')}\n onDisable={() => beginDisablingMfaMethod('sms')}\n onSetPreferred={() => setPreferredMfaMethod('sms')}\n extraButtons={\n !!mfaSettings.sms.phoneNumber && !mfaSettings.sms.enabled ? (\n <Button\n size=\"small\"\n variant=\"outlined\"\n disabled={!!loadingError}\n onClick={beginRemovingPhoneNumber}\n data-cypress=\"mfa-sms-remove-phone-button\"\n >\n Remove Phone\n </Button>\n ) : undefined\n }\n />\n </>\n )\n}\n\nfunction MfaSetup({ ssoSetupUrl, mfaRequirement, accessScopeLabel }: Props) {\n const { isExternalIdentityProviderUser } = useMfa()\n\n if (ssoSetupUrl) {\n return (\n <Button\n variant=\"outlined\"\n size=\"small\"\n component=\"a\"\n href={ssoSetupUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n data-cypress=\"configure-mfa-button\"\n >\n Configure MFA\n </Button>\n )\n }\n\n if (isExternalIdentityProviderUser) {\n return (\n <Tooltip title=\"MFA must be configured in your login provider.\">\n <span>\n <Button\n variant=\"outlined\"\n disabled={isExternalIdentityProviderUser}\n data-cypress=\"configure-mfa-button\"\n >\n Configure MFA\n </Button>\n </span>\n </Tooltip>\n )\n }\n\n return (\n <>\n <MfaMethodList\n mfaRequirement={mfaRequirement}\n accessScopeLabel={accessScopeLabel}\n />\n <MfaDisableDialog />\n <MfaRemovePhoneNumberDialog />\n <MfaPhoneNumberDialog />\n <MfaAuthenticatorAppDialog />\n <MfaErrorSnackbar />\n <MfaSuccessSnackbar />\n </>\n )\n}\n\n/**\n * React Component that provides a mechanism for app users to configure Multi\n * Factor Authentication. `<MfaProvider />` must be provided above this\n * component in the component tree.\n *\n * #### Example\n *\n * ```js\n * import * as React from 'react'\n * import {\n * MfaProvider,\n * MultiFactorAuthentication,\n * } from '@oneblink/apps-react'\n *\n * function Component() {\n * return <MultiFactorAuthentication mfaRequirement={undefined} />\n * }\n *\n * function AppWithMfaRequirement({ mfaRequirement }) {\n * return (\n * <MfaProvider>\n * <MultiFactorAuthentication mfaRequirement={mfaRequirement} />\n * </MfaProvider>\n * )\n * }\n * ```\n *\n * @param props\n * @param props.mfaRequirement - The MFA methods allowed by your administrator\n * for using this app. Pass `undefined` when the app has no MFA requirement.\n * Users can still enable other methods, but will be warned when their\n * configuration does not meet this requirement.\n * @returns\n * @group Components\n */\nexport default function MultiFactorAuthentication({\n mfaRequirement,\n ssoSetupUrl,\n accessScopeLabel = 'App',\n}: Props) {\n return (\n <Grid size={{ xs: 'grow', lg: 8 }}>\n <Box padding={3}>\n <Paper>\n <Box padding={3}>\n <Grid container spacing={2} alignItems=\"center\">\n <Grid size={{ xs: 'grow' }}>\n <Typography variant=\"h4\" fontWeight=\"light\">\n Multi Factor Authentication{' '}\n <MfaStatusChip />\n </Typography>\n <Box marginY={1}>\n <Divider />\n </Box>\n <Typography variant=\"body2\" paragraph>\n Multi factor authentication (MFA), also known as two factor\n authentication (2FA), is a best practice that requires a\n second authentication factor in addition to user name and\n password sign-in credentials. We strongly recommend enabling\n MFA to enhance your account security.\n </Typography>\n <MfaSetup\n ssoSetupUrl={ssoSetupUrl}\n mfaRequirement={mfaRequirement}\n accessScopeLabel={accessScopeLabel}\n />\n </Grid>\n </Grid>\n </Box>\n </Paper>\n </Box>\n </Grid>\n )\n}\n"]}
1
+ {"version":3,"file":"MultiFactorAuthentication.js","sourceRoot":"","sources":["../../../src/components/mfa/MultiFactorAuthentication.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo } from 'react'\nimport {\n Box,\n Button,\n Divider,\n Grid,\n Paper,\n Tooltip,\n Typography,\n} from '@mui/material'\nimport { MiscTypes } from '@oneblink/types'\nimport MfaAuthenticatorAppDialog from './MfaAuthenticatorAppDialog'\nimport useMfa from '../../hooks/useMfa'\nimport MfaDisableDialog from './MfaDisableDialog'\nimport MfaRemovePhoneNumberDialog from './MfaRemovePhoneNumberDialog'\nimport MfaPhoneNumberDialog from './MfaPhoneNumberDialog'\nimport MfaMethodRow from './MfaMethodRow'\nimport MfaSuccessSnackbar from './MfaSuccessSnackbar'\nimport MfaErrorSnackbar from './MfaErrorSnackbar'\nimport MfaStatusChip from './MfaStatusChip'\nimport {\n formatMfaMethodRequirementMessage,\n isMfaMethodUsedForLogin,\n} from '../../utils/mfa-requirement'\n\ntype Props = {\n mfaRequirement: MiscTypes.MfaRequirement | undefined\n ssoSetupUrl?: string\n accessScopeLabel?: string\n}\n\nfunction MfaMethodList({\n mfaRequirement,\n accessScopeLabel = 'app',\n}: Pick<Props, 'mfaRequirement' | 'accessScopeLabel'>) {\n const {\n mfaSettings,\n loadingError,\n isLoading,\n isSettingUpMfa,\n settingUpMfaMethod,\n isSettingPreferredMfaMethod,\n beginMfaSetup,\n beginDisablingMfaMethod,\n setPreferredMfaMethod,\n beginRemovingPhoneNumber,\n } = useMfa()\n\n const phoneDetail = useMemo(() => {\n if (!mfaSettings.sms.phoneNumber) {\n return undefined\n }\n\n if (!mfaSettings.sms.isPhoneNumberVerified) {\n return `Phone number: ${mfaSettings.sms.phoneNumber} (not verified)`\n }\n\n return `Phone number: ${mfaSettings.sms.phoneNumber}`\n }, [mfaSettings])\n\n const authenticatorMfaRequirementMessage = useMemo(() => {\n return formatMfaMethodRequirementMessage(\n 'authenticatorApp',\n mfaRequirement,\n mfaSettings,\n accessScopeLabel,\n )\n }, [accessScopeLabel, mfaRequirement, mfaSettings])\n\n const smsMfaRequirementMessage = useMemo(() => {\n return formatMfaMethodRequirementMessage(\n 'sms',\n mfaRequirement,\n mfaSettings,\n accessScopeLabel,\n )\n }, [accessScopeLabel, mfaRequirement, mfaSettings])\n\n if (isLoading) {\n return (\n <Typography variant=\"body2\" color=\"text.secondary\">\n Loading MFA methods...\n </Typography>\n )\n }\n\n if (loadingError) {\n return (\n <Typography variant=\"body2\" color=\"error\">\n We are unable to load your MFA methods. Please try again by clicking the\n reload button on the chip above.\n </Typography>\n )\n }\n\n return (\n <>\n <MfaMethodRow\n isEnabled={mfaSettings.authenticator.enabled}\n isPreferred={mfaSettings.authenticator.preferred}\n isUsedForLogin={isMfaMethodUsedForLogin(\n mfaSettings,\n 'authenticatorApp',\n )}\n isSettingUp={isSettingUpMfa && settingUpMfaMethod === 'authenticator'}\n isSettingPreferredMfaMethod={isSettingPreferredMfaMethod}\n isSetupDisabled={!!loadingError || isSettingUpMfa}\n showSetupErrorTooltip={!!loadingError}\n title=\"Authenticator App\"\n description=\"Use an app like Google Authenticator or Microsoft Authenticator to generate 6-digit verification codes.\"\n mfaRequirementMessage={authenticatorMfaRequirementMessage}\n mfaRequirementMessageIsWarning={\n !!mfaRequirement?.authenticatorApp &&\n !!authenticatorMfaRequirementMessage\n }\n cypressPrefix=\"mfa-authenticator\"\n onSetup={() => beginMfaSetup('authenticator')}\n onDisable={() => beginDisablingMfaMethod('authenticator')}\n onSetPreferred={() => setPreferredMfaMethod('authenticator')}\n />\n <Divider sx={{ my: 2 }} />\n <MfaMethodRow\n isEnabled={mfaSettings.sms.enabled}\n isPreferred={mfaSettings.sms.preferred}\n isUsedForLogin={isMfaMethodUsedForLogin(mfaSettings, 'sms')}\n isSettingUp={isSettingUpMfa && settingUpMfaMethod === 'sms'}\n isSettingPreferredMfaMethod={isSettingPreferredMfaMethod}\n isSetupDisabled={!!loadingError || isSettingUpMfa || !mfaSettings.sms.enabled}\n showSetupErrorTooltip={!!loadingError}\n title=\"SMS\"\n description=\"Receive a one-time verification code via SMS each time MFA is required.\"\n detail={phoneDetail}\n mfaRequirementMessage={smsMfaRequirementMessage}\n mfaRequirementMessageIsWarning={\n !!mfaRequirement?.sms && !!smsMfaRequirementMessage\n }\n cypressPrefix=\"mfa-sms\"\n onSetup={() => beginMfaSetup('sms')}\n onDisable={() => beginDisablingMfaMethod('sms')}\n onSetPreferred={() => setPreferredMfaMethod('sms')}\n extraButtons={\n !!mfaSettings.sms.phoneNumber && !mfaSettings.sms.enabled ? (\n <Button\n size=\"small\"\n variant=\"outlined\"\n disabled={!!loadingError}\n onClick={beginRemovingPhoneNumber}\n data-cypress=\"mfa-sms-remove-phone-button\"\n >\n Remove Phone\n </Button>\n ) : undefined\n }\n />\n </>\n )\n}\n\nfunction MfaSetup({ ssoSetupUrl, mfaRequirement, accessScopeLabel }: Props) {\n const { isExternalIdentityProviderUser } = useMfa()\n\n if (ssoSetupUrl) {\n return (\n <Button\n variant=\"outlined\"\n size=\"small\"\n component=\"a\"\n href={ssoSetupUrl}\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n data-cypress=\"configure-mfa-button\"\n >\n Configure MFA\n </Button>\n )\n }\n\n if (isExternalIdentityProviderUser) {\n return (\n <Tooltip title=\"MFA must be configured in your login provider.\">\n <span>\n <Button\n variant=\"outlined\"\n disabled={isExternalIdentityProviderUser}\n data-cypress=\"configure-mfa-button\"\n >\n Configure MFA\n </Button>\n </span>\n </Tooltip>\n )\n }\n\n return (\n <>\n <MfaMethodList\n mfaRequirement={mfaRequirement}\n accessScopeLabel={accessScopeLabel}\n />\n <MfaDisableDialog />\n <MfaRemovePhoneNumberDialog />\n <MfaPhoneNumberDialog />\n <MfaAuthenticatorAppDialog />\n <MfaErrorSnackbar />\n <MfaSuccessSnackbar />\n </>\n )\n}\n\n/**\n * React Component that provides a mechanism for app users to configure Multi\n * Factor Authentication. `<MfaProvider />` must be provided above this\n * component in the component tree.\n *\n * #### Example\n *\n * ```js\n * import * as React from 'react'\n * import {\n * MfaProvider,\n * MultiFactorAuthentication,\n * } from '@oneblink/apps-react'\n *\n * function Component() {\n * return <MultiFactorAuthentication mfaRequirement={undefined} />\n * }\n *\n * function AppWithMfaRequirement({ mfaRequirement }) {\n * return (\n * <MfaProvider>\n * <MultiFactorAuthentication mfaRequirement={mfaRequirement} />\n * </MfaProvider>\n * )\n * }\n * ```\n *\n * @param props\n * @param props.mfaRequirement - The MFA methods allowed by your administrator\n * for using this app. Pass `undefined` when the app has no MFA requirement.\n * Users can still enable other methods, but will be warned when their\n * configuration does not meet this requirement.\n * @returns\n * @group Components\n */\nexport default function MultiFactorAuthentication({\n mfaRequirement,\n ssoSetupUrl,\n accessScopeLabel = 'App',\n}: Props) {\n return (\n <Grid size={{ xs: 'grow', lg: 8 }}>\n <Box padding={3}>\n <Paper>\n <Box padding={3}>\n <Grid container spacing={2} alignItems=\"center\">\n <Grid size={{ xs: 'grow' }}>\n <Typography variant=\"h4\" fontWeight=\"light\">\n Multi Factor Authentication{' '}\n <MfaStatusChip />\n </Typography>\n <Box marginY={1}>\n <Divider />\n </Box>\n <Typography variant=\"body2\" paragraph>\n Multi factor authentication (MFA), also known as two factor\n authentication (2FA), is a best practice that requires a\n second authentication factor in addition to user name and\n password sign-in credentials. We strongly recommend enabling\n MFA to enhance your account security.\n </Typography>\n <MfaSetup\n ssoSetupUrl={ssoSetupUrl}\n mfaRequirement={mfaRequirement}\n accessScopeLabel={accessScopeLabel}\n />\n </Grid>\n </Grid>\n </Box>\n </Paper>\n </Box>\n </Grid>\n )\n}\n"]}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@oneblink/apps-react",
3
3
  "description": "Helper functions for OneBlink apps in ReactJS.",
4
- "version": "11.0.0-beta.12",
4
+ "version": "11.0.0-beta.13",
5
5
  "author": "OneBlink <developers@oneblink.io> (https://oneblink.io)",
6
6
  "bugs": {
7
7
  "url": "https://github.com/oneblink/apps-react/issues"