From 4c875ecb8bd6dfffd3e3f66bd5c964161cbfcd5c Mon Sep 17 00:00:00 2001
From: Sakura Knoll <s4kura.knoll@gmail.com>
Date: Mon, 10 Jul 2023 23:32:11 +0900
Subject: [PATCH] Add weapon page

---
 assets/raw-misc/StarBig.png                   | Bin 0 -> 6165 bytes
 assets/raw-misc/StarBigGray.png               | Bin 0 -> 5735 bytes
 assets/raw-misc/SubStarActive.png             | Bin 0 -> 1639 bytes
 assets/raw-misc/SubStarActiveGray.png         | Bin 0 -> 1524 bytes
 src/components/v2-pre/FormattedText.tsx       |   2 +-
 src/components/v2-pre/WeaponIcon.tsx          |  59 ++++++++
 src/lib/utils.ts                              |   7 +
 src/lib/v2-pre/data/types.ts                  |  63 +++++----
 .../compileData/compileWeaponData.spec.ts     |   2 +-
 .../server/compileData/compileWeaponData.ts   |  35 +++--
 src/lib/v2-pre/server/raw/weaponData.ts       |   2 +-
 src/pages/v2-pre/index.tsx                    |   1 +
 src/pages/v2-pre/weapons/[weaponId].tsx       | 115 ++++++++++++++++
 src/pages/v2-pre/weapons/index.tsx            | 127 ++++++++++++++++++
 src/scripts/compileRawData.ts                 |   1 +
 15 files changed, 377 insertions(+), 37 deletions(-)
 create mode 100644 assets/raw-misc/StarBig.png
 create mode 100644 assets/raw-misc/StarBigGray.png
 create mode 100644 assets/raw-misc/SubStarActive.png
 create mode 100644 assets/raw-misc/SubStarActiveGray.png
 create mode 100644 src/components/v2-pre/WeaponIcon.tsx
 create mode 100644 src/lib/utils.ts
 create mode 100644 src/pages/v2-pre/weapons/[weaponId].tsx
 create mode 100644 src/pages/v2-pre/weapons/index.tsx

diff --git a/assets/raw-misc/StarBig.png b/assets/raw-misc/StarBig.png
new file mode 100644
index 0000000000000000000000000000000000000000..d82934687d8631e0e64c376f4e95dfc1e0562594
GIT binary patch
literal 6165
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

literal 0
HcmV?d00001

diff --git a/assets/raw-misc/StarBigGray.png b/assets/raw-misc/StarBigGray.png
new file mode 100644
index 0000000000000000000000000000000000000000..d3658919abd2762b43082061d190e93854fd71de
GIT binary patch
literal 5735
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
Z{69V2Wr`0h;Hv-t002ovPDHLkV1hRL>Zt$#

literal 0
HcmV?d00001

diff --git a/assets/raw-misc/SubStarActive.png b/assets/raw-misc/SubStarActive.png
new file mode 100644
index 0000000000000000000000000000000000000000..a2af634f0e2f05cce1b18689e52c03d768d36c73
GIT binary patch
literal 1639
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

literal 0
HcmV?d00001

diff --git a/assets/raw-misc/SubStarActiveGray.png b/assets/raw-misc/SubStarActiveGray.png
new file mode 100644
index 0000000000000000000000000000000000000000..4d30f533b3cb179c3b16f822211ceb55b6269f20
GIT binary patch
literal 1524
zcmV<Q1q=F#P)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm000ie
z000ie0hKEb8vp<Wrb$FWRCt`Vm)UAtR}_Yiq@#K8pu{fNYCPj$g6q10K%vl^rjSCR
zH+g{eE&2%VZSQ+kO6g^w5D3%|m(;mPYu7feBV)U^>Omef+LDfR`Ym~H^++C@L9p0o
z*k}F!`qx@}Z<$k5Q-<?r+qQAtpUdTHT(-QrwiDBM{hwQzOIb}3(BoSr;88xj!C){H
zjYjY7?(RO}-oh$xgMdWnc8osKAi%@eH&_QL{CaP1?=kPHSnaBmUYCFd^eA%!>~*`{
z5w6?)e*YKU-Q9iFYE{tgU{A3M;MP@+uOi?CHuVU&5AYykyuH2sA@(2^i@kGrc(_-q
z)o$`G%6M#?rs2|BI72`x+aa5Pd(}Lz0uKl{)`{ewhC-oFy1Kds<s07lnbXA>!LmFn
zD-zXLQNW`>ecBXw$m8*J0(>tJ2z=ht(=*JyiTsAw>-CE&ia>~ON)CVLlDLR~j$DAn
zX$X_3BUlF&e;0e$+uPem{zJ%Zh(W|J?-`{S5Ba8O|0kzz&2tIp9<KMaNGZ`ONyCg{
zF$Ml1c0Z9wyo(Ak4PJLb`h*Zl^jns-&7+WtT!Wu!O(y{@c|B4kW8JuKH%)Wc=krYf
zIu3XO`5TezAT<HTe!lsWcRAjb6nNEPO$2oGCeq#I<8eL?V^YmGB;Qys1s9IT;~nzD
zsoNR32A5wr9F8)7g!?uugO!*spq2`<sVf=^FlmBT`nIjDO&qw0#Ke3U!3KgnYk*z^
zE~5~T6fi%5&kR=NRatd}r&WbU5gs2OFYNE{XOKBSaov*2#*q|O9gLh_xlze`x5#$m
z#!dWv#CIufbBrYiiKdOqRC3t4T&|kQWWFqwN?#ou9DF=7GSZJC9nxN{k>d1HA`pn<
zYl4NTNB}<wxFR9xs5o}fh5|JvRsbuc)9Ig2PEM?1vH1Sb(9muAyoZk@MTS~z8l!fk
z-#Li71_lQDmY0`nkf=iVdmdLHAzff8vz-KNSXW?uR4$j-P~n$KrIJ}$Suupn;Najb
z<LsV)CM9yOyFzMabaZqenM|6So12pR$8^#&QNTED$2tkq;iQJ-CCKj)y$yj%p-?Do
zZEZ<f&Hn!WUOm^@c1{KKb6uqJp(ugh==}WrZR#RHk$%S%*(d6)*}4+S_G!`UInuF#
z5+2M;1Od7)Mu)_lQD1c3aHfhE(D>x!WE3^p*4NiR>+I~j4>wW3)k?rV^<`I(u*iy+
z!a)e@TU%S}9v>f%T?E)#pnOx!=krCPE@LGGt<qtB0%@bp?y!M9mw9ItFjSwaYAw==
z+o<uJVtNmUJ*X2r4_HP(E!5iI+1bg^NqH%1fQvjn;yR7b9p=qOB9T9Iu;(eD7YaF0
zoDfkKHMU8`I_ty$ssx=ippB@G78e&&6zw*E8x-?D3OK`cPOfEtV6Hs3NoP|Rw5p(&
zP3c?d<pZvhMD+n(+0|NvM7_JTw6p?PlG_E|Z=u{CRi8zHEJ2h=LlGh;d{c%%V^cbh
zfUOAVv!7IK9%su)TNoP~Yl@yONmJpAT>pm6Gj9X%14!p3g~sWbpscL6u&~escF}o2
zZ=Hr(gbFxJWwY5lQCJj{oQw=olAE2K-DJP`m1ob`GyaBvtp5^eMJ>JhR8%_;=&}=0
zV+|Gp$S65HVvRTfFd~&bJw5#rpr?RN1HQqSSKF_p794#%f2AW?LkV$;0vQO%B30%P
zYR}Bfyd=LbSY#eimq`b>E@DfKO_56qS65fBO~58XaZ-}Q1q9MUfNI}NrBW{-@*`^e
zMa~b^5!`w3xZXb_=gxG=Pn;JZ@H<8KfIZ@nsDA=@iB)c2$^F0nk~IiibDlUXQ)o|U
zH#sfM1G+BY@|+;9{0H>91nO%8@=Kl{kq#k~Lxr+&L3O`r0`}b8Tvhf5seZs^pSO%R
a@cS3fOqe;xzdL6D0000<MNUMnLSTYJ)zbC=

literal 0
HcmV?d00001

diff --git a/src/components/v2-pre/FormattedText.tsx b/src/components/v2-pre/FormattedText.tsx
index b16326d9..4dc962af 100644
--- a/src/components/v2-pre/FormattedText.tsx
+++ b/src/components/v2-pre/FormattedText.tsx
@@ -34,7 +34,7 @@ function adjustColor(color: unknown): string | undefined {
   const normalizedColor = color.toUpperCase()
 
   if (normalizedColor.startsWith('#FEDF4C')) {
-    return '#e6c010'
+    return '#d1af15'
   }
 
   if (normalizedColor.startsWith('#FFC741')) {
diff --git a/src/components/v2-pre/WeaponIcon.tsx b/src/components/v2-pre/WeaponIcon.tsx
new file mode 100644
index 00000000..ab88191d
--- /dev/null
+++ b/src/components/v2-pre/WeaponIcon.tsx
@@ -0,0 +1,59 @@
+import { Box, Flex } from 'theme-ui'
+import { assetsBucketBaseUrl } from '../../lib/consts'
+import { repeat } from '../../lib/utils'
+
+interface WeaponIconProps {
+  icon: string
+  rarity?: number
+}
+
+const starSize = 16
+
+const WeaponIcon = ({ icon: fileName, rarity }: WeaponIconProps) => {
+  return (
+    <Box sx={{ width: 112 }}>
+      <Box
+        sx={{
+          borderRadius: 4,
+          width: (128 / 8) * 7,
+          height: (112 / 8) * 7,
+          background: ` no-repeat 100% 100% /100% url(${assetsBucketBaseUrl}/raw/weaponicons/${fileName}.png), ${getBackgroundByRarity(
+            rarity
+          )}`
+        }}
+      />
+      {rarity != null && (
+        <Flex sx={{ marginTop: -starSize / 2, justifyContent: 'center', width: '100%' }}>
+          {repeat(rarity, index => (
+            <Box
+              key={index}
+              sx={{
+                width: starSize,
+                height: starSize,
+                background: `no-repeat 50% / 100% url(${assetsBucketBaseUrl}/raw-misc/StarBig.png)`
+              }}
+            />
+          ))}
+        </Flex>
+      )}
+    </Box>
+  )
+}
+
+export default WeaponIcon
+
+function getBackgroundByRarity(rarity?: number) {
+  switch (rarity) {
+    case 6:
+      return 'linear-gradient(180deg, #e18434, #fbd977)'
+    case 5:
+      return 'linear-gradient(transparent, #c86de0),#7630a3'
+    case 4:
+    case 3:
+      return 'linear-gradient(transparent, #0ec1eb), #2368b1'
+    case 2:
+      return `linear-gradient(transparent, #52c389),#31756c`
+    default:
+      return 'transparent'
+  }
+}
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
new file mode 100644
index 00000000..5a9c139c
--- /dev/null
+++ b/src/lib/utils.ts
@@ -0,0 +1,7 @@
+export function repeat<N>(count: number, rendererFn: (index: number) => N) {
+  const result: Array<N> = []
+  for (let i = 0; i < count; i++) {
+    result.push(rendererFn(i))
+  }
+  return result
+}
diff --git a/src/lib/v2-pre/data/types.ts b/src/lib/v2-pre/data/types.ts
index 430dba1c..bc398960 100644
--- a/src/lib/v2-pre/data/types.ts
+++ b/src/lib/v2-pre/data/types.ts
@@ -146,39 +146,44 @@ export interface BattlesuitSubSkill {
 export interface WeaponCatalogItem {
   id: string
   name: string
+  icon: string
   type: WeaponType
-  maxRarity: 1 | 2 | 3 | 4 | 5
+  maxRarity: 1 | 2 | 3 | 4 | 5 | 6
+}
+
+export interface RootWeaponData {
+  id: string
+  weapons: WeaponData[]
 }
 
 export interface WeaponData {
   id: string
-  weapons: {
+  rarity: 1 | 2 | 3 | 4 | 5 | 6
+  maxLv: number
+  type: WeaponType
+  name: string
+  description: string
+  icon: string
+  hpBase: number
+  hpAdd: number
+  spBase: number
+  spAdd: number
+  attackBase: number
+  attackAdd: number
+  defenceBase: number
+  defenceAdd: number
+  criticalBase: number
+  criticalAdd: number
+  resistanceBase: number
+  resistanceAdd: number
+  skills: WeaponSkill[]
+  rankUpMaterials: {
     id: string
-    rarity: number
-    maxLv: number
-    type: WeaponType
-    title: string
-    description: string
-    icon: string
-    hpBase: number
-    hpAdd: number
-    spBase: number
-    spAdd: number
-    attackBase: number
-    attackAdd: number
-    defenceBase: number
-    defenceAdd: number
-    criticalBase: number
-    criticalAdd: number
-    resistanceBase: number
-    resistanceAdd: number
-    skills: WeaponSkill[]
-    rankUpMaterials: {
-      id: string
-      amount: number
-    }[]
-  }
+    amount: number
+  }[]
+  powerType: number
 }
+
 export interface WeaponSkill {
   id: string
   name: string
@@ -191,4 +196,10 @@ export interface WeaponSkill {
     type: TagType
     comment: string
   }[]
+  param1: number
+  param1Add: number
+  param2: number
+  param2Add: number
+  param3: number
+  param3Add: number
 }
diff --git a/src/lib/v2-pre/server/compileData/compileWeaponData.spec.ts b/src/lib/v2-pre/server/compileData/compileWeaponData.spec.ts
index cedd6b7f..caf7c2de 100644
--- a/src/lib/v2-pre/server/compileData/compileWeaponData.spec.ts
+++ b/src/lib/v2-pre/server/compileData/compileWeaponData.spec.ts
@@ -15,7 +15,7 @@ describe('compileWeaponData', () => {
       ])
     })
 
-    expect(targetItem!.weapons[3]).toMatchObject({
+    expect(targetItem?.weapons[3]).toMatchObject({
       skills: [
         {
           id: '1221'
diff --git a/src/lib/v2-pre/server/compileData/compileWeaponData.ts b/src/lib/v2-pre/server/compileData/compileWeaponData.ts
index 7e3ffcc1..f95f256e 100644
--- a/src/lib/v2-pre/server/compileData/compileWeaponData.ts
+++ b/src/lib/v2-pre/server/compileData/compileWeaponData.ts
@@ -1,8 +1,9 @@
+import { RootWeaponData, WeaponData } from '../../data/types'
 import { getRawEquipmentSkillDataMap, RawEquipmentSkillData } from '../raw/equipmentSkillData'
 import { getRawWeaponDataMap } from '../raw/weaponData'
 import { convertTagType, convertWeaponType, getText } from './utils'
 
-export function compileWeaponData() {
+export function compileWeaponData(): RootWeaponData[] {
   const rawWeaponDataMap = getRawWeaponDataMap()
   const rawEquipmentSkillDataMap = getRawEquipmentSkillDataMap()
 
@@ -20,7 +21,13 @@ export function compileWeaponData() {
       const rawSkill = rawEquipmentSkillDataMap[skillId]
       skills.push({
         id: skillId,
-        ...convertWeaponSkill(rawSkill)
+        ...convertWeaponSkill(rawSkill),
+        param1: rawData.Prop1Param1,
+        param1Add: rawData.Prop1Param1Add,
+        param2: rawData.Prop1Param2,
+        param2Add: rawData.Prop1Param2Add,
+        param3: rawData.Prop1Param3,
+        param3Add: rawData.Prop1Param3Add
       })
     }
     if (rawData.Prop2ID !== 0) {
@@ -28,7 +35,13 @@ export function compileWeaponData() {
       const rawSkill = rawEquipmentSkillDataMap[skillId]
       skills.push({
         id: skillId,
-        ...convertWeaponSkill(rawSkill)
+        ...convertWeaponSkill(rawSkill),
+        param1: rawData.Prop2Param1,
+        param1Add: rawData.Prop2Param1Add,
+        param2: rawData.Prop2Param2,
+        param2Add: rawData.Prop2Param2Add,
+        param3: rawData.Prop2Param3,
+        param3Add: rawData.Prop2Param3Add
       })
     }
     if (rawData.Prop3ID !== 0) {
@@ -36,16 +49,22 @@ export function compileWeaponData() {
       const rawSkill = rawEquipmentSkillDataMap[skillId]
       skills.push({
         id: skillId,
-        ...convertWeaponSkill(rawSkill)
+        ...convertWeaponSkill(rawSkill),
+        param1: rawData.Prop3Param1,
+        param1Add: rawData.Prop3Param1Add,
+        param2: rawData.Prop3Param2,
+        param2Add: rawData.Prop3Param2Add,
+        param3: rawData.Prop3Param3,
+        param3Add: rawData.Prop3Param3Add
       })
     }
-    const icon = rawData.IconPath.split('/').pop()
+    const icon = rawData.IconPath.split('/').pop()!
     weaponList.push({
       id,
       rarity: rawData.Rarity,
       maxLv: rawData.MaxLv,
       type: convertWeaponType(rawData.BaseType),
-      title: getText(rawData.DisplayTitle),
+      name: getText(rawData.DisplayTitle),
       description: getText(rawData.DisplayDescription),
       icon,
       hpBase: rawData.HPBase,
@@ -71,14 +90,14 @@ export function compileWeaponData() {
       powerType: rawData.PowerType
     })
     return map
-  }, new Map())
+  }, new Map<string, WeaponData[]>())
 
   const weaponIdList = [...rawWeaponMainIdWeaponDataMap.keys()]
 
   return weaponIdList.map(weaponId => {
     return {
       id: weaponId,
-      weapons: rawWeaponMainIdWeaponDataMap.get(weaponId)
+      weapons: rawWeaponMainIdWeaponDataMap.get(weaponId) || []
     }
   })
 
diff --git a/src/lib/v2-pre/server/raw/weaponData.ts b/src/lib/v2-pre/server/raw/weaponData.ts
index 5f666e30..51f752bb 100644
--- a/src/lib/v2-pre/server/raw/weaponData.ts
+++ b/src/lib/v2-pre/server/raw/weaponData.ts
@@ -9,7 +9,7 @@ export type RawWeaponDataMap = {
 }
 
 export interface RawWeaponData {
-  Rarity: number
+  Rarity: 1 | 2 | 3 | 4 | 5 | 6
   MaxRarity: number
   SubRarity: number
   SubMaxRarity: number
diff --git a/src/pages/v2-pre/index.tsx b/src/pages/v2-pre/index.tsx
index 7cd1f3ad..cce87214 100644
--- a/src/pages/v2-pre/index.tsx
+++ b/src/pages/v2-pre/index.tsx
@@ -3,6 +3,7 @@ const HomePage = () => {
     <div>
       <h1>V2 Pre</h1>
       <a href="/v2-pre/battlesuits">Battlesuits</a>
+      <a href="/v2-pre/weapons">Weapons</a>
     </div>
   )
 }
diff --git a/src/pages/v2-pre/weapons/[weaponId].tsx b/src/pages/v2-pre/weapons/[weaponId].tsx
new file mode 100644
index 00000000..bf0bcdd7
--- /dev/null
+++ b/src/pages/v2-pre/weapons/[weaponId].tsx
@@ -0,0 +1,115 @@
+import { NextPageContext } from 'next'
+import { Box, Card, Flex, Heading } from 'theme-ui'
+import FormattedText from '../../../components/v2-pre/FormattedText'
+import { formatSubSkillInfo } from '../../../lib/v2-pre/data/formatText'
+import { loadWeaponCatalog, loadWeaponData } from '../../../lib/v2-pre/server/loadData'
+import { RootWeaponData, SkillTagItem } from '../../../lib/v2-pre/data/types'
+import { Fragment } from 'react'
+import TagIcon from '../../../components/v2-pre/TagIcon'
+import { getWeaponTypeLabel } from '../../../lib/v2-pre/data/text'
+import WeaponTypeIcon from '../../../components/v2-pre/WeaponTypeIcon'
+import WeaponIcon from '../../../components/v2-pre/WeaponIcon'
+
+interface WeaponShowPageProps {
+  rootWeapon: RootWeaponData
+}
+
+const WeaponShowPage = ({ rootWeapon }: WeaponShowPageProps) => {
+  const weapon = rootWeapon.weapons[rootWeapon.weapons.length - 1]
+  return (
+    <Box>
+      <Heading as="h1">{weapon.name}</Heading>
+
+      <Box mb={3}>
+        <WeaponIcon key={weapon.id} icon={weapon.icon} rarity={weapon.rarity} />
+      </Box>
+
+      <Card mb={3}>
+        <Box sx={{ p: 1, borderBottom: 'default' }}>{weapon.description}</Box>
+        <Flex sx={{ alignItems: 'center', p: 1, borderBottom: 'default' }}>
+          <WeaponTypeIcon type={weapon.type} />
+          <Box ml={1}>{getWeaponTypeLabel(weapon.type)}</Box>
+        </Flex>
+        <Box sx={{ p: 1 }}>
+          ATK : {Math.floor(weapon.attackBase + weapon.attackAdd * (weapon.maxLv - 1))} / CRT :{' '}
+          {Math.floor(weapon.criticalBase + weapon.criticalAdd * (weapon.maxLv - 1))} (at Max Lv {weapon.maxLv})
+        </Box>
+      </Card>
+
+      <Heading as="h2">Skills</Heading>
+      <Card>
+        {weapon.skills.map(skill => {
+          return (
+            <Fragment key={skill.id}>
+              <Box sx={{ borderBottom: 'default' }}>
+                <Heading
+                  as="h3"
+                  sx={{
+                    p: 1,
+                    m: 1
+                  }}
+                >
+                  {skill.name}
+                </Heading>
+              </Box>
+              <Box
+                sx={{
+                  p: 1,
+                  borderBottom: 'default',
+                  '&:last-child': {
+                    borderBottom: 'none'
+                  }
+                }}
+              >
+                <FormattedText>
+                  {formatSubSkillInfo({
+                    info: skill.info,
+                    maxLv: weapon.maxLv,
+                    paramBase1: skill.param1,
+                    paramBase2: skill.param2,
+                    paramBase3: skill.param3,
+                    paramAdd1: skill.param1Add,
+                    paramAdd2: skill.param2Add,
+                    paramAdd3: skill.param3Add
+                  })}
+                </FormattedText>
+              </Box>
+            </Fragment>
+          )
+        })}
+      </Card>
+      {/* <pre>{JSON.stringify(weapon, null, 2)}</pre> */}
+    </Box>
+  )
+}
+
+export default WeaponShowPage
+
+export async function getStaticProps({ locale, params }: NextPageContext & { params: { weaponId: string } }) {
+  const rootWeapon = loadWeaponData(params.weaponId)
+
+  return {
+    props: { rootWeapon }
+  }
+}
+
+export async function getStaticPaths() {
+  const weaponCatalog = loadWeaponCatalog()
+
+  return {
+    paths: weaponCatalog.map(catalogItem => {
+      return {
+        params: { weaponId: catalogItem.id }
+      }
+    }),
+    fallback: false
+  }
+}
+
+interface SkillTagBoxProps {
+  tag: SkillTagItem
+}
+
+const SkillTagItem = ({ tag }: SkillTagBoxProps) => {
+  return <TagIcon type={tag.type} strength={tag.strength} comment={tag.comment} size="sm" />
+}
diff --git a/src/pages/v2-pre/weapons/index.tsx b/src/pages/v2-pre/weapons/index.tsx
new file mode 100644
index 00000000..897735f5
--- /dev/null
+++ b/src/pages/v2-pre/weapons/index.tsx
@@ -0,0 +1,127 @@
+/** @jsxImportSource theme-ui */
+import { Box, Card } from '@theme-ui/components'
+import { NextPageContext } from 'next'
+import { Flex, Link } from 'theme-ui'
+import { loadWeaponCatalog } from '../../../lib/v2-pre/server/loadData'
+import { WeaponCatalogItem } from '../../../lib/v2-pre/data/types'
+import WeaponIcon from '../../../components/v2-pre/WeaponIcon'
+
+interface BattlesuitListPageProps {
+  weaponCatalog: WeaponCatalogItem[]
+}
+
+const BattlesuitListPage = ({ weaponCatalog }: BattlesuitListPageProps) => {
+  return (
+    <Box>
+      <h1>Weapons</h1>
+      <Flex sx={{ flexWrap: 'wrap' }}>
+        {weaponCatalog
+          .filter(filterWeapons)
+          .sort(sortWeapons)
+          .map(weapon => {
+            return (
+              <Box key={weapon.id} m={2}>
+                <Link href={`/v2-pre/weapons/${weapon.id}`}>
+                  <Card p={1}>
+                    <Flex sx={{ justifyContent: 'center' }}>
+                      <WeaponIcon icon={weapon.icon} rarity={weapon.maxRarity} />
+                    </Flex>
+                    <Box
+                      sx={{
+                        overflow: 'hidden',
+                        textOverflow: 'ellipsis',
+                        whiteSpace: 'nowrap',
+                        px: 1,
+                        width: 112,
+                        textAlign: 'center'
+                      }}
+                    >
+                      {weapon.name}
+                    </Box>
+                    {/* {weapon.id} */}
+                  </Card>
+                </Link>
+              </Box>
+            )
+          })}
+      </Flex>
+    </Box>
+  )
+}
+
+export default BattlesuitListPage
+
+export async function getStaticProps({ locale }: NextPageContext) {
+  const weaponCatalog = loadWeaponCatalog()
+
+  return {
+    props: { weaponCatalog }
+  }
+}
+
+function filterWeapons(weapon: WeaponCatalogItem) {
+  // Valid weapons
+  // 24XXX EX Weapons
+  // 21XXX Sprit Weapon
+  // 19XXX Alloy Weapons
+  // 10XXX Regular Weapons
+
+  // Event Weapon?
+  if (weapon.id.startsWith('18') && weapon.id.length === 5) {
+    return false
+  }
+  // Test Data?
+  if (weapon.id.startsWith('1023') && weapon.id.length === 6) {
+    return false
+  }
+  // Unreleased(Number looks good but lacking info)
+  switch (weapon.id) {
+    case '24000': // 2nd relic alpha
+    case '24040': // Removed 7 Thunders
+    case '24034': // PE Temp Lance
+    case '24024': // keqing ex
+    case '20765': // ?
+    case '10243': // No Name
+    case '10219': // ?
+    case '10179': // ?
+      return false
+  }
+
+  // Divine Keys
+  switch (weapon.id) {
+    case '20000': // Taixuan Sword
+    case '10248': // Abyss Flower
+    case '10267': // Eden's star anti entropy
+    case '10263': // 7 Thunders
+    case '10247': // Abyss
+    case '10235': // Fenghuang pistols
+    case '10234': // Fenghuang fists
+    case '10223': // Eden twin stars
+    case '10212': // Pledge of Sakura
+    case '10211': // Pledge of Judah
+    case '10209': // Might of an utu
+    case '10199': // Cleaver of Shamash
+    case '10163': // Shamash pistols
+      // The below don't have duplicated data
+      // case '10180': // Eden's star
+      // case '10169': // Taxiuan fists
+      // case '10158': // Jizo Mitama
+      return false
+  }
+
+  return true
+}
+
+function sortWeapons(a: WeaponCatalogItem, b: WeaponCatalogItem) {
+  let aId = parseInt(a.id)
+
+  const aTypeOrder = aId > 21000 && aId < 22000 ? 2 : aId > 19000 && aId < 20000 ? 1 : 0
+
+  let bId = parseInt(b.id)
+  const bTypeOrder = bId > 21000 && bId < 22000 ? 2 : bId > 19000 && bId < 20000 ? 1 : 0
+  if (aTypeOrder !== bTypeOrder) {
+    return aTypeOrder - bTypeOrder
+  }
+
+  return bId - aId
+}
diff --git a/src/scripts/compileRawData.ts b/src/scripts/compileRawData.ts
index d8982fe1..d8dea5ef 100644
--- a/src/scripts/compileRawData.ts
+++ b/src/scripts/compileRawData.ts
@@ -52,6 +52,7 @@ function writeWeaponData() {
     return {
       id: weapon.id,
       name: maxedWeapon.name,
+      icon: maxedWeapon.icon,
       type: maxedWeapon.type,
       maxRarity: maxedWeapon.rarity
     }