#!/usr/bin/env python3
"""
Adds the missing Reorder Columns button + panel to the order modification tracking list template.
Run from WSL: python3 fix_reorder_column.py
"""

import os

FILE = (
    "/var/www/html/shopware/custom/plugins/SellopsLimitedOrderEditing"
    "/src/Resources/app/administration/src/module"
    "/sellops-order-modification-tracking/page"
    "/sellops-order-modification-tracking-list"
    "/sellops-order-modification-tracking-list.html.twig"
)

SEARCH = '            <sw-card :title="$tc(\'sellops-order-modification-tracking.list.gridTitle\')" style="margin: 0; max-width: 100%; width: 100%;" class="sellops-tracking-grid-card">'

REPLACEMENT = '''            {# Reorder Columns button #}
            <div style="display: flex; justify-content: flex-end; margin-bottom: 8px;">
                <button
                    @click="isColumnManagerOpen = !isColumnManagerOpen"
                    style="display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; background: #fff; border: 1px solid #d1d9e0; border-radius: 4px; font-size: 12px; color: #52667a; cursor: pointer;"
                >
                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                        <line x1="8" y1="6" x2="21" y2="6"/><line x1="8" y1="12" x2="21" y2="12"/><line x1="8" y1="18" x2="21" y2="18"/>
                        <line x1="3" y1="6" x2="3.01" y2="6"/><line x1="3" y1="12" x2="3.01" y2="12"/><line x1="3" y1="18" x2="3.01" y2="18"/>
                    </svg>
                    {{ $tc('sellops-order-modification-tracking.list.reorderColumns') }}
                </button>
            </div>

            {# Column Manager Panel #}
            <div v-if="isColumnManagerOpen" style="position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 1000;" @click.self="isColumnManagerOpen = false">
                <div style="position: absolute; top: 70px; right: 20px; background: #fff; border-radius: 8px; box-shadow: 0 4px 24px rgba(0,0,0,0.15); width: 260px; overflow: hidden;">
                    <div style="display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid #e8edf3; background: #f8f9fa;">
                        <span style="font-weight: 600; font-size: 13px; color: #1a2a4a;">{{ $tc('sellops-order-modification-tracking.list.reorderColumns') }}</span>
                        <button @click="isColumnManagerOpen = false" style="background: none; border: none; cursor: pointer; color: #8a9199; font-size: 16px; line-height: 1; padding: 0;">✕</button>
                    </div>
                    <div style="padding: 6px 0; max-height: 360px; overflow-y: auto;">
                        <div
                            v-for="(col, index) in orderedColumns"
                            :key="col.property"
                            draggable="true"
                            @dragstart="draggingColumnIndex = index"
                            @dragover.prevent="dragOverColumnIndex = index"
                            @drop="onColumnDrop(index)"
                            @dragend="onColumnDragEnd"
                            :style="{
                                display: 'flex',
                                alignItems: 'center',
                                gap: '10px',
                                padding: '8px 16px',
                                cursor: 'grab',
                                background: dragOverColumnIndex === index ? '#f0f4ff' : 'transparent',
                                borderBottom: '1px solid #f0f0f0',
                                fontSize: '13px',
                                color: '#2d3748',
                            }"
                        >
                            <span style="color: #b0bec5; font-size: 16px; letter-spacing: -2px; user-select: none;">⋮⋮</span>
                            <span>{{ col.label }}</span>
                        </div>
                    </div>
                    <div style="padding: 10px 16px; border-top: 1px solid #e8edf3; background: #f8f9fa;">
                        <button @click="resetColumnOrder(); isColumnManagerOpen = false" style="font-size: 12px; color: #189eff; background: none; border: none; cursor: pointer; padding: 0;">
                            {{ $tc('sellops-order-modification-tracking.list.resetColumnOrder') }}
                        </button>
                    </div>
                </div>
            </div>

''' + '            <sw-card :title="$tc(\'sellops-order-modification-tracking.list.gridTitle\')" style="margin: 0; max-width: 100%; width: 100%;" class="sellops-tracking-grid-card">'

def main():
    if not os.path.exists(FILE):
        print(f"ERROR: File not found: {FILE}")
        return

    with open(FILE, 'r', encoding='utf-8') as f:
        content = f.read()

    if SEARCH not in content:
        print("ERROR: Could not find the anchor string in the file.")
        print("The file may have already been patched, or the content changed.")
        return

    if 'isColumnManagerOpen' in content and 'v-for="(col, index) in orderedColumns"' in content:
        print("INFO: Column manager panel already present — no changes made.")
        return

    new_content = content.replace(SEARCH, REPLACEMENT, 1)

    with open(FILE, 'w', encoding='utf-8') as f:
        f.write(new_content)

    print("SUCCESS: Reorder Columns button and panel added.")
    print("Now add the missing translation keys and run: bin/build-administration.sh")

if __name__ == '__main__':
    main()