import { getMemberToken } from '../../_lib/api';
import { DeleteAccountButton } from './DeleteAccountButton';
import { MemberLogoutButton } from './MemberLogoutButton';

export default async function MySettingsPage() {
  const token = await getMemberToken();
  if (!token) {
    return (
      <div className="max-w-2xl mx-auto mt-12 p-6 rounded-lg border border-yellow-200 bg-yellow-50">
        <h1 className="text-lg font-semibold text-yellow-800">Sign in required</h1>
        <p className="text-sm text-yellow-700">Complete onboarding to manage your account.</p>
      </div>
    );
  }

  return (
    <div className="max-w-2xl mx-auto mt-12 p-6 flex flex-col gap-6">
      <section className="rounded-xl border border-gray-200 bg-white p-5">
        <h2 className="text-base font-semibold mb-2">Session</h2>
        <p className="text-sm text-gray-600 mb-3">
          Sign out of your member portal. Your consent records are kept until you delete your account.
        </p>
        <MemberLogoutButton />
      </section>

      <section className="rounded-xl border border-red-200 bg-red-50 p-5">
        <h2 className="text-base font-semibold text-red-800 mb-2">Delete your account</h2>
        <p className="text-sm text-red-700 mb-3">
          This permanently deletes your TOWER user record, all consent records, opt-out history, and
          sessions. The messages themselves stay in their original groups. This cannot be undone.
        </p>
        <DeleteAccountButton />
      </section>
    </div>
  );
}