import m from 'mithril'
import {NavHelper} from './helpers/nav.ts'
import htmlPage from './common/htmlPage.ts'

export default async (
  reposConfig: any,
  eleventyConfig: any,
  data: any,
) => {
  const slugify = eleventyConfig.getFilter("slugify")
  const nav = NavHelper(reposConfig, slugify, data.branchInfo.repoName, data.branchInfo.branchName)

  const branchesWithWorkInProgress = data.branches.filter(branch => branch.ahead > 0)
  const branchesFullyMerged = data.branches.filter(branch => branch.ahead === 0)

  const branchCards = (branches) => {
    return m('ul', branches.map((branch) => {
      return branch.repoName === data.branchInfo.repoName ?
        m('li', [
          m('a', {
            href: `${data.reposPath}/${slugify(branch.repoName)}/branches/${slugify(branch.branchName)}/branches`
          }, branch.branchName),
          branch.branchName === data.branchInfo.branchName
            ? m('div', {class: "badge rounded-pill bg-secondary mx-1"}, 'current') : null,
          branch.branchName === data.reposConfig.repos[branch.repoName].defaultBranch
            ? m('div', {class: "badge rounded-pill bg-info text-dark mx-1"}, 'default') : null,
          m('ul', [
            m('li', [
              `${branch.ahead} commits ahead, ${branch.behind} commits behind `,
              m('span', {class: 'font-monospace'}, branch.compareTo)
            ]),
            branch.description ? m('li', branch.description) : null
          ]),
        ])
      : null
    }))
  }

  const pageContent = [
    m('h1', {class: 'fs-2'}, 'Branches with unmerged commits'),
    branchCards(branchesWithWorkInProgress),
    m('h1', {class: 'fs-2'}, 'Branches that are fully merged'),
    branchCards(branchesFullyMerged),
  ]

  return await htmlPage(reposConfig, eleventyConfig, data, pageContent)
}
