<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% if item %}Update{% else %}Add{% endif %} Item</title>
    {% include 'favicon.html' %}
    <link href="{{ url_for('static', filename='css/bootstrap.min.css') }}" rel="stylesheet">
</head>
<body>
    {% include 'header.html' %}
    <main class="container mt-5 pt-3">
        <h2>{% if item %}Update{% else %}Add{% endif %} Item</h2>

    <!-- Display error message if any -->
    {% if error %}
        <p>{{ error }}</p>
    {% endif %}

    <!-- Form for adding/updating an item -->
    <form method="POST">
        {% for attrib in item_attributes -%}
        <p>
            <label for="{{ attrib.attrib_name }}">{{ attrib.display_name }}:</label>
            {%- if attrib.html_input_type == "select" %}
            <!-- Dropdown for select fields -->
            <select id="{{ attrib.attrib_name }}" name="{{ attrib.attrib_name }}"
                {%- if attrib.required -%} required {%- endif -%}
            >
                {% for option in attrib.options -%}
                    <option value="{{ option }}"
                        {%- if attrib.default_val is not none and attrib.default_val == option %} selected {%- endif -%}>{{ option -}}
                    </option>
                {% endfor %}
            </select>
            {%- else %}
            <!-- Input field for other inputs -->
            <input id="{{ attrib.attrib_name }}" name="{{ attrib.attrib_name }}" type="{{ attrib.html_input_type }}"
                {%- if attrib.required %} required {%- endif %}
                {%- if attrib.min_val %} min="{{ attrib.min_val }}" {%- endif %}
                {%- if attrib.max_val %} max="{{ attrib.max_val }}" {%- endif %}
                {%- if attrib.step %} step="{{ attrib.step }}" {%- endif %}
                {%- if attrib.max_length %} maxlength="{{ attrib.max_length }}" {%- endif %}
                {%- if attrib.min_length %} minlength="{{ attrib.min_length }}" {%- endif %}
                {%- if attrib.regex %} pattern="{{ attrib.regex }}" {%- endif %}
                {%- if item %}
                    value="{{ item[attrib.attrib_name] }}"
                {%- else %}
                    {%- if attrib.default_val is not none %} value="{{ attrib.default_val }}" {%- endif %}
                {%- endif -%}
            />
            {%- endif %}
        </p>
        {% endfor %}
        <p><input type="submit" value="{% if item %}Update{% else %}Submit{% endif %}" /></p>
        <button type="button" onclick="window.location.href='/'">Cancel</button>
    </form>
    </main>
    <!-- Bootstrap JS (for dropdowns) -->
    <script src="{{ url_for('static', filename='js/bootstrap.bundle.min.js') }}"></script>
</body>
</html>