Improve weapons.show and battlesuits.show pages

public/locales/en-US/common.json

@@ -73,7 +73,11 @@
     "lance": "Lance",
     "gauntlet": "Gauntlet",
     "bow": "Bow",
-    "chakram": "Chakram"
+    "chakram": "Chakram",
+    "best-on": "Best On",
+    "pri-weapon": "PRI Weapon",
+    "original-weapon": "Original Weapon",
+    "sources": "Sources"
   },
   "elfs-list": {
     "description": "ELF list of Honkai 3rd",
@@ -97,5 +101,31 @@
     "new-weapons": "New Weapons",
     "supply-events": "Supply Events",
     "supply-events-disclaimer": "DISCLAIMER: The schedule is based on Global - Americas Server. It may not be accurate since we update this manually. Please check the actual in-game information again before pulling supplies."
+  },
+  "sources": {
+    "sprit-weapon-foundry": {
+      "label": "Sprit Weapon Foundry",
+      "description": "Forge with 150 x AE Imaginon, 300 x Ether Fuel and 1 x 50Lv Sprit Weapon (190 x G1 Crystalyte, 80 x Honkai Piece and 400 x Ether Fuel)."
+    },
+    "dorm-equipment-supply": {
+      "label": "Dormitory Equipment Supply",
+      "description": "Pull with 200 x crystal for each supply. Don't pull this. Most of items are available in Exchange shop."
+    },
+    "pri-weapon-foundry": {
+      "label": "PRI Weapon Foundry",
+      "description": "Unlock the original weapon & Forge with 100 x Einstein's Torus, 15 x nanoceramic, 50 x SC Metal-H2 and 1 x any 50Lv 5 Star Supply Weapon with same type."
+    },
+    "weapon-exchange": {
+      "label": "Exchange Shop",
+      "description": "Exchange with 4000 x Weapon Resonance."
+    },
+    "stigmata-exchange": {
+      "label": "Exchange Shop",
+      "description": "Exchange with 6000 x Stigmata Resonance."
+    },
+    "special-divine-key-supply": {
+      "label": "Divine Key Supply",
+      "description": "Only available in special supply events like Firepower Supply and Schicksal Arsenal. Pull with 280 x crystal for each supply."
+    }
   }
 }

public/locales/ko-KR/common.json

@@ -68,7 +68,11 @@
     "lance": "랜스",
     "gauntlet": "건틀릿",
     "bow": "활",
-    "chakram": "차크람"
+    "chakram": "차크람",
+    "best-on": "추천 발키리",
+    "pri-weapon": "초월 무기",
+    "original-weapon": "원형 무기",
+    "sources": "획득 방법"
   },
   "elfs-list": {
     "description": "붕괴 3rd 인형 목록",
@@ -92,5 +96,35 @@
     "new-weapons": "신규 무기",
     "supply-events": "보급 이벤트",
     "supply-events-disclaimer": "주의: 보급 일정은 글로벌 아메리카 서버 기준으로 작성되어 있습니다. 수작업으로 갱신하기에 정확하지 않은 부분이 있을 수도 있습니다. 보급 가차를 돌리기 전에 게임 내 정보를 꼭 다시 한번 확인해주세요."
+  },
+  "sources": {
+    "sprit-weapon-foundry": {
+      "label": "진영 무기 단조",
+      "description": "150 x 네겐트로피 허수 코어, 300 x 플로지스톤 에테르, 1 x 50 레벨 진영 무기(190 x G1 결정, 80 x 붕괴의 파편, 400 x 플로지스톤 에테르)로 단조."
+    },
+    "dorm-equipment-supply": {
+      "label": "본부 장비 보급",
+      "description": "보급마다 200 x 수정을 소모. 뽑지 않기를 추천함. 대부분의 아이템들은 치환 공간에서 구할 수 있음."
+    },
+    "focused-supply": {
+      "label": "집중 보급",
+      "description": "보급마다 280 x 수정을 소모."
+    },
+    "pri-weapon-foundry": {
+      "label": "초월 무기 단조",
+      "description": "원형 무기 획득 후, 100 x 아인슈타인 토러스, 15 x 나노 세라믹, 50 x 초전도 금속성 수소, 1 x 같은 종류의 50레벨 5성 보급 무기로 단조."
+    },
+    "weapon-exchange": {
+      "label": "치환 공간",
+      "description": "4000 x 무장 공명으로 교환."
+    },
+    "stigmata-exchange": {
+      "label": "치환 공간",
+      "description": "6000 x 성흔 공명으로 교환."
+    },
+    "special-divine-key-supply": {
+      "label": "신의 열쇠 보급",
+      "description": "천명 무기고나 화력 보급등 특수 보급 이벤트에서만 획득 가능. 보급마다 280 x 수정을 소모."
+    }
   }
 }

src/components/molecules/SourceCard.tsx

@@ -0,0 +1,124 @@
+/** @jsxImportSource theme-ui */
+import { Card, Paragraph, Heading } from '@theme-ui/components'
+import { SourceData } from '../../lib/honkai3rd/sources'
+
+import { useTranslation } from '../../lib/i18n'
+
+interface SourceCardProps {
+  source: SourceData
+}
+
+const SourceCard = ({ source }: SourceCardProps) => {
+  const { t } = useTranslation()
+  switch (source.type) {
+    case 'spirit-weapon-foundry':
+      return (
+        <SourceCardConatiner>
+          <SourceCardHeading>
+            {t('sources.sprit-weapon-foundry.label')}
+          </SourceCardHeading>
+          <SourceCardDescription>
+            {t('sources.sprit-weapon-foundry.description')}
+          </SourceCardDescription>
+        </SourceCardConatiner>
+      )
+    case 'dorm-equipment-supply':
+      return (
+        <SourceCardConatiner>
+          <SourceCardHeading>
+            {t('sources.dorm-equipment-supply.label')}
+          </SourceCardHeading>
+          <SourceCardDescription>
+            {t('sources.dorm-equipment-supply.description')}
+          </SourceCardDescription>
+        </SourceCardConatiner>
+      )
+    case 'focused-supply':
+      return (
+        <SourceCardConatiner>
+          <SourceCardHeading>
+            {t('sources.focused-supply.label')}
+          </SourceCardHeading>
+          <SourceCardDescription>
+            {t('sources.focused-supply.description')}
+          </SourceCardDescription>
+        </SourceCardConatiner>
+      )
+    case 'pri-weapon-foundry':
+      return (
+        <SourceCardConatiner>
+          <SourceCardHeading>
+            {t('sources.pri-weapon-foundry.label')}
+          </SourceCardHeading>
+          <SourceCardDescription>
+            {t('sources.pri-weapon-foundry.description')}
+          </SourceCardDescription>
+        </SourceCardConatiner>
+      )
+    case 'weapon-exchange':
+      return (
+        <SourceCardConatiner>
+          <SourceCardHeading>
+            {t('sources.weapon-exchange.label')}
+          </SourceCardHeading>
+          <SourceCardDescription>
+            {t('sources.weapon-exchange.description')}
+          </SourceCardDescription>
+        </SourceCardConatiner>
+      )
+    case 'stigmata-exchange':
+      return (
+        <SourceCardConatiner>
+          <SourceCardHeading>
+            {t('sources.stigmata-exchange.label')}
+          </SourceCardHeading>
+          <SourceCardDescription>
+            {t('sources.stigmata-exchange.description')}
+          </SourceCardDescription>
+        </SourceCardConatiner>
+      )
+    case 'special-divine-key-supply':
+      return (
+        <SourceCardConatiner>
+          <SourceCardHeading>
+            {t('sources.special-divine-key-supply.label')}
+          </SourceCardHeading>
+          <SourceCardDescription>
+            {t('sources.special-divine-key-supply.description')}
+          </SourceCardDescription>
+        </SourceCardConatiner>
+      )
+    default:
+      return (
+        <SourceCardConatiner>
+          <SourceCardDescription>Unknown: {source.type}</SourceCardDescription>
+        </SourceCardConatiner>
+      )
+  }
+}
+
+export default SourceCard
+
+const SourceCardConatiner: React.FC = ({ children }) => {
+  return (
+    <Card
+      sx={{
+        m: 1,
+      }}
+    >
+      {children}
+    </Card>
+  )
+}
+
+const SourceCardHeading: React.FC = ({ children }) => {
+  return (
+    <Heading as='h4' sx={{ borderBottom: 'default', p: 1, m: 0 }}>
+      {children}
+    </Heading>
+  )
+}
+
+const SourceCardDescription: React.FC = ({ children }) => {
+  return <Paragraph sx={{ p: 1 }}>{children}</Paragraph>
+}

src/lib/honkai3rd/sources.ts

@@ -0,0 +1,12 @@
+export type SourceType =
+  | 'pri-weapon-foundry'
+  | 'focused-supply'
+  | 'spirit-weapon-foundry'
+  | 'weapon-exchange'
+  | 'stigmata-exchange'
+  | 'dorm-equipment-supply'
+  | 'special-divine-key-supply'
+
+export interface SourceData {
+  type: SourceType
+}

src/lib/honkai3rd/weapons.ts

@@ -1,3 +1,5 @@
+import { SourceData } from './sources'
+
 export interface WeaponSkill {
   name: string
   krName?: string
@@ -25,4 +27,13 @@ export interface WeaponData {
   rarity: number
   skills: WeaponSkill[]
   version?: string
+  battlesuits?: {
+    id: string
+    suitability?: number
+    description?: string
+    descriptionKr?: string
+  }[]
+  priWeapon?: string
+  originalWeapons?: string[]
+  sources?: SourceData[]
 }

src/pages/honkai3rd/battlesuits/[battlesuitId].tsx

@@ -189,6 +189,7 @@ const BattlesuitShowPage = ({
           <Card
             sx={{
               mb: 3,
+              p: 2,
               overflow: 'hidden',
             }}
           >
@@ -198,29 +199,33 @@ const BattlesuitShowPage = ({
                   <Heading
                     as='h3'
                     sx={{
-                      pt: 2,
-                      px: 2,
                       mb: 1,
                     }}
                   >
                     {t(`battlesuit-show.equipmentTypes.${equipmentItem.type}`)}
                   </Heading>
-                  <Flex>
+                  <Flex sx={{ mx: -1 }}>
                     {equipmentItem.weapon != null && (
-                      <WeaponCard weapon={weaponMap[equipmentItem.weapon]} />
+                      <WeaponCard
+                        size='sm'
+                        weapon={weaponMap[equipmentItem.weapon]}
+                      />
                     )}
                     {equipmentItem.stigmataTop != null && (
                       <StigmataCard
+                        size='sm'
                         stigmata={stigmataMap[equipmentItem.stigmataTop]}
                       />
                     )}
                     {equipmentItem.stigmataMid != null && (
                       <StigmataCard
+                        size='sm'
                         stigmata={stigmataMap[equipmentItem.stigmataMid]}
                       />
                     )}
                     {equipmentItem.stigmataBot != null && (
                       <StigmataCard
+                        size='sm'
                         stigmata={stigmataMap[equipmentItem.stigmataBot]}
                       />
                     )}

src/pages/honkai3rd/weapons/[weaponId].tsx

@@ -7,6 +7,7 @@ import { WeaponData } from '../../../lib/honkai3rd/weapons'
 import { generateI18NPaths, getI18NProps } from '../../../server/i18n'
 import {
   getWeaponById,
+  getWeaponMapByIds,
   listWeapons,
 } from '../../../server/data/honkai3rd/weapons'
 import { useRouter } from 'next/router'
@@ -15,12 +16,23 @@ import Head from '../../../components/atoms/Head'
 import PageLink from '../../../components/atoms/PageLink'
 import { assetsBucketBaseUrl } from '../../../lib/consts'
 import Honkai3rdLayout from '../../../components/layouts/Honkai3rdLayout'
+import { getBattlesuitMapByIds } from '../../../server/data/honkai3rd/battlesuits'
+import { BattlesuitData } from '../../../lib/honkai3rd/battlesuits'
+import BattlesuitCard from '../../../components/molecules/BattlesuitCard'
+import WeaponCard from '../../../components/molecules/WeaponCard'
+import SourceCard from '../../../components/molecules/SourceCard'
 
 interface WeaponShowPageProps {
   weapon: WeaponData
+  battlesuitMap: { [key: string]: BattlesuitData }
+  weaponMap: { [key: string]: WeaponData }
 }
 
-const WeaponShowPage = ({ weapon }: WeaponShowPageProps) => {
+const WeaponShowPage = ({
+  weapon,
+  battlesuitMap,
+  weaponMap,
+}: WeaponShowPageProps) => {
   const { locale } = useRouter()
   const { t } = useTranslation()
 
@@ -79,6 +91,50 @@ const WeaponShowPage = ({ weapon }: WeaponShowPageProps) => {
           <Box p={2}>
             ATK : {weapon.atk} / CRT : {weapon.crt}
           </Box>
+          {weapon.battlesuits != null && weapon.battlesuits.length > 0 && (
+            <Box sx={{ p: 2, borderTop: 'default' }}>
+              <Heading as='h4'>{t('weapons-show.best-on')}</Heading>
+              {weapon.battlesuits.map(({ id: battlesuitId }) => {
+                return (
+                  <BattlesuitCard
+                    key={battlesuitId}
+                    size='sm'
+                    battlesuit={battlesuitMap[battlesuitId]}
+                  />
+                )
+              })}
+            </Box>
+          )}
+          {weapon.priWeapon != null && (
+            <Box sx={{ p: 2, borderTop: 'default' }}>
+              <Heading as='h4'>{t('weapons-show.pri-weapon')}</Heading>
+              <WeaponCard size='sm' weapon={weaponMap[weapon.priWeapon]} />
+            </Box>
+          )}
+          {weapon.originalWeapons != null && weapon.originalWeapons.length > 0 && (
+            <Box sx={{ p: 2, borderTop: 'default' }}>
+              <Heading as='h4'>{t('weapons-show.original-weapon')}</Heading>
+              {weapon.originalWeapons.map((originalWeaponId) => {
+                return (
+                  <WeaponCard
+                    key={originalWeaponId}
+                    size='sm'
+                    weapon={weaponMap[originalWeaponId]}
+                  />
+                )
+              })}
+            </Box>
+          )}
+          {weapon.sources != null && (
+            <Box sx={{ p: 2, borderTop: 'default' }}>
+              <Heading as='h4'>{t('weapons-show.sources')}</Heading>
+              {weapon.sources
+                .sort((a, b) => a.type.localeCompare(b.type))
+                .map((source) => {
+                  return <SourceCard key={source.type} source={source} />
+                })}
+            </Box>
+          )}
         </Card>
 
         <Box>
@@ -116,9 +172,30 @@ export async function getStaticProps({
   locale,
 }: NextPageContext & { params: { weaponId: string } }) {
   const weapon = getWeaponById(params.weaponId)
+  const battlesuitMap = getBattlesuitMapByIds(
+    weapon != null && weapon.battlesuits != null
+      ? weapon.battlesuits.map(({ id }) => id)
+      : []
+  )
+
+  const weaponIds = []
+  if (weapon != null) {
+    if (weapon.priWeapon != null) {
+      weaponIds.push(weapon.priWeapon)
+    }
+    if (weapon.originalWeapons != null) {
+      weaponIds.push(...weapon.originalWeapons)
+    }
+  }
+  const weaponMap = getWeaponMapByIds(weaponIds)
 
   return {
-    props: { weapon, ...(await getI18NProps(locale)) },
+    props: {
+      weapon,
+      battlesuitMap,
+      weaponMap,
+      ...(await getI18NProps(locale)),
+    },
   }
 }