Display notes on artifact sets

Author: Tibowl

pages/artifacts/[artifact].tsx

@@ -51,7 +51,11 @@ export default function ArtifactWebpage({ artifact, location, guides }: Props &
             {artifact.name}
           </h1>
 
-          {artifact.levels && <div className="inline-block pr-2">
+          {artifact.note && <div className="block pr-2">
+            <ReactMarkdown>{(artifact.note.replace(/ ?\$\{.*?\}/g, "").replace(/\n/g, "\n\n") ?? "")}</ReactMarkdown>
+          </div>}
+
+          {artifact.levels && <div className="block pr-2">
             Available in {joinMulti(artifact.levels.map(l => `${l}★`))}
           </div>}
         </div>

utils/types.ts

@@ -54,7 +54,8 @@ export interface Reminder {
 
 // Artifacts
 export interface Artifact {
-    name:    string
+    name:     string
+    note?:    string
     levels?:  number[]
     bonuses?: Bonus[]
     artis?:   Arti[]

utils/utils.ts

@@ -180,8 +180,8 @@ export function getStarColor(star: number): string {
 export function createSmallChar(char: Character): SmallChar {
     const c: SmallChar = { name: char.name, urlpath: "characters" }
     if (char.star) c.stars = char.star
-    if (char.meta.element) c.element = [char.meta.element as ElementType]
     if (char.skills) c.element = char.skills.map(skill => skill.ult?.type).filter(x => x) as ElementType[]
+    if (char.meta.element && (c.element == undefined || c.element.length < 1)) c.element = [char.meta.element as ElementType]
     if (char.weaponType) c.weapon = char.weaponType
     if (char.icon) c.icon = char.icon
     return c