Use <Alert> for auth banner in /settings (#1238)

This commit is contained in:
ekzyis 2024-06-13 01:16:54 +02:00 committed by GitHub
parent 286f53f2b3
commit 8a19fc0905
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 10 additions and 1 deletions

View File

@ -138,3 +138,11 @@ export function WalletSecurityBanner () {
</Alert>
)
}
export function AuthBanner () {
return (
<Alert className={`${styles.banner} mt-0`} key='info' variant='danger'>
Please add a second auth method to avoid losing access to your account.
</Alert>
)
}

View File

@ -30,6 +30,7 @@ import { INVOICE_RETENTION_DAYS, ZAP_UNDO_DELAY_MS } from '@/lib/constants'
import { OverlayTrigger, Tooltip } from 'react-bootstrap'
import { useField } from 'formik'
import styles from './settings.module.css'
import { AuthBanner } from '@/components/banners'
export const getServerSideProps = getGetServerSideProps({ query: SETTINGS, authRequired: true })
@ -106,7 +107,7 @@ export default function Settings ({ ssrData }) {
return (
<Layout>
<div className='pb-3 w-100 mt-2' style={{ maxWidth: '600px' }}>
{hasOnlyOneAuthMethod(settings?.authMethods) && <div className={styles.alert}>Please add a second auth method to avoid losing access to your account.</div>}
{hasOnlyOneAuthMethod(settings?.authMethods) && <AuthBanner />}
<SettingsHeader />
<Form
initial={{