Persist auth spinner (#503)

This commit is contained in:
Jeremy 2024-11-08 17:59:06 +03:00 committed by GitHub
parent 729634e1d6
commit 58117f932f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 20 additions and 7 deletions

View file

@ -6,24 +6,32 @@ import { LoaderIcon } from '@/components/custom/icons';
import { Button } from '../ui/button';
export function SubmitButton({ children }: { children: React.ReactNode }) {
export function SubmitButton({
children,
isSuccessful,
}: {
children: React.ReactNode;
isSuccessful: boolean;
}) {
const { pending } = useFormStatus();
return (
<Button
type={pending ? 'button' : 'submit'}
aria-disabled={pending}
disabled={pending}
aria-disabled={pending || isSuccessful}
disabled={pending || isSuccessful}
className="relative"
>
{children}
{pending && (
{(pending || isSuccessful) && (
<span className="animate-spin absolute right-4">
<LoaderIcon />
</span>
)}
<span aria-live="polite" className="sr-only" role="status">
{pending ? 'Loading' : 'Submit form'}
{pending || isSuccessful ? 'Loading' : 'Submit form'}
</span>
</Button>
);