{% extends "layouts/base.html" %}
{% block body %}
<h1>Update your user details</h1>
{% if error %}
<div class="alert alert-danger">
    Error: {{ error }}
</div>
{% endif %}
{% if success %}
<div class="alert alert-success">
    Your details have been updated.
</div>
{% endif %}
<form 
    id="register-form"
    enctype="multipart/form-data"
    method="post"
>
    <div class="mb-3">
        <label for="handle" class="form-label">Handle</label>
        <input
            id="handle" name="handle" type="text"
            minlength="2"
            maxlength="255"
            required
            class="form-control"
            value="{{ user.handle }}"
        />
    </div>
    <div class="mb-3">
        <label for="email">Email</label>
        <input
            id="email" name="email" type="email"
            required
            class="form-control"
            value="{{ user.email }}"
        />
    </div>
    <div class="mb-3">
        <label for="full_name">Full name</label>
        <input
            id="full_name" name="full_name" type="text"
            maxlength="255"
            class="form-control"
            value="{{ user.full_name or '' }}"
        />
    </div>
    <div class="mb-3">
        <label for="website">Public website</label>
        <input
            id="website" name="website" type="url"
            maxlength="512"
            class="form-control"
            value="{{ user.website or '' }}"
        />
    </div>
    <div class="mb-3">
        <label for="picture">Profile picture</label>
        <!-- for now, no JPEG -->
        <input
            id="picture" name="picture"
            type="file"
            accept="image/gif, image/png, image/jpeg"
            class="form-control"
        >

    </div>
    <button type="submit" class="btn btn-primary">
        Update details
    </button>
</form>
{% endblock %}