import type { UnitAlignOption, UnitAlignVersion, UnitDefInterface } from '@ablogcms/unit-editor/core/types/unit';
import Edit from './edit';
import InplaceEdit from './inplace-edit';

// ACMS.i18n は i18next の非同期初期化完了後に代入される関数のため、
// モジュール評価時点（import 時）に呼ぶと初期化未完了で TypeError になりうる。
// supports.align の呼び出し時点（i18n 初期化後）まで評価を遅延させる。
const getAlignOptions = (version: UnitAlignVersion): UnitAlignOption[] => {
  if (version === 'v2') {
    return [];
  }
  return [
    { value: 'center', label: ACMS.i18n('unit_editor.align.full') },
    { value: 'auto', label: ACMS.i18n('unit_editor.align.auto') },
  ];
};

const Custom: UnitDefInterface = {
  type: 'custom',
  name: 'カスタム',
  icon: 'build',
  edit: Edit,
  inplaceEdit: InplaceEdit,
  supports: {
    align: (version) => getAlignOptions(version),
    duplicate: (unit, editor) => {
      const element = editor.dom.querySelector<HTMLElement>(`[data-unit-id="${unit.id}"]`);
      if (element === null) {
        // ユニットの要素が取得できない場合は複製不可
        return false;
      }
      const input = element.querySelector<HTMLInputElement>(
        'input[name$=":extension"][value="image"], input[name$=":extension"][value="file"]'
      );
      if (input !== null) {
        // 画像フィールド or ファイルフィールドが含まれている場合は複製不可
        return false;
      }
      return true;
    },
    moveHierarchy: (unit, editor) => {
      const element = editor.dom.querySelector<HTMLElement>(`[data-unit-id="${unit.id}"]`);
      if (element === null) {
        // ユニットの要素が取得できない場合は階層移動不可
        return false;
      }
      const input = element.querySelector<HTMLInputElement>(
        'input[name$=":extension"][value="image"], input[name$=":extension"][value="file"]'
      );
      if (input !== null) {
        // 画像フィールド or ファイルフィールドが含まれている場合は階層移動不可
        return false;
      }
      return true;
    },
  },
};

export default Custom;
