// 우측 하단 플로팅 4채널 — admin에서 순서 변경 가능 (cms_config.floating.order)
import { ICONS } from './icons.js';

const DEFAULT_ORDER = ['telegram', 'line', 'instagram', 'kakao'];
const META = {
  telegram:  { icon: ICONS.telegram,  cls: 'telegram'  },
  kakao:     { icon: ICONS.kakao,     cls: 'kakao'     },
  line:      { icon: ICONS.line,      cls: 'line'      },
  instagram: { icon: ICONS.instagram, cls: 'instagram' }
};

export function renderFloating(cms) {
  const cfg = cms.floating || {};
  const root = document.getElementById('floating-buttons');
  if (!root) return;

  // order 필드가 있으면 사용, 없으면 기본 순서. 누락 채널은 끝에 자동 추가.
  const customOrder = Array.isArray(cfg.order) ? cfg.order.filter(k => META[k]) : DEFAULT_ORDER;
  const order = [...customOrder];
  for (const k of DEFAULT_ORDER) {
    if (!order.includes(k)) order.push(k);
  }

  root.innerHTML = order.map(key => {
    const m = META[key];
    if (!m) return '';
    const ch = cfg[key] || {};
    const enabled = ch.enabled !== false;
    const url = ch.url || '#';
    const disabledCls = enabled ? '' : 'is-disabled';
    return `
      <a class="btn ${m.cls} ${disabledCls}" href="${enabled ? url : 'javascript:void(0)'}"
         target="_blank" rel="noopener" aria-label="${key}">
        ${m.icon}
      </a>
    `;
  }).join('');
}
