{% import 'macros/forms.html' as forms %}

{% extends "auth/layout.html" %}

{% block head_title %}
  {% if finalize %}
    {{ _('Finalize sign up') }}
  {% else %}
    {{ _('Sign up') }}
  {% endif %}
{% endblock %}

{% block title %}
  {% if finalize %}
    {{ _('Finalize sign up') }}
  {% else %}
    {{ _('Sign up') }}
  {% endif %}
{% endblock %}

{% block auth_form %}
  <form method="POST" action="{{ tenant.url_path_for(request, 'register:register') }}" novalidate>
    <div class="space-y-4">
      {{ forms.form_field(form.email) }}
      {% if form.password %}
        {{ forms.form_field(form.password) }}
      {% endif %}
      {% for field in form.fields %}
        {{ forms.form_field(field) }}
      {% endfor %}
      {{ forms.form_csrf_token(form) }}
    </div>
    {% if finalize %}
      <div class="flex items-center justify-end">
        <button type="submit" class="btn bg-primary hover:bg-primary-hover text-white">{{ _('Finalize sign up') }}</button>
      </div>
    {% else %}
      <div class="flex items-center justify-between mt-6">
        <div class="mr-1">
          <a class="text-sm underline hover:no-underline" href="{{ tenant.url_path_for(request, 'auth:login') }}">{{ _('I already have an account') }}</a>
        </div>
        <button type="submit" class="btn bg-primary hover:bg-primary-hover text-white ml-3">{{ _('Sign up') }}</button>
      </div>
    {% endif %}
  </form>
  {% if not finalize and oauth_providers | length > 0 %}
    <div class="pt-5 mt-6 border-t border-light space-y-2">
      {% for oauth_provider in oauth_providers %}
        {% set display_name, logo_svg = get_oauth_provider_branding(oauth_provider) %}
        <a href="{{ url_for('oauth:authorize') }}?tenant={{ tenant.id }}&provider={{ oauth_provider.id }}" class="btn w-full justify-start border border-primary hover:border-primary-hover text-primary-500 hover:text-primary-hover">
          {% if logo_svg %}
            <img src="data:image/svg+xml;base64,{{ logo_svg }}" class="w-4 mr-4" />
          {% endif %}
          {{ _('Sign up with %(provider)s', provider=display_name) }}
        </a>
      {% endfor %}
    </div>
  {% endif %}
{% endblock %}
