const {
  div, a, span, form, button, section, p,
  input, label, br, select, option, h2, textarea
} = require("../server/node_modules/hyperaxe");
const moment = require("../server/node_modules/moment");
const { template, i18n, userLink, renderSpreadButton, renderPrivacyChip, renderLifespanChip } = require('./main_views');
const { renderEncryptedChip: renderForumEncryptedChip } = require('./clearnet_view');
const { config } = require('../server/SSB_server.js');
const { renderUrl } = require('../backend/renderUrl');
const { renderTextWithStyles } = require('../backend/renderTextWithStyles');
const { sanitizeHtml } = require('../backend/sanitizeHtml');

const userId = config.keys.id;

exports.renderForumInvitePage = (code) => {
  const pageContent = div({ class: 'invite-page' },
    h2(i18n.tribeInviteCodeText, code),
    form({ method: 'GET', action: '/forum' },
      button({ type: 'submit', class: 'filter-btn' }, i18n.walletBack)
    )
  );
  return template(i18n.invitesForumsTitle || 'Forums', section(pageContent));
};

const BASE_FILTERS = ['hot','all','mine','recent','top'];
const CAT_BLOCK1 = ['GENERAL','OASIS','L.A.R.P.','POLITICS','TECH'];
const CAT_BLOCK2 = ['SCIENCE','MUSIC','ART','GAMING','BOOKS','FILMS'];
const CAT_BLOCK3 = ['PHILOSOPHY','SOCIETY','PRIVACY','CYBERWARFARE','SURVIVALISM'];
const ALL_CATS = [...CAT_BLOCK1, ...CAT_BLOCK2, ...CAT_BLOCK3];

const catKey = (c) => 'forumCat' + String(c || '').replace(/\./g,'').replace(/[\s-]/g,'').toUpperCase();
const catLabel = (c) => i18n[catKey(c)] || c;

const Z = 1.96;
function wilsonScore(pos, neg) {
  const n = (pos||0)+(neg||0);
  if (n === 0) return 0;
  const phat = pos / n, z2 = Z * Z;
  return (phat + z2/(2*n) - Z*Math.sqrt((phat*(1-phat)+z2/(4*n))/n)) / (1+z2/n);
}

function getFilteredForums(filter, forums) {
  const now = Date.now();
  if (filter === 'mine')    return forums.filter(f => f.author === userId);
  if (filter === 'recent')  return forums.filter(f => new Date(f.createdAt).getTime() >= now - 86400000);
  if (filter === 'top')     return forums.slice().sort((a,b) => b.score - a.score);
  if (filter === 'hot')     return forums
    .filter(f => new Date(f.createdAt).getTime() >= now - 86400000)
    .sort((a,b) => b.score - a.score);
  if (ALL_CATS.includes(filter))
    return forums.filter(f => f.category === filter);
  return forums;
}

const generateFilterButtons = (filters, currentFilter, action, i18nMap = {}) =>
  div({ class: 'filter-group' },
    filters.map(mode =>
      form({ method: 'GET', action },
        input({ type: 'hidden', name: 'filter', value: mode }),
        button({ type: 'submit', class: currentFilter === mode ? 'filter-btn active' : 'filter-btn' },
          String(i18nMap[mode] || mode).toUpperCase()
        )
      )
    )
  );

const renderCreateForumButton = () =>
  div({ class: 'forum-create-col' },
    form({ method: 'GET', action: '/forum' },
      button({ type: 'submit', name: 'filter', value: 'create', class: 'create-button' },
        i18n.forumCreateButton
      )
    )
  );

const renderVotes = (target, score, forumId) =>
  div({ class: 'forum-score-box' },
    form({ method: 'POST', action: `/forum/${encodeURIComponent(forumId)}/vote`, class: 'forum-score-form' },
      button({ name: 'value', value: 1, class: 'score-btn' }, '▲'),
      div({ class: 'score-total' }, String(score || 0)),
      button({ name: 'value', value: -1, class: 'score-btn' }, '▼'),
      input({ type: 'hidden', name: 'target', value: target }),
      input({ type: 'hidden', name: 'forumId', value: forumId })
    )
  );

const renderForumForm = () =>
  div({ class: 'forum-form' },
    form({ action: '/forum/create', method: 'POST' },
      label(i18n.forumCategoryLabel), br(),
      select({ name: 'category', required: true },
        ALL_CATS.map(cat => option({ value: cat }, catLabel(cat)))
      ), br(), br(),
      label(i18n.eventPrivacyLabel), br(),
      select({ name: 'isPublic', id: 'isPublic' },
        option({ value: 'public', selected: true }, i18n.eventPublic),
        option({ value: 'private' }, i18n.eventPrivate)
      ), br(), br(),
      label(i18n.forumTitleLabel), br(),
      input({
        type: 'text',
        name: 'title',
        required: true,
        placeholder: i18n.forumTitlePlaceholder
      }), br(), br(),
      label(i18n.forumMessageLabel), br(),
      textarea({
        name: 'text',
        required: true,
        rows: 4,
        placeholder: i18n.forumMessagePlaceholder
      }), br(), br(),
      button({ type: 'submit' }, i18n.forumCreateButton)
    )
  );

const renderThread = (nodes, level = 0, forumId) => {
  if (!Array.isArray(nodes)) return [];
  return [...nodes]
    .filter(m => (m && m.text && String(m.text).trim()) || (m && Array.isArray(m.children) && m.children.length))
    .sort((a, b) =>
      wilsonScore(b.positiveVotes, b.negativeVotes)
      - wilsonScore(a.positiveVotes, a.negativeVotes)
    )
    .flatMap((m, i) => {
      const isTopLevelWinner = level === 0 && i === 0;
      const classList = [
        'forum-comment',
        `level-${level}`,
        isTopLevelWinner ? 'highlighted-reply' : ''
      ].filter(Boolean).join(' ');

      const commentBox = div(
        { class: classList },
        div({ class: 'comment-header' },
          span({ class: 'date-link' },
            `${moment(m.timestamp).format('YYYY/MM/DD HH:mm:ss')} ${i18n.performed}`),
          userLink(m.author),
          div({ class: 'comment-votes' },
            span({ class: 'votes-count' }, `▲: ${m.positiveVotes || 0}`),
            span({ class: 'votes-count', style: 'margin-left:12px;' },
              `▼: ${m.negativeVotes || 0}`)
          )
        ),
        div({ class: 'comment-body-row' },
          div({ class: 'comment-vote-col' },
            renderVotes(m.key, m.score, forumId)
          ),
          div({ class: 'comment-text-col' },
            div(
              ...(m.text || '').split('\n')
                .map(l => l.trim())
                .filter(l => l)
                .map(l => p(...renderUrl(l)))
            )
          )
        ),
        div({ class: 'new-reply' },
          form({
            method: 'POST',
            action: `/forum/${encodeURIComponent(forumId)}/message`,
            class: 'comment-form'
          },
            input({ type: 'hidden', name: 'parentId', value: m.key }),
            textarea({
              name: 'message',
              rows: 2,
              required: true,
              placeholder: i18n.forumMessagePlaceholder,
              class: 'comment-textarea'
            }),
            button({ type: 'submit', class: 'forum-send-btn' }, 'Reply')
          )
        )
      );

      return [ commentBox, ...renderThread(m.children || [], level + 1, forumId) ];
    });
};

const renderForumList = (forums, currentFilter, spreadMap = new Map()) => {
  const visibleForums = (Array.isArray(forums) ? forums : []).filter(f =>
    (f && f.title && String(f.title).trim()) || (f && f.text && String(f.text).trim())
  )
  return div({ class: 'forum-list' },
    visibleForums.length
      ? visibleForums.map(f =>
        div({ class: 'forum-card' },
          div({ class: 'forum-score-col' },
            renderVotes(f.key, f.score, f.key)
          ),
          div({ class: 'forum-main-col' },
            div({ class: 'forum-header-row' },
              a({
                class: 'forum-category',
                href: `/forum?filter=${encodeURIComponent(f.category)}`
              }, `[${catLabel(f.category)}]`),
              a({
                class: 'forum-title',
                href: `/forum/${encodeURIComponent(f.key)}`
              }, f.title),
              f.isPrivate ? renderPrivacyChip(true, i18n) : null,
              f.isPrivate ? renderForumEncryptedChip(i18n) : null,
              renderLifespanChip(f.lifetime, i18n)
            ),
	    div({
	      class: 'forum-body',
	      innerHTML: sanitizeHtml(renderTextWithStyles(f.text || ''))
	    }),
            div({ class: 'forum-meta' },
              span({ class: 'forum-positive-votes' },
                `▲: ${f.positiveVotes || 0}`),
              span({ class: 'forum-negative-votes', style: 'margin-left:12px;' },
                `▼: ${f.negativeVotes || 0}`),
              span({ class: 'forum-participants' },
                `${i18n.forumParticipants.toUpperCase()}: ${f.participants?.length || 1}`),
              span({ class: 'forum-messages' },
                `${i18n.forumMessages.toUpperCase()}: ${(f.messagesCount || 1) - 1}`),
              form({ method: 'GET', action: `/forum/${encodeURIComponent(f.key)}`, class: 'visit-forum-form' },
                button({ type: 'submit', class: 'filter-btn' }, i18n.forumVisitButton)
              )
            ),
            (() => {
              const btn = renderSpreadButton(f.key, spreadMap.get(f.key));
              return btn ? div({ class: 'card-spread-left' }, btn) : null;
            })(),
            div({ class: 'forum-footer' },
              span({ class: 'date-link' },
                `${moment(f.createdAt).format('YYYY/MM/DD HH:mm:ss')} ${i18n.performed}`),
              userLink(f.author)
            ),
            currentFilter === 'mine' && f.author === userId
              ? div({ class: 'forum-owner-actions' },
                form({
                  method: 'POST',
                  action: `/forum/delete/${encodeURIComponent(f.key)}`,
                  class: 'forum-delete-form'
                },
                  button({ type: 'submit', class: 'delete-btn' },
                    i18n.forumDeleteButton)
                )
              )
              : null
          )
        )
      )
      : p(i18n.noForums)
  );
}

exports.forumView = async (forums, currentFilter, params = {}) => {
  const CAT_I18N_MAP_UP = ALL_CATS.reduce((m,c)=>{ m[c]=(catLabel(c)||c).toUpperCase(); return m; },{});
  return template(i18n.forumTitle,
    section(
      div({ class: 'tags-header' },
        h2(currentFilter === 'create'
          ? i18n.forumCreateSectionTitle
          : i18n.forumTitle),
        p(i18n.forumDescription)
      ),
      div({ class: 'mode-buttons-cols' },
        generateFilterButtons(BASE_FILTERS, currentFilter, '/forum', {
          hot: i18n.forumFilterHot,
          all: i18n.forumFilterAll,
          mine: i18n.forumFilterMine,
          recent: i18n.forumFilterRecent,
          top: i18n.forumFilterTop
        }),
        generateFilterButtons(CAT_BLOCK1, currentFilter, '/forum', CAT_I18N_MAP_UP),
        generateFilterButtons(CAT_BLOCK2, currentFilter, '/forum', CAT_I18N_MAP_UP),
        generateFilterButtons(CAT_BLOCK3, currentFilter, '/forum', CAT_I18N_MAP_UP),
        renderCreateForumButton()
      ),
      currentFilter === 'create'
        ? renderForumForm()
        : renderForumList(
          getFilteredForums(currentFilter || 'all', forums),
          currentFilter,
          params.spreadMap
        )
    )
  );
};

exports.singleForumView = async (forum, messagesData, currentFilter, topic = '') => {
  const CAT_I18N_MAP_UP = ALL_CATS.reduce((m,c)=>{ m[c]=(catLabel(c)||c).toUpperCase(); return m; },{});
  // móvil: subtopics — etiqueta opcional en los mensajes raíz → tira de pestañas + filtro por ?topic=
  const forumMobile = process.env.OASIS_MOBILE === '1';
  const rootMsgs = Array.isArray(messagesData.messages) ? messagesData.messages : [];
  const forumTopics = forumMobile ? [...new Set(rootMsgs.map(m => String(m.subtopic || '').trim()).filter(Boolean))] : [];
  const activeTopic = forumMobile ? String(topic || '').trim() : '';
  const shownMsgs = activeTopic ? rootMsgs.filter(m => String(m.subtopic || '').trim() === activeTopic) : rootMsgs;
  const topicStrip = (forumMobile && forumTopics.length)
    ? div({ class: 'forum-topics' },
        a({ class: activeTopic ? 'forum-topic-chip' : 'forum-topic-chip active', href: `/forum/${encodeURIComponent(forum.key)}` }, i18n.menuAll || 'All'),
        ...forumTopics.map(t => a({ class: t === activeTopic ? 'forum-topic-chip active' : 'forum-topic-chip', href: `/forum/${encodeURIComponent(forum.key)}?topic=${encodeURIComponent(t)}` }, t))
      )
    : null;
  return template(forum.title,
    section(
      div({ class: 'tags-header' },
        h2(i18n.forumTitle),
        p(i18n.forumDescription)
      ),
       div({ class: 'mode-buttons-cols' },
        generateFilterButtons(BASE_FILTERS, currentFilter, '/forum', {
          hot: i18n.forumFilterHot,
          all: i18n.forumFilterAll,
          mine: i18n.forumFilterMine,
          recent: i18n.forumFilterRecent,
          top: i18n.forumFilterTop
        }),
        generateFilterButtons(CAT_BLOCK1, currentFilter, '/forum', CAT_I18N_MAP_UP),
        generateFilterButtons(CAT_BLOCK2, currentFilter, '/forum', CAT_I18N_MAP_UP),
        generateFilterButtons(CAT_BLOCK3, currentFilter, '/forum', CAT_I18N_MAP_UP),
        renderCreateForumButton()
      )
    ),
    div({ class: 'forum-thread-container' },
      topicStrip,
      div({
        class: 'forum-card forum-thread-header',
        style: 'display:flex;align-items:flex-start;'
      },
        div({
          class: 'root-vote-col',
          style: 'width:60px;text-align:center;'
        }, renderVotes(
          forum.key,
          messagesData.totalScore,
          forum.key
        )),
        div({
          class: 'forum-main-col',
          style: 'flex:1;padding-left:10px;'
        },
          div({ class: 'forum-header-row' },
            a({
              class: 'forum-category',
              href: `/forum?filter=${encodeURIComponent(forum.category)}`
            }, `[${catLabel(forum.category)}]`),
            a({
              class: 'forum-title',
              href: `/forum/${encodeURIComponent(forum.key)}`
            }, forum.title),
            forum.isPrivate ? renderPrivacyChip(true, i18n) : null,
            forum.isPrivate ? renderForumEncryptedChip(i18n) : null,
            renderLifespanChip(forum.lifetime, i18n),
            (forum.isPrivate && forum.author === userId)
              ? form({ method: 'POST', action: `/forum/generate-invite/${encodeURIComponent(forum.key)}`, class: 'forum-invite-form' },
                  button({ type: 'submit', class: 'tribe-action-btn' }, i18n.tribeGenerateInvite))
              : null,
            (forum.isPrivate && forum.author === userId && !forum.openInviteCode)
              ? form({ method: 'POST', action: `/forum/open-invite/create/${encodeURIComponent(forum.key)}`, class: 'forum-invite-form' },
                  button({ type: 'submit', class: 'tribe-action-btn' }, i18n.tribeOpenInvitation))
              : null,
            (forum.isPrivate && forum.author === userId && forum.openInviteCode)
              ? span({ class: 'tribe-open-invite' },
                  span({ class: 'card-label' }, i18n.tribeInviteCodeText),
                  span({ class: 'tribe-open-invite-code' }, forum.openInviteCode))
              : null,
            (forum.isPrivate && forum.author === userId && forum.openInviteCode)
              ? form({ method: 'POST', action: `/forum/open-invite/remove/${encodeURIComponent(forum.key)}`, class: 'forum-invite-form' },
                  button({ type: 'submit', class: 'tribe-action-btn danger-btn' }, i18n.tribeRemoveInvitation))
              : null,
            (forum.isPrivate && forum.author !== userId)
              ? a({ class: 'tribe-action-btn', href: '/invites#invites-forums' }, i18n.tribeEnterInvite)
              : null,
            (forum.author === userId)
              ? form({ method: 'POST', action: `/forum/delete/${encodeURIComponent(forum.key)}`, class: 'forum-delete-form' },
                  button({ type: 'submit', class: 'tribe-action-btn danger-btn' }, i18n.forumDeleteButton))
              : null
          ),
	  div({
	    class: 'forum-body',
	    innerHTML: sanitizeHtml(renderTextWithStyles(forum.text || ''))
	  }),
          div({ class: 'forum-meta' },
            span({ class: 'votes-count' },
              `▲: ${messagesData.positiveVotes}`),
            span({
              class: 'votes-count',
              style: 'margin-left:12px;'
            }, `▼: ${messagesData.negativeVotes}`),
            span({ class: 'forum-participants' },
              `${i18n.forumParticipants.toUpperCase()}: ${forum.participants?.length || 1}`),
            span({ class: 'forum-messages' },
              `${i18n.forumMessages.toUpperCase()}: ${messagesData.total}`)
          ),
          (() => {
            const btn = renderSpreadButton(forum.key);
            return btn ? div({ class: 'card-spread-left' }, btn) : null;
          })(),
          div({ class: 'forum-footer' },
            span({ class: 'date-link' },
              `${moment(forum.createdAt).format('YYYY/MM/DD HH:mm:ss')} ${i18n.performed}`),
            userLink(forum.author)
          )
        )
      ),
      div({
        class: 'new-message-wrapper',
        style: 'margin-top:12px;'
      },
        form({
          method: 'POST',
          action: `/forum/${encodeURIComponent(forum.key)}/message`,
          class: 'new-message-form'
        },
          forumMobile ? input({ type: 'text', name: 'subtopic', value: activeTopic, placeholder: 'Topic (optional)', class: 'forum-topic-input' }) : null,
          textarea({
            name: 'message',
            rows: 4,
            required: true,
            placeholder: i18n.forumMessagePlaceholder,
            style: 'width:100%;'
          }), br(),
          button({
            type: 'submit',
            class: 'forum-send-btn',
            style: 'margin-top:4px;'
          }, i18n.forumSendButton)
        )
      ),
      ...renderThread(shownMsgs, 0, forum.key)
    )
  );
};