/** @jsxImportSource theme-ui */
import { Box, Card, Flex, Heading, Paragraph, Text, Image } from '@theme-ui/components'
import { NextPageContext } from 'next'
import React from 'react'
import BattlesuitFeatureLabel from '../../../components/atoms/BattlesuitFeatureLabel'
import BattlesuitRankIcon from '../../../components/atoms/BattlesuitRankIcon'
import PageLink from '../../../components/atoms/PageLink'
import SecondaryLabel from '../../../components/atoms/SecondaryLabel'
import TypeLabel from '../../../components/atoms/TypeLabel'
import ValkyrieLabel from '../../../components/atoms/ValkyrieLabel'
import Breadcrumb from '../../../components/organisms/Breadcrumb'
import {
BattlesuitData,
battlesuitFeatures,
BattlesuitSkillGroup,
battlesuitTypes,
valkyries
} from '../../../lib/honkai3rd/battlesuits'
import { generateI18NPaths, getI18NProps } from '../../../server/i18n'
import { getBattlesuitById, listBattlesuits } from '../../../server/data/honkai3rd/battlesuits'
import { translate, useTranslation } from '../../../lib/i18n'
import { useRouter } from 'next/router'
import Head from '../../../components/atoms/Head'
import { capitalize } from '../../../lib/string'
import { assetsBucketBaseUrl } from '../../../lib/consts'
import Honkai3rdLayout from '../../../components/layouts/Honkai3rdLayout'
import { WeaponData } from '../../../lib/honkai3rd/weapons'
import { getWeaponMapByIds } from '../../../server/data/honkai3rd/weapons'
import { StigmataData } from '../../../lib/honkai3rd/stigmata'
import WeaponCard from '../../../components/molecules/WeaponCard'
import StigmataCard from '../../../components/molecules/StigmataCard'
import { getStigmataMapByIds } from '../../../server/data/honkai3rd/stigmata'
type WeaponObjectMap = { [key: string]: WeaponData }
type StigmataObjectMap = { [key: string]: StigmataData }
interface BattlesuitShowPageProps {
battlesuit: BattlesuitData
weaponMap: WeaponObjectMap
stigmataMap: StigmataObjectMap
}
const BattlesuitShowPage = ({ battlesuit, weaponMap, stigmataMap }: BattlesuitShowPageProps) => {
const { t } = useTranslation()
const { locale } = useRouter()
const { label: valkyrieLabel, krLabel } = valkyries.find(aValkyrie => aValkyrie.value === battlesuit.valkyrie) || {
label: battlesuit.valkyrie,
krLabel: battlesuit.valkyrie
}
const valkyrieName = translate(locale, { 'ko-KR': krLabel }, valkyrieLabel)
const battlesuitType = battlesuitTypes.find(aType => aType.value === battlesuit.type)
const battlesuitTypeLabel = battlesuitType
? translate(locale, { 'ko-KR': battlesuitType.krLabel }, battlesuitType.label)
: capitalize(battlesuit.type)
return (
{
const featureData = battlesuitFeatures.find(aFeature => aFeature.value === feature)
if (featureData == null) {
return feature
}
const { label, krLabel } = featureData
return translate(locale, { 'ko-KR': krLabel }, label)
})
.join(', ')}`}
canonicalHref={`/honkai3rd/battlesuits/${battlesuit.id}`}
/>
{battlesuit.name}
{battlesuit.features.map(feature => {
return (
)
})}
{battlesuit.equipment != null && (
{battlesuit.equipment.map(equipmentItem => {
return (
{t(`battlesuit-show.equipmentTypes.${equipmentItem.type}`)}
{equipmentItem.weapon != null && }
{equipmentItem.stigmataTop != null && (
)}
{equipmentItem.stigmataMid != null && (
)}
{equipmentItem.stigmataBot != null && (
)}
)
})}
)}
{battlesuit.sp != null && (
)}
)
}
export default BattlesuitShowPage
export async function getStaticProps({ params, locale }: NextPageContext & { params: { battlesuitId: string } }) {
const battlesuit = getBattlesuitById(params.battlesuitId, locale)!
const { weaponIds, stigmataIds } = (battlesuit.equipment || []).reduce<{
weaponIds: string[]
stigmataIds: string[]
}>(
(acc, equipmentItem) => {
acc.weaponIds.push(equipmentItem.weapon)
acc.stigmataIds.push(equipmentItem.stigmataTop, equipmentItem.stigmataMid, equipmentItem.stigmataBot)
return acc
},
{ weaponIds: [], stigmataIds: [] }
)
const weaponMap = getWeaponMapByIds(weaponIds, locale)
const stigmataMap = getStigmataMapByIds(stigmataIds, locale)
return {
props: {
battlesuit,
weaponMap,
stigmataMap,
...(await getI18NProps(locale))
}
}
}
export async function getStaticPaths() {
return {
paths: generateI18NPaths(
listBattlesuits().map(battlesuit => {
return {
params: { battlesuitId: battlesuit.id }
}
})
),
fallback: false
}
}
interface BattlesuitSkillGroupCardProps {
heading: string
skillGroup: BattlesuitSkillGroup
}
const BattlesuitSkillGroupCard = ({ heading, skillGroup }: BattlesuitSkillGroupCardProps) => {
return (
{skillGroup.core.name}
{heading}
{skillGroup.core.description}
{skillGroup.subskills.map(subskill => {
return (
{subskill.name}
{subskill.requiredRank != null ? (
/^[0-9]/.test(subskill.requiredRank) ? (
⭐{subskill.requiredRank.slice(0, 1)}
) : (
)
) : (
)}
{subskill.description}
)
})}
)
}