frontend/marko/page/story/components/tags-page/component.js

const pluralize = require("pluralize")

// TODO: use graphql for this like with story categories
const kinds = ["Character", "Event", "Location", "Organization", "Series"]

module.exports = class {
  onCreate(input) {
    this.state = {
      tags: [],
      groups: [],
      modal: null,
    }

    this.update(input.tags)
  }

  open(modal) {
    this.state.modal = modal
  }

  close() {
    this.state.modal = null
  }

  update(newTags) {
    const tags = newTags.map(t => ({
      kind: t.kind,
      name: t.name,
      url: `/story/by-tag/${t.kind}/${encodeURIComponent(t.name)}`
    }))

    const groups = kinds.map(k => ({
      groupClass: "group-" + k.toLowerCase(),
      colorClass: "color-tag-" + k.toLowerCase(),
      header: pluralize(k),
      tags: tags.filter(t => t.kind === k),
    }))

    this.state = Object.assign({}, this.state, {
      tags: tags,
      groups: groups,
    })
  }
}