{{! Migration Dialog — Chroniques de l'Étrange }}
<div class="cde-migration-body">

  {{! Drop zone / file picker }}
  <div class="cde-migration-drop-zone">
    <i class="fa-solid fa-file-import cde-migration-drop-icon"></i>
    <p class="cde-migration-drop-hint">{{ localize "CDE.MigrationDropHint" }}</p>
    <label class="cde-migration-file-btn">
      <i class="fa-solid fa-folder-open"></i>
      {{ localize "CDE.MigrationChooseFiles" }}
      <input type="file" class="cde-migration-file-input" accept=".json" multiple hidden>
    </label>
  </div>

  {{! Preview table }}
  {{#if hasPending}}
  <div class="cde-migration-preview">
    <div class="cde-migration-preview-header">
      <span>{{ localize "CDE.MigrationPreviewTitle" }}</span>
      <button type="button" class="cde-migration-clear-btn" data-action="clearFiles">
        <i class="fa-solid fa-xmark"></i>
        {{ localize "CDE.MigrationClear" }}
      </button>
    </div>
    <table class="cde-migration-table">
      <thead>
        <tr>
          <th></th>
          <th>{{ localize "CDE.MigrationColName" }}</th>
          <th>{{ localize "CDE.MigrationColType" }}</th>
          <th>{{ localize "CDE.MigrationColItems" }}</th>
          <th>{{ localize "CDE.MigrationColFile" }}</th>
        </tr>
      </thead>
      <tbody>
        {{#each pending}}
        <tr>
          <td><img src="{{img}}" class="cde-migration-thumb" alt=""></td>
          <td class="cde-migration-name">{{name}}</td>
          <td>
            <span class="cde-migration-type-badge cde-migration-type-{{type}}">
              {{#if (eq type "character")}}
                <i class="fa-solid fa-user"></i> Personnage
              {{else}}
                <i class="fa-solid fa-skull"></i> PNJ
              {{/if}}
            </span>
          </td>
          <td class="cde-migration-items-count">{{items.length}}</td>
          <td class="cde-migration-srcfile">{{_srcFile}}</td>
        </tr>
        {{/each}}
      </tbody>
    </table>
  </div>
  {{/if}}

  {{! Errors }}
  {{#if hasErrors}}
  <ul class="cde-migration-errors">
    {{#each errors}}
    <li><i class="fa-solid fa-triangle-exclamation"></i> {{this}}</li>
    {{/each}}
  </ul>
  {{/if}}

  {{! Action bar }}
  <div class="cde-migration-actions">
    {{#if hasPending}}
    <button type="button" class="cde-migration-import-btn" data-action="doImport">
      <i class="fa-solid fa-download"></i>
      {{ localize "CDE.MigrationImport" }} ({{count}})
    </button>
    {{else}}
    <p class="cde-migration-hint">{{ localize "CDE.MigrationHint" }}</p>
    {{/if}}
  </div>

</div>