app-MAIL-temp/app/dashboard/templates/dashboard/domain_detail/auto-create.html

{% extends 'dashboard/domain_detail/base.html' %}

{% set domain_detail_page = "auto_create" %}

{% block title %}
  {{ custom_domain.domain }} Auto Create Rules
{% endblock %}

{% block domain_detail_content %}
  <h1 class="h2 mb-1"> {{ custom_domain.domain }} auto create alias rules </h1>
  <div>
    <span class="badge badge-info">Advanced</span>
    <span class="badge badge-warning">Beta</span>
  </div>



  {% if custom_domain.catch_all %}
    <div class="alert alert-warning mt-3">
      Rules are ineffective when catch-all is enabled.
    </div>
  {% endif %}

  <div class="{% if custom_domain.catch_all %} disabled-content {% endif %}">
    <div class="mt-3 mb-2">
      For a greater control than a simple catch-all, you can define a set of <b>rules</b> to auto create aliases. <br>
      A rule is based on a regular expression (<b>regex</b>): if an alias matches the expression, it'll be automatically
      created.
    </div>

    <div class="alert alert-info">
      Only the local part of the alias (i.e. <b>@{{ custom_domain.domain }}</b> is ignored) during the
      regex test.
    </div>

    <div class="alert alert-info">
      When there are several rules, rules will be evaluated by their order.
    </div>

    {% if custom_domain.auto_create_rules | length > 0 %}
      <div class="mt-2">
        {% for auto_create_rule in custom_domain.auto_create_rules %}
          <div class="card">
            <div class="card-body">
              Order: <b>{{ auto_create_rule.order }}</b> <br>
              <input readonly value="{{ auto_create_rule.regex }}" class="form-control">
              New alias will belong to
              {% for mailbox in auto_create_rule.mailboxes %}
                <b>{{ mailbox.email }}</b>
                {% if not loop.last %},{% endif %}
              {% endfor %}

              <form method="post" class="mt-2">
                <input type="hidden" name="form-name" value="delete-auto-create-rule">
                <input type="hidden" name="rule-id" value="{{ auto_create_rule.id }}">
                <button class="btn btn-outline-danger btn-sm float-right">Delete</button>
              </form>
            </div>
          </div>
        {% endfor %}
      </div>
    {% endif %}

    <div class="mt-2">
      <hr>
      <h3>New rule </h3>

      <form method="post" data-parsley-validate>
        <input type="hidden" name="form-name" value="create-auto-create-rule">
        {{ new_auto_create_rule_form.csrf_token }}


        <div class="form-group">
          <label>Regex</label>

          {{ new_auto_create_rule_form.regex(class="form-control",
              placeholder="prefix\..*",
              data_parsley_pattern="[0-9a-z-_.(\\\)(\*)(\|)]{1,}",
              data_parsley_trigger="change",
              data_parsley_error_message="Only lowercase letter, number, dot (.), dash (-), underscore (_), backslash (\), star (*)  are currently supported.") }}
          {{ render_field_errors(new_auto_create_rule_form.regex) }}

          <div class="small-text">
            For example, if you want aliases that starts with <b>prefix.</b> to be automatically created, you can set
            the
            regex to <em data-toggle="tooltip"
                         title="Click to copy"
                         class="clipboard"
                         data-clipboard-text="prefix\..*">prefix\..*</em>
            <br>

            If you want aliases that ends with <b>.suffix</b> to be automatically created, you can use the regex
            <em data-toggle="tooltip"
                title="Click to copy"
                class="clipboard"
                data-clipboard-text=".*\.suffix">.*\.suffix</em>
            <br>
            To test out regex, we recommend using regex tester tool like
            <a href="https://regex101.com" target="_blank">https://regex101.com↗</a>
          </div>
        </div>

        <div class="form-group">
          <label>Order</label>
          {{ new_auto_create_rule_form.order(class="form-control", placeholder="10", min=1, value=1, type="number") }}
          {{ render_field_errors(new_auto_create_rule_form.order) }}
        </div>

        <div class="form-group">
          <div class="flex-grow-1 mr-2">
            <select data-width="100%" required
                    class="mailbox-select" multiple name="mailbox_ids">
              {% for mailbox in mailboxes %}
                <option value="{{ mailbox.id }}" {% if mailbox.id == current_user.default_mailbox_id %}
                        selected {% endif %}>
                  {{ mailbox.email }}
                </option>
              {% endfor %}
            </select>
          </div>
        </div>

        <button class="btn btn-primary mt-2">Create</button>
      </form>

    </div>

  </div>


{% endblock %}

{% block script %}
  <script>
    $('.mailbox-select').multipleSelect();


  </script>
{% endblock %}