{"version":3,"file":"content-6d574d5d.js","sources":["../../../app/frontend/lib/explorer/src/routes/content/content.tsx"],"sourcesContent":["import { createResource, createSignal, For, onCleanup, Suspense } from \"solid-js\";\nimport { setActivePage } from \"../../App\";\nimport { Icon } from \"@components/Icon\";\nimport { ContentRow } from \"@components/RelatedContent\";\nimport { CIVILIZATION_BY_SLUG } from \"../../config\";\nimport { ContentItem, getRelatedContent } from \"../../query/content\";\nimport { mainIntroductionCSSClass, mainItemTitleCSSClass, secondaryButtonClass } from \"../../styles\";\nimport { hideNav, setHideNav } from \"../../global\";\nimport { useLocation, useParams } from \"@solidjs/router\";\n\nconst defaultLimit = 12;\nexport const ContentOverviewRoute = () => {\n  const params = useParams();\n  const civ = CIVILIZATION_BY_SLUG[params.civ];\n  const [content] = createResource(() => ({ civilization: civ, featured: false }), getRelatedContent);\n  const [limit, setLimit] = createSignal(defaultLimit);\n  const [showFilter, setShowFilter] = createSignal(false);\n  const [filters, setFilters] = createSignal<{ [key: string]: string[] }>({});\n  setHideNav(true);\n  onCleanup(() => setHideNav(false));\n\n  const toggleFilter = (key: string, value: string) => {\n    const current = filters()[key] || [];\n    if (current.includes(value)) {\n      setFilters({ ...filters(), [key]: current.filter((v) => v !== value) });\n    } else {\n      setFilters({ ...filters(), [key]: [...current, value] });\n    }\n  };\n  const availableFilters = () => getFilterableProperties(content());\n  const possibleFilters = () => getFilterableProperties(filtered());\n\n  const filtered = () => {\n    if (!content()) return undefined;\n    return filterContent(content(), availableFilters(), filters());\n  };\n\n  setActivePage({ title: `Curated Content ${civ ? ` — ${civ?.name}` : \"\"}`, location: useLocation() });\n\n  return (\n    <div class=\"max-w-screen-2xl mx-auto p-4 md:p-8\">\n      <div class=\"flex flex-col gap-8\">\n        <div class=\"flex flex-col justify-center lg:flex-row gap-8\">\n          <div class={`basis-1/3 grow-0 flex-col gap-8 ${showFilter() ? \"flex\" : \"hidden lg:flex\"} `}>\n            <div class=\" bg-gray-700 rounded-2xl p-6\">\n              <h3 class=\"mb-4 font-bold\">\n                <Icon icon=\"filter\" class=\"mx-2\" />\n                Filter\n              </h3>\n              <div class=\"flex flex-col gap-4\">\n                <For each={possibleFilters()}>\n                  {(filter) => (\n                    <div class=\"flex flex-col gap-2 mb-3\">\n                      <h4 class=\"text-xs font-bold uppercase text-gray-300 pl-2 mb-2\">{filter.label}</h4>\n                      <div class=\"flex flex-wrap gap-y-2 gap-x-1\">\n                        <For each={Object.entries(filter.values)}>\n                          {([value, count]) => {\n                            const active = (filters()[filter.key] || []).includes(value);\n                            return (\n                              <button\n                                class={`inline-flex items-center gap-2 px-3 py-1 rounded-full text-sm transition ${\n                                  active ? \"bg-gray-100 text-gray-600\" : \"bg-gray-500 text-gray-100 \"\n                                }`}\n                                onClick={() => toggleFilter(filter.key, value)}\n                              >\n                                {value}\n                                {active ? <Icon icon=\"xmark\" /> : <span class=\"text-gray-300 text-xs\">{count}</span>}\n                              </button>\n                            );\n                          }}\n                        </For>\n                      </div>\n                    </div>\n                  )}\n                </For>\n              </div>\n            </div>\n          </div>\n          <div class=\"basis-3/5 max-w-screen-lg grow-0 flex flex-col gap-4\">\n            <div class=\"my-6\">\n              <h3 class={mainItemTitleCSSClass}>Curated Content</h3>\n\n              <p class={mainIntroductionCSSClass}>\n                Useful guides, build orders, tips and tricks created by the AOE IV community, carefully curated by AoE4 World.\n              </p>\n              <p class=\"max-w-prose text-gray-300 mb-6\">\n                Are you a content creator or know of great additions to this list? Make sure to{\" \"}\n                <a href=\"https://airtable.com/shraFjFgC03xmCgZj\" target=\"_blank\" class=\"underline font-bold\">\n                  submit\n                </a>{\" \"}\n                your suggestions.\n              </p>\n              <div class=\"flex flex-row gap-4\">\n                <button class={secondaryButtonClass + (showFilter() ? \" hidden\" : \" lg:hidden\")} onClick={() => setShowFilter(true)}>\n                  <Icon icon=\"filter\" /> Filter...\n                </button>\n                <a href=\"https://airtable.com/shraFjFgC03xmCgZj\" target=\"_blank\" class={secondaryButtonClass}>\n                  <Icon icon=\"plus\" /> Suggest content\n                </a>\n              </div>\n            </div>\n            <Suspense>\n              <div class=\"flex flex-col gap-8\">\n                <For each={filtered()?.slice(0, limit())}>{(content) => <ContentRow content={content} civ={civ} />}</For>\n                {filtered()?.length > limit() && (\n                  <button onClick={() => setLimit(limit() * 2)} class=\"text-gray-300 hover:text-gray-100 font-bold bg-gray-500 p-4 roudned-lg\">\n                    Load more\n                  </button>\n                )}\n              </div>\n            </Suspense>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\ninterface ContentFilter {\n  key: keyof ContentItem;\n  filter: (value: string[], item: ContentItem) => boolean;\n  label: string;\n  values: Record<string, number>;\n}\n\nfunction getFilterableProperties(content: ContentItem[]): ContentFilter[] {\n  if (!content) return [];\n  const creators = new Map<string, number>();\n  const tags = new Map<string, number>();\n  const types = new Map<string, number>();\n  const civilizations = new Map<string, number>();\n\n  function increaseCount(map: Map<string, number>, key: string) {\n    const current = map.get(key) || 0;\n    map.set(key, current + 1);\n  }\n\n  content.forEach((content) => {\n    content.tags.forEach((tag) => increaseCount(tags, tag));\n    content.civilizations.forEach((civ) => increaseCount(civilizations, civ));\n    increaseCount(types, content.type);\n    increaseCount(creators, content.creator);\n  });\n\n  function getAvailableContentCount(key: keyof ContentItem, value: string) {\n    return content.filter((c) => c[key] === value).length;\n  }\n\n  // Sort all sets by count and turn them into an object\n  function getValues(map: Map<string, number>) {\n    return Object.fromEntries([...map.entries()].sort((a, b) => b[1] - a[1]));\n  }\n\n  return [\n    {\n      key: \"tags\",\n      filter: (value, item) => value.every((v) => item.tags.includes(v)),\n      label: \"Tag\",\n      values: getValues(tags),\n    },\n    {\n      key: \"civilizations\",\n      filter: (value, item) => value.every((v) => item.civilizations.includes(v)),\n      label: \"Civilization\",\n      values: getValues(civilizations),\n    },\n    {\n      key: \"creator\",\n      filter: (value, item) => value.some((v) => item.creator === v),\n      label: \"Creator\",\n      values: getValues(creators),\n    },\n    {\n      key: \"type\",\n      filter: (value, item) => value.some((v) => item.type === v),\n      label: \"Type\",\n      values: getValues(types),\n    },\n  ];\n}\n\nfunction filterContent(content: ContentItem[], filters: ContentFilter[], activeFilters: { [key: string]: string[] }): ContentItem[] {\n  if (!content) return [];\n  return content.filter((item) => {\n    return filters.every((filter) => {\n      const active = activeFilters[filter.key] || [];\n      return active.length === 0 || filter.filter(active, item);\n    });\n  });\n}\n\nexport default ContentOverviewRoute;\n"],"names":["defaultLimit","ContentOverviewRoute","params","useParams","civ","CIVILIZATION_BY_SLUG","content","createResource","civilization","featured","getRelatedContent","limit","setLimit","createSignal","showFilter","setShowFilter","filters","setFilters","setHideNav","onCleanup","toggleFilter","key","value","current","includes","filter","v","availableFilters","getFilterableProperties","possibleFilters","filtered","filterContent","setActivePage","title","name","location","useLocation","_el$","_tmpl$2","_el$2","firstChild","_el$3","_el$4","_el$5","_el$6","_el$7","_el$8","nextSibling","_el$9","_el$10","_el$11","_el$12","_el$13","_el$14","_el$15","_el$16","_el$17","_el$18","_$insert","_$createComponent","Icon","icon","For","each","children","_el$20","_tmpl$3","_el$21","_el$22","label","Object","entries","values","count","active","_el$23","_tmpl$4","$$click","_$className","_el$24","_tmpl$5","mainItemTitleCSSClass","mainIntroductionCSSClass","secondaryButtonClass","Suspense","_el$19","_tmpl$","slice","ContentRow","_c$","_$memo","length","_el$25","_tmpl$6","_$effect","_p$","_v$","_v$2","undefined","creators","Map","tags","types","civilizations","increaseCount","map","get","set","forEach","tag","type","creator","getValues","fromEntries","sort","a","b","item","every","some","activeFilters","_$delegateEvents"],"mappings":"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"}