Welcome to BoraMart
<br>
<!-- Schema Sync UI -->
<button id="previewBtn">🔍 Preview Schema Changes</button><br><br>

<label><input type="checkbox" id="dropMissing"> Drop Missing Tables/Columns</label><br>
<label><input type="checkbox" id="modifyExisting" checked> Modify Existing Columns</label><br>
<label><input type="checkbox" id="force"> Force Apply</label><br><br>

<div id="previewLogs" style="white-space: pre-wrap; background: #f0f0f0; padding: 10px;"></div><br>

<button id="applyBtn" disabled>✅ Apply Changes</button>

<script>
const getSchemaOptions = () => ({
    dropMissing: document.getElementById('dropMissing').checked,
    modifyExisting: document.getElementById('modifyExisting').checked,
    force: document.getElementById('force').checked
});

document.getElementById('previewBtn').onclick = async () => {
    const options = getSchemaOptions();

    const res = await fetch('admin/schema/sync', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ ...options, dryRun: true })
    });

    const data = await res.json();
    document.getElementById('previewLogs').innerText = data.preview.join("\n");
    document.getElementById('applyBtn').disabled = !data.hasChanges;
};

document.getElementById('applyBtn').onclick = async () => {
    if (!confirm("Are you sure you want to apply the schema changes?")) return;

    const options = getSchemaOptions();

    const res = await fetch('admin/schema/sync', {
        method: 'PUT',
        headers: {
            'Content-Type': 'application/json',
            'X-CSRF-TOKEN': '...' // Add token logic here if needed
        },
        body: JSON.stringify(options)
    });

    const data = await res.json();
    alert("✅ Changes applied:\n" + data.applied);
};
</script>