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.flatRel.repoName, data.flatRel.relName)

  const tags = data.flatRels.filter(rel => rel.type === "tag")

  const branchCards = (tags) => {
    return m('ul', tags.map((tag) => {
      return tag.repoName === data.flatRel.repoName ?
        m('li', [
          m('a', {
            href: `${data.reposPath}/${slugify(tag.repoName)}/tag/${slugify(tag.relName)}/tags`
          }, tag.relName),
          tag.relName === data.flatRel.relName
            ? m('div', {class: "badge rounded-pill bg-secondary mx-1"}, 'current') : null,
          m('ul', [
            tag.description ? m('li', tag.description) : null
          ]),
        ])
      : null
    }))
  }

  const pageContent = [
    m('h1', {class: 'fs-2'}, 'Tags'),
    branchCards(tags),
  ]

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