{% extends "admin/dj_redis_panel/base.html" %}
{% load i18n static dcr_icons %}

{% block panel_breadcrumbs %}
{{ block.super }}
&rsaquo; <a href="{% url 'dj_redis_panel:instance_overview' instance_alias %}">{{ instance_alias }}</a>
&rsaquo; <a href="{% url 'dj_redis_panel:key_search' instance_alias selected_db %}">{% trans "Search Keys" %} (db:{{ selected_db }})</a>
&rsaquo; {% trans "Add New Key" %}
{% endblock %}

{% block panel_content %}

{% if success_message %}
<div class="dcr-callout dcr-callout--success">
  <p class="dcr-callout__body">{{ success_message }}</p>
</div>
{% endif %}

{% if error_message %}
<div class="dcr-callout dcr-callout--danger">
  <p class="dcr-callout__title">{% trans "Error" %}</p>
  <p class="dcr-callout__body">{{ error_message }}</p>
</div>
{% endif %}

<a href="{% url 'dj_redis_panel:key_search' instance_alias selected_db %}" class="dcr-back-link">{% trans "Back to Key Search" %}</a>

<div class="dcr-page-header">
  <div class="dcr-page-header__main">
    <div class="dcr-page-header__icon dcr-icon-color--accent">
      {% dcr_icon "database" %}
    </div>
    <div class="dcr-page-header__body">
      <div class="dcr-page-header__title-row">
        <h1 class="dcr-page-header__title">{% trans "Add New Key" %}</h1>
      </div>
      <p class="dcr-page-header__subtitle dcr-font-mono">{{ instance_alias }}::DB{{ selected_db }}</p>
    </div>
  </div>
</div>

{% if not allow_key_edit %}
<div class="dcr-empty">
  <h2 class="dcr-empty__title">{% trans "Key creation is disabled for this instance" %}</h2>
  <p class="dcr-empty__body">{% trans "Enable ALLOW_KEY_EDIT in your configuration to create new keys." %}</p>
  <div class="dcr-empty__links">
    <a href="{% url 'dj_redis_panel:key_search' instance_alias selected_db %}" class="dcr-btn dcr-btn--primary">{% trans "Back to Key Search" %}</a>
  </div>
</div>
{% else %}

<div class="dcr-section-header">
  <h3 class="dcr-section-header__title">{% trans "Redis Key Types:" %}</h3>
</div>
<div class="dcr-data-table dcr-mb-lg">
  <div class="dcr-data-table__scroll">
    <table>
      <thead>
        <tr>
          <th>{% trans "Type" %}</th>
          <th>{% trans "Description" %}</th>
          <th>{% trans "Use Cases" %}</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td><strong>{% trans "String" %}</strong></td>
          <td>{% trans "Simple text or binary data value" %}</td>
          <td>{% trans "Caching, counters, flags, JSON data" %}</td>
        </tr>
        <tr>
          <td><strong>{% trans "List" %}</strong></td>
          <td>{% trans "Ordered collection of strings" %}</td>
          <td>{% trans "Queues, activity feeds, recent items" %}</td>
        </tr>
        <tr>
          <td><strong>{% trans "Set" %}</strong></td>
          <td>{% trans "Unordered collection of unique strings" %}</td>
          <td>{% trans "Tags, unique visitors, permissions" %}</td>
        </tr>
        <tr>
          <td><strong>{% trans "Sorted Set" %}</strong></td>
          <td>{% trans "Ordered collection of unique strings with scores" %}</td>
          <td>{% trans "Leaderboards, rankings, time-series data" %}</td>
        </tr>
        <tr>
          <td><strong>{% trans "Hash" %}</strong></td>
          <td>{% trans "Collection of field-value pairs" %}</td>
          <td>{% trans "User profiles, settings, object storage" %}</td>
        </tr>
      </tbody>
    </table>
  </div>
</div>
<p class="dcr-text-muted dcr-mb-lg">
  {% trans "The key will be created with a placeholder item that you can edit or delete. After creation, you will be redirected to the key detail page where you can manage the content." %}
</p>

<form method="post" class="dcr-form dcr-form--flush">
  {% csrf_token %}
  <div class="dcr-form__row">
    <div class="dcr-field dcr-field--grow">
      <label class="dcr-field__label" for="id_key_name">{% trans "Key Name" %}</label>
      <input type="text" id="id_key_name" name="key_name" value="{{ request.POST.key_name|default:'' }}"
             class="dcr-input" required maxlength="512" placeholder="{% trans 'Enter key name' %}">
    </div>
  </div>
  <p class="dcr-text-muted dcr-text-sm">{% trans "The name for your new Redis key. Must be unique within this database." %}</p>

  <div class="dcr-form__row">
    <div class="dcr-field dcr-field--grow">
      <label class="dcr-field__label" for="id_key_type">{% trans "Key Type" %}</label>
      <select id="id_key_type" name="key_type" class="dcr-select" required>
        <option value="string" {% if request.POST.key_type == 'string' or not request.POST.key_type %}selected{% endif %}>
          {% trans "String" %}
        </option>
        <option value="list" {% if request.POST.key_type == 'list' %}selected{% endif %}>
          {% trans "List" %}
        </option>
        <option value="set" {% if request.POST.key_type == 'set' %}selected{% endif %}>
          {% trans "Set" %}
        </option>
        <option value="zset" {% if request.POST.key_type == 'zset' %}selected{% endif %}>
          {% trans "Sorted Set (ZSet)" %}
        </option>
        <option value="hash" {% if request.POST.key_type == 'hash' %}selected{% endif %}>
          {% trans "Hash" %}
        </option>
      </select>
    </div>
  </div>
  <p class="dcr-text-muted dcr-text-sm">{% trans "Select the type of Redis data structure for this key." %}</p>

  <div class="dcr-form__row">
    <button type="submit" name="_save" class="dcr-btn dcr-btn--primary">{% trans "Create Key" %}</button>
  </div>
</form>
{% endif %}

{% endblock %}