<?php // Profile editing page: separate forms for username, email, password, and notifications.?>
<div class="profile-page">
    <h1>Profile settings</h1>
    <?php include __DIR__ . '/../partials/flash.php'; ?>

    <section class="profile-section">
        <h2>Username</h2>
        <form method="POST" action="/profile/username" class="profile-form">
            <?= \App\Csrf::field() ?>
            <label for="username">Username</label>
            <input type="text" id="username" name="username"
                   value="<?= htmlspecialchars($user['username']) ?>"
                   required pattern="[a-zA-Z0-9_]{3,20}">
            <button type="submit">Update username</button>
        </form>
    </section>

    <section class="profile-section">
        <h2>Email</h2>
        <p class="hint">Changing your email will require re-verification.</p>
        <form method="POST" action="/profile/email" class="profile-form">
            <?= \App\Csrf::field() ?>
            <label for="email">Email</label>
            <input type="email" id="email" name="email"
                   value="<?= htmlspecialchars($user['email']) ?>" required>
            <button type="submit">Update email</button>
        </form>
    </section>

    <section class="profile-section">
        <h2>Password</h2>
        <form method="POST" action="/profile/password" class="profile-form">
            <?= \App\Csrf::field() ?>
            <label for="current_password">Current password</label>
            <input type="password" id="current_password" name="current_password" required>

            <label for="new_password">New password</label>
            <input type="password" id="new_password" name="new_password" required minlength="8">

            <label for="new_password_confirm">Confirm new password</label>
            <input type="password" id="new_password_confirm" name="new_password_confirm" required minlength="8">

            <button type="submit">Update password</button>
        </form>
    </section>

    <section class="profile-section">
        <h2>Notifications</h2>
        <form method="POST" action="/profile/notifications" class="profile-form">
            <?= \App\Csrf::field() ?>
            <label class="checkbox-label">
                <input type="checkbox" name="notify_comments"
                       <?= $user['notify_comments'] ? 'checked' : '' ?>>
                Email me when someone comments on my posts
            </label>
            <button type="submit">Save preferences</button>
        </form>
    </section>
</div>