58 lines
1.3 KiB
TypeScript
58 lines
1.3 KiB
TypeScript
import { Button } from '@/ui/Button';
|
|
|
|
interface OnboardingNavigationProps {
|
|
onBack: () => void;
|
|
onNext?: () => void;
|
|
isLastStep: boolean;
|
|
canSubmit: boolean;
|
|
loading: boolean;
|
|
}
|
|
|
|
export function OnboardingNavigation({ onBack, onNext, isLastStep, canSubmit, loading }: OnboardingNavigationProps) {
|
|
return (
|
|
<div className="mt-8 flex items-center justify-between">
|
|
<Button
|
|
type="button"
|
|
variant="secondary"
|
|
onClick={onBack}
|
|
disabled={loading}
|
|
className="flex items-center gap-2"
|
|
>
|
|
<span>←</span>
|
|
Back
|
|
</Button>
|
|
|
|
{!isLastStep ? (
|
|
<Button
|
|
type="button"
|
|
variant="primary"
|
|
onClick={onNext}
|
|
disabled={loading}
|
|
className="flex items-center gap-2"
|
|
>
|
|
Continue
|
|
<span>→</span>
|
|
</Button>
|
|
) : (
|
|
<Button
|
|
type="submit"
|
|
variant="primary"
|
|
disabled={loading || !canSubmit}
|
|
className="flex items-center gap-2"
|
|
>
|
|
{loading ? (
|
|
<>
|
|
<span className="animate-spin">⟳</span>
|
|
Creating Profile...
|
|
</>
|
|
) : (
|
|
<>
|
|
<span>✓</span>
|
|
Complete Setup
|
|
</>
|
|
)}
|
|
</Button>
|
|
)}
|
|
</div>
|
|
);
|
|
} |