"use client";

import { MagicLinkForm } from "./magic-link-form";
import { MicrosoftButton } from "./microsoft-button";
import { Separator } from "@/components/ui/separator";

export function SignInForm() {
  return (
    <div className="space-y-6">
      {/* Microsoft OAuth */}
      <MicrosoftButton />

      {/* Divider */}
      <div className="relative">
        <div className="absolute inset-0 flex items-center">
          <Separator className="w-full" />
        </div>
        <div className="relative flex justify-center text-xs uppercase">
          <span className="bg-white dark:bg-slate-900 px-2 text-muted-foreground">
            Or continue with email
          </span>
        </div>
      </div>

      {/* Magic Link */}
      <MagicLinkForm />
    </div>
  );
}