{% extends "base.html" %}
{% import 'components/macros.html' as ui %}

{% block title %}Bulk Import Products{% endblock %}
{% block head_extra %}
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="/static/hil-pages/bulk_import_products.css">
{% endblock %}
{% block content %}
<div class="container">
    <div class="card">
        <h2>Bulk Import Products (CSV)</h2>
        <p>Upload a CSV file to add or restock products in bulk. The import runs through a progress page so large files can finish reliably.</p>

        <div class="safety-note">
            Recovery reminder: if products are missing after an app update, upload your last downloaded inventory CSV here. After a successful import, open <a href="/ai-csv-agent">AI CSV Agent</a>, regenerate the CSV, and download a fresh personal backup.
        </div>

        {% with messages = get_flashed_messages(with_categories=true) %}
            {% if messages %}
                {% for category, message in messages %}
                    <p class="flash-{{ category }}">{{ message }}</p>
                {% endfor %}
            {% endif %}
        {% endwith %}

        <form method="POST" action="/bulk-import-products" enctype="multipart/form-data">
            <label for="csv_file">Select CSV file</label>
            <input type="file" id="csv_file" name="csv_file" accept=".csv" required>
            <button type="submit">Import Products</button>
        </form>

        <div class="hint">
            <strong>CSV format:</strong><br>
            The first row must be headers. Required columns:
            <ul>
                <li><code>name</code> - Product name (required)</li>
                <li><code>price</code> - Selling price as a number (required)</li>
                <li><code>buying_price</code> - Buying/cost price (optional, defaults to 0)</li>
                <li><code>stock</code> - Initial stock quantity (optional, defaults to 0)</li>
                <li><code>barcode</code> or <code>product_code</code> - Barcode/SKU/product code, including codes like P001 (optional)</li>
                <li><code>product_id</code> - Numeric custom shop product ID (optional)</li>
                <li><code>fund_source</code> - business, personal, or loans (optional)</li>
                <li><code>item_type</code> - product or service (optional)</li>
            </ul>
            Existing products are updated/restocked when the CSV matches by <code>product_id</code>, <code>product_code</code>, <code>barcode</code>, or name.
            Alternate headers also work, such as <code>product</code>, <code>product_name</code>, <code>selling_price</code>, <code>unit_price</code>, <code>quantity</code>, <code>sku</code>, <code>product_sku</code>, and <code>cost_price</code>. Currency text like <code>KSh 1,200</code> is accepted.<br><br>
            <strong>Example:</strong><br>
            <code>name,price,buying_price,stock,barcode,product_id,fund_source,item_type<br>
            Shampoo,250,180,100,SHAM001,101,business,product<br>
            Conditioner,300,220,80,COND001,102,business,product</code>
        </div>

        <br>
        <a href="/ai-csv-agent">Regenerate / Download Inventory CSV</a><br>
        <a href="/inventory">Back to Inventory</a>
    </div>
</div>
{% endblock %}