// SPDX-FileCopyrightText: Copyright Orangebot, Inc. and Medplum contributors
// SPDX-License-Identifier: Apache-2.0
import { Title } from '@mantine/core';
import type { Meta } from '@storybook/react';
import type { JSX } from 'react';
import { Logo } from '../Logo/Logo';
import { SignInForm } from './SignInForm';
export default {
title: 'Medplum/Auth/SignInForm',
component: SignInForm,
} as Meta;
export function Basic(): JSX.Element {
return (
<SignInForm onSuccess={() => alert('Signed in!')}>
<Logo size={32} />
<Title>Sign in to Medplum</Title>
</SignInForm>
);
}
export function WithLinks(): JSX.Element {
return (
<SignInForm
onSuccess={() => alert('Signed in!')}
onForgotPassword={() => alert('Forgot password')}
onRegister={() => alert('Register')}
>
<Logo size={32} />
<Title>Sign in to Medplum</Title>
</SignInForm>
);
}
export function WithFooter(): JSX.Element {
return (
<>
<SignInForm
onSuccess={() => alert('Signed in!')}
onForgotPassword={() => alert('Forgot password')}
onRegister={() => alert('Register')}
>
<Logo size={32} />
<Title>Sign in to Medplum</Title>
</SignInForm>
</>
);
}
export function WithGoogle(): JSX.Element {
return (
<>
<SignInForm
onSuccess={() => alert('Signed in!')}
onForgotPassword={() => alert('Forgot password')}
onRegister={() => alert('Register')}
googleClientId="xyz"
>
<Logo size={32} />
<Title>Sign in to Medplum</Title>
</SignInForm>
</>
);
}
export function GoogleOnly(): JSX.Element {
return (
<>
<SignInForm
onSuccess={() => alert('Signed in!')}
onForgotPassword={() => alert('Forgot password')}
googleClientId="xyz"
disableEmailAuth
>
<Logo size={32} />
<Title>Sign in to Medplum</Title>
</SignInForm>
</>
);
}
