// app/faq-store.jsx — 자주묻는질문(FAQ) 공유 영속 스토어
// window.RibbonFaqStore 로 노출. data.jsx 다음에 로드(시드=window.RibbonData.FAQS).
//
// 문제: FAQ 관리 화면의 별(고정) 토글·등록·삭제가 컴포넌트 로컬 state 에만 있어
//  ① 사이드바 '고정 질문'에 즉시 반영 안 됨(사이드바는 정적 FAQS 를 읽음)
//  ② 새로고침하면 초기화(어디에도 저장 안 함).
// 해결: localStorage 영속 + 외부 스토어(useSyncExternalStore) 로 FaqManager·HistorySidebar 가
//  같은 상태를 구독 → 별을 누르면 두 곳이 즉시 갱신되고 새로고침해도 유지된다.

// ⚠️ 시드를 바꿀 때는 **버전을 올려야 한다.** localStorage 에 저장본이 있으면 시드는 읽히지
//    않으므로, 키를 그대로 두고 data.jsx 만 고치면 이미 이 화면을 써 본 브라우저에서는
//    (=시연 노트북) 아무것도 바뀌지 않는다. v2 = 고정 질문을 시연 대본 질문 4개로 교체(ALPACA-85).
//    버전을 올리면 사용자가 추가·고정한 것은 버려진다 — 이 목록은 시연용 스캐폴딩이라 그게 맞다.
const FAQ_KEY = 'ribbon.faqs.v2';
// 언어별 스토어(ALPACA-45): ko 는 접미사 없는 키, 그 외는 '<KEY>.<locale>'.
// 스카이(ja) 화면에 한국어 '경차' 고정 질문이 남던 문제 — 시드도 언어별(data.jsx FAQS_BY_LOCALE).
let _locale = 'ko';
function faqKey() { return _locale === 'ko' ? FAQ_KEY : `${FAQ_KEY}.${_locale}`; }

function faqSeed() {
  // 시드(최초/파싱실패) — data.jsx 의 언어별 FAQ 를 복제.
  const by = window.RibbonData.FAQS_BY_LOCALE || {};
  return (by[_locale] || window.RibbonData.FAQS || []).map((f) => ({ ...f }));
}
// 날짜가 든 시연 질문(dynamic)은 **저장본을 신뢰하지 않는다.** 하루만 지나도 과거 날짜가 되고,
// 그러면 요금 역산 툴이 「過去日」로 막아 시연의 마지막 장면이 통째로 죽는다.
// 그래서 로드할 때마다 seed 의 현재 문장으로 갈아끼운다 — 사용자가 고정/추가한 것은 그대로 둔다.
function refreshDynamic(list) {
  const seed = faqSeed();
  return list.map((f) => {
    const s = seed.find((x) => x.id === f.id && x.dynamic);
    return s && s.q !== f.q ? { ...f, q: s.q } : f;
  });
}
function faqLoad() {
  try {
    const a = JSON.parse(localStorage.getItem(faqKey()) || 'null');
    if (Array.isArray(a)) return refreshDynamic(a);
  } catch (e) {}
  return faqSeed();
}
function faqPersist(list) {
  try { localStorage.setItem(faqKey(), JSON.stringify(list)); } catch (e) {}
}

let _faqs = faqLoad();
const _subs = new Set();
function _emit(next) {
  _faqs = next;
  faqPersist(next);
  _subs.forEach((fn) => { try { fn(); } catch (e) {} });
}

const RibbonFaqStore = {
  // useSyncExternalStore 계약: getSnapshot 은 변경 없으면 동일 참조를 돌려줘야 한다(_faqs 는 set 때만 교체).
  get: () => _faqs,
  subscribe: (fn) => { _subs.add(fn); return () => _subs.delete(fn); },
  togglePin: (id) => _emit(_faqs.map((x) => (x.id === id ? { ...x, pinned: !x.pinned } : x))),
  add: (q, cat) => _emit([{ id: 'faq' + Date.now().toString(36), q, cat, uses: 0, pinned: false }, ..._faqs]),
  remove: (id) => _emit(_faqs.filter((x) => x.id !== id)),
  reset: () => _emit(faqSeed()),
  // 언어 전환(main.jsx 가 locale 변경 시 호출) — 그 언어의 저장본/시드로 교체. 저장은 하지 않는다(로드만).
  setLocale: (loc) => {
    const next = ['ko', 'ja', 'en', 'zh'].includes(loc) ? loc : 'ko';
    if (next === _locale) return;
    _locale = next;
    _faqs = faqLoad();
    _subs.forEach((fn) => { try { fn(); } catch (e) {} });
  },
};

// React 훅 — 구독형(FaqManager·HistorySidebar 공용). 변경 시 두 컴포넌트가 함께 리렌더.
function useFaqs() {
  return React.useSyncExternalStore(RibbonFaqStore.subscribe, RibbonFaqStore.get);
}

RibbonFaqStore.useFaqs = useFaqs;
window.RibbonFaqStore = RibbonFaqStore;
