Merge pull request #246 from jedmund/2023-03-legfest
Add items for 2023/02 Legfest
This commit is contained in:
GitHub
commit
1f083073e4
3 changed files with 186 additions and 98 deletions
0
components/ContentUpdate/index.scss
Normal file
0
components/ContentUpdate/index.scss
Normal file
143
components/ContentUpdate/index.tsx
Normal file
143
components/ContentUpdate/index.tsx
Normal file
|
|
@ -0,0 +1,143 @@
|
||||||
|
import React from 'react'
|
||||||
|
import { useTranslation } from 'next-i18next'
|
||||||
|
import ChangelogUnit from '~components/ChangelogUnit'
|
||||||
|
|
||||||
|
import './index.scss'
|
||||||
|
|
||||||
|
interface UpdateObject {
|
||||||
|
character?: string[]
|
||||||
|
summon?: string[]
|
||||||
|
weapon?: string[]
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
version: string
|
||||||
|
dateString: string
|
||||||
|
event: string
|
||||||
|
newItems?: UpdateObject
|
||||||
|
uncappedItems?: UpdateObject
|
||||||
|
numNotes: number
|
||||||
|
}
|
||||||
|
const ContentUpdate = ({
|
||||||
|
version,
|
||||||
|
dateString,
|
||||||
|
event,
|
||||||
|
newItems,
|
||||||
|
uncappedItems,
|
||||||
|
numNotes,
|
||||||
|
}: Props) => {
|
||||||
|
const { t: updates } = useTranslation('updates')
|
||||||
|
|
||||||
|
const date = new Date(dateString)
|
||||||
|
|
||||||
|
function newItemElements(key: 'character' | 'weapon' | 'summon') {
|
||||||
|
let elements: React.ReactNode[] = []
|
||||||
|
if (newItems && newItems[key]) {
|
||||||
|
const items = newItems[key]
|
||||||
|
elements = items
|
||||||
|
? items.map((id) => {
|
||||||
|
return <ChangelogUnit id={id} type={key} />
|
||||||
|
})
|
||||||
|
: []
|
||||||
|
}
|
||||||
|
|
||||||
|
return elements
|
||||||
|
}
|
||||||
|
|
||||||
|
function newItemSection(key: 'character' | 'weapon' | 'summon') {
|
||||||
|
let section: React.ReactNode = ''
|
||||||
|
|
||||||
|
if (newItems && newItems[key]) {
|
||||||
|
const items = newItems[key]
|
||||||
|
section =
|
||||||
|
items && items.length > 0 ? (
|
||||||
|
<section className={`${key}s`}>
|
||||||
|
<h4>{updates(`labels.${key}s`)}</h4>
|
||||||
|
<div className="items">{newItemElements(key)}</div>
|
||||||
|
</section>
|
||||||
|
) : (
|
||||||
|
''
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
return section
|
||||||
|
}
|
||||||
|
|
||||||
|
function uncapItemElements(key: 'character' | 'weapon' | 'summon') {
|
||||||
|
let elements: React.ReactNode[] = []
|
||||||
|
if (uncappedItems && uncappedItems[key]) {
|
||||||
|
const items = uncappedItems[key]
|
||||||
|
elements = items
|
||||||
|
? items.map((id) => {
|
||||||
|
return key === 'character' ? (
|
||||||
|
<ChangelogUnit id={id} type={key} image="03" />
|
||||||
|
) : (
|
||||||
|
<ChangelogUnit id={id} type={key} />
|
||||||
|
)
|
||||||
|
})
|
||||||
|
: []
|
||||||
|
}
|
||||||
|
return elements
|
||||||
|
}
|
||||||
|
|
||||||
|
function uncapItemSection(key: 'character' | 'weapon' | 'summon') {
|
||||||
|
let section: React.ReactNode = ''
|
||||||
|
|
||||||
|
if (uncappedItems && uncappedItems[key]) {
|
||||||
|
const items = uncappedItems[key]
|
||||||
|
section =
|
||||||
|
items && items.length > 0 ? (
|
||||||
|
<section className={`${key}s`}>
|
||||||
|
<h4>{updates(`labels.uncaps.${key}s`)}</h4>
|
||||||
|
<div className="items">{uncapItemElements(key)}</div>
|
||||||
|
</section>
|
||||||
|
) : (
|
||||||
|
''
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
return section
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<section className="Content Version" data-version={version}>
|
||||||
|
<div className="Header">
|
||||||
|
<h3>{`${updates('events.date', {
|
||||||
|
year: date.getFullYear(),
|
||||||
|
month: `${date.getMonth() + 1}`.padStart(2, '0'),
|
||||||
|
})} ${updates(event)}`}</h3>
|
||||||
|
<time>{dateString}</time>
|
||||||
|
</div>
|
||||||
|
<div className="Contents">
|
||||||
|
{newItemSection('character')}
|
||||||
|
{uncapItemSection('character')}
|
||||||
|
{newItemSection('weapon')}
|
||||||
|
{uncapItemSection('weapon')}
|
||||||
|
{newItemSection('summon')}
|
||||||
|
{uncapItemSection('summon')}
|
||||||
|
</div>
|
||||||
|
{numNotes > 0 ? (
|
||||||
|
<div>
|
||||||
|
<section>
|
||||||
|
<h2>{updates('labels.updates')}</h2>
|
||||||
|
<ul className="Bare Contents">
|
||||||
|
{[...Array(numNotes)].map((e, i) => (
|
||||||
|
<li key={`${version}-${i}`}>
|
||||||
|
{updates(`versions.${version}.features.${i}`)}
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
) : (
|
||||||
|
''
|
||||||
|
)}
|
||||||
|
</section>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
ContentUpdate.defaultProps = {
|
||||||
|
numNotes: 0,
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ContentUpdate
|
||||||
|
|
@ -2,6 +2,7 @@ import React from 'react'
|
||||||
|
|
||||||
import { useTranslation } from 'next-i18next'
|
import { useTranslation } from 'next-i18next'
|
||||||
|
|
||||||
|
import ContentUpdate from '~components/ContentUpdate'
|
||||||
import ChangelogUnit from '~components/ChangelogUnit'
|
import ChangelogUnit from '~components/ChangelogUnit'
|
||||||
|
|
||||||
import './index.scss'
|
import './index.scss'
|
||||||
|
|
@ -55,104 +56,48 @@ const UpdatesPage = () => {
|
||||||
return (
|
return (
|
||||||
<div className="Updates PageContent">
|
<div className="Updates PageContent">
|
||||||
<h1>{common('about.segmented_control.updates')}</h1>
|
<h1>{common('about.segmented_control.updates')}</h1>
|
||||||
<section className="Content Version" data-version="2023-02F">
|
<ContentUpdate
|
||||||
<div className="Header">
|
version="2023-02L"
|
||||||
<h3>{`${updates('events.date', {
|
dateString="2023/02/27"
|
||||||
year: 2023,
|
event="events.legfest"
|
||||||
month: 2,
|
newItems={{
|
||||||
})} ${updates('events.flash')}`}</h3>
|
character: ['3040450000', '3040449000'],
|
||||||
<time>2023/02/14</time>
|
weapon: ['1040421600', '1040617300', '1040712200'],
|
||||||
</div>
|
summon: ['2040418000'],
|
||||||
<div className="Contents">
|
}}
|
||||||
<section className="characters">
|
/>
|
||||||
<h4>{updates('labels.characters')}</h4>
|
<ContentUpdate
|
||||||
<div className="items">
|
version="2023-02F"
|
||||||
<ChangelogUnit id="3040447000" type="character" />
|
dateString="2023/02/14"
|
||||||
<ChangelogUnit id="3040448000" type="character" />
|
event="events.flash"
|
||||||
</div>
|
newItems={{
|
||||||
</section>
|
character: ['3040447000', '3040448000'],
|
||||||
<section className="weapons">
|
weapon: ['1040617200', '1040421500'],
|
||||||
<h4>{updates('labels.weapons')}</h4>
|
}}
|
||||||
<div className="items">
|
/>
|
||||||
<ChangelogUnit id="1040617200" type="weapon" />
|
<ContentUpdate
|
||||||
<ChangelogUnit id="1040421500" type="weapon" />
|
version="2023-02-U3"
|
||||||
</div>
|
dateString="2023/02/12"
|
||||||
</section>
|
event="events.uncap"
|
||||||
</div>
|
uncappedItems={{
|
||||||
</section>
|
character: ['3040173000'],
|
||||||
<section className="Content Version" data-version="2023-02U3">
|
weapon: ['1040606800', '1040606900', '1040607000', '1040509500'],
|
||||||
<div className="Header">
|
summon: ['2040288000'],
|
||||||
<h3>{`${updates('events.date', {
|
}}
|
||||||
year: 2023,
|
/>
|
||||||
month: 2,
|
<ContentUpdate
|
||||||
})} ${updates('events.uncap')}`}</h3>
|
version="2023-02-U2"
|
||||||
<time>2023/02/12</time>
|
dateString="2023/02/06"
|
||||||
</div>
|
event="events.uncap"
|
||||||
<div className="Contents">
|
newItems={{
|
||||||
<section className="characters">
|
weapon: ['1040016100'],
|
||||||
<h4>{updates('labels.uncaps.characters')}</h4>
|
}}
|
||||||
<div className="items">
|
numNotes={versionUpdates['202302U2'].updates}
|
||||||
<ChangelogUnit id="3040173000" type="character" image="03" />
|
uncappedItems={{
|
||||||
</div>
|
character: ['3040252000'],
|
||||||
</section>
|
weapon: ['1040617100', '1040016100'],
|
||||||
<section className="weapons">
|
}}
|
||||||
<h4>{updates('labels.uncaps.weapons')}</h4>
|
/>
|
||||||
<div className="items">
|
|
||||||
<ChangelogUnit id="1040606800" type="weapon" />
|
|
||||||
<ChangelogUnit id="1040606900" type="weapon" />
|
|
||||||
<ChangelogUnit id="1040607000" type="weapon" />
|
|
||||||
<ChangelogUnit id="1040509500" type="weapon" />
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section className="summons">
|
|
||||||
<h4>{updates('labels.uncaps.summons')}</h4>
|
|
||||||
<div className="items">
|
|
||||||
<ChangelogUnit id="2040288000" type="summon" />
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section className="Content Version" data-version="2023-02U2">
|
|
||||||
<div className="Header">
|
|
||||||
<h3>{`${updates('events.date', {
|
|
||||||
year: 2023,
|
|
||||||
month: 2,
|
|
||||||
})} ${updates('events.uncap')}`}</h3>
|
|
||||||
<time>2023/02/06</time>
|
|
||||||
</div>
|
|
||||||
<div className="Contents">
|
|
||||||
<section className="characters">
|
|
||||||
<h4>{updates('labels.uncaps.characters')}</h4>
|
|
||||||
<div className="items">
|
|
||||||
<ChangelogUnit id="3040252000" type="character" image="03" />
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section className="weapons">
|
|
||||||
<h4>{updates('labels.uncaps.weapons')}</h4>
|
|
||||||
<div className="items">
|
|
||||||
<ChangelogUnit id="1040016100" type="weapon" />
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section className="weapons">
|
|
||||||
<h4>{updates('labels.weapons')}</h4>
|
|
||||||
<div className="items">
|
|
||||||
<ChangelogUnit id="1040617100" type="weapon" />
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<section>
|
|
||||||
<h2>{updates('labels.updates')}</h2>
|
|
||||||
<ul className="Bare Contents">
|
|
||||||
{[...Array(versionUpdates['202302U2'])].map((e, i) => (
|
|
||||||
<li key={`2023-02-U2-${i}`}>
|
|
||||||
{updates(`versions.2023-02-U2.features.${i}`)}
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
</section>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section className="Version" data-version="1.1">
|
<section className="Version" data-version="1.1">
|
||||||
<div className="Header">
|
<div className="Header">
|
||||||
<h3>1.1.0</h3>
|
<h3>1.1.0</h3>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue