From 3dbbb3c15102ea63d3fb2cb1cfb08bcb6fedd634 Mon Sep 17 00:00:00 2001 From: Justin Edmund Date: Mon, 27 Feb 2023 20:44:38 -0800 Subject: [PATCH 1/3] Add ContentUpdate component --- components/ContentUpdate/index.scss | 0 components/ContentUpdate/index.tsx | 143 ++++++++++++++++++++++++++++ components/UpdatesPage/index.tsx | 131 +++++++------------------ 3 files changed, 176 insertions(+), 98 deletions(-) create mode 100644 components/ContentUpdate/index.scss create mode 100644 components/ContentUpdate/index.tsx diff --git a/components/ContentUpdate/index.scss b/components/ContentUpdate/index.scss new file mode 100644 index 00000000..e69de29b diff --git a/components/ContentUpdate/index.tsx b/components/ContentUpdate/index.tsx new file mode 100644 index 00000000..5e1ed98c --- /dev/null +++ b/components/ContentUpdate/index.tsx @@ -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 + }) + : [] + } + + 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 ? ( +
+

{updates(`labels.${key}s`)}

+
{newItemElements(key)}
+
+ ) : ( + '' + ) + } + + 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' ? ( + + ) : ( + + ) + }) + : [] + } + 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 ? ( +
+

{updates(`labels.uncaps.${key}s`)}

+
{uncapItemElements(key)}
+
+ ) : ( + '' + ) + } + + return section + } + + return ( +
+
+

{`${updates('events.date', { + year: date.getFullYear(), + month: `${date.getMonth() + 1}`.padStart(2, '0'), + })} ${updates(event)}`}

+ +
+
+ {newItemSection('character')} + {uncapItemSection('character')} + {newItemSection('weapon')} + {uncapItemSection('weapon')} + {newItemSection('summon')} + {uncapItemSection('summon')} +
+ {numNotes > 0 ? ( +
+
+

{updates('labels.updates')}

+
    + {[...Array(numNotes)].map((e, i) => ( +
  • + {updates(`versions.${version}.features.${i}`)} +
    • + ))} +
+
+
+ ) : ( + '' + )} +
+ ) +} + +ContentUpdate.defaultProps = { + numNotes: 0, +} + +export default ContentUpdate diff --git a/components/UpdatesPage/index.tsx b/components/UpdatesPage/index.tsx index 65b4c397..f80e6e89 100644 --- a/components/UpdatesPage/index.tsx +++ b/components/UpdatesPage/index.tsx @@ -2,6 +2,7 @@ import React from 'react' import { useTranslation } from 'next-i18next' +import ContentUpdate from '~components/ContentUpdate' import ChangelogUnit from '~components/ChangelogUnit' import './index.scss' @@ -55,104 +56,38 @@ const UpdatesPage = () => { return (

{common('about.segmented_control.updates')}

-
-
-

{`${updates('events.date', { - year: 2023, - month: 2, - })} ${updates('events.flash')}`}

- -
-
-
-

{updates('labels.characters')}

-
- - -
-
-
-

{updates('labels.weapons')}

-
- - -
-
-
-
-
-
-

{`${updates('events.date', { - year: 2023, - month: 2, - })} ${updates('events.uncap')}`}

- -
-
-
-

{updates('labels.uncaps.characters')}

-
- -
-
-
-

{updates('labels.uncaps.weapons')}

-
- - - - -
-
-
-

{updates('labels.uncaps.summons')}

-
- -
-
-
-
-
-
-

{`${updates('events.date', { - year: 2023, - month: 2, - })} ${updates('events.uncap')}`}

- -
-
-
-

{updates('labels.uncaps.characters')}

-
- -
-
-
-

{updates('labels.uncaps.weapons')}

-
- -
-
-
-

{updates('labels.weapons')}

-
- -
-
-
-
-
-

{updates('labels.updates')}

-
    - {[...Array(versionUpdates['202302U2'])].map((e, i) => ( -
  • - {updates(`versions.2023-02-U2.features.${i}`)} -
    • - ))} -
-
-
-
+ + +

1.1.0

From 1123e0789fddfe771190ac93447943d122de8563 Mon Sep 17 00:00:00 2001 From: Justin Edmund Date: Mon, 27 Feb 2023 20:52:07 -0800 Subject: [PATCH 2/3] Add new content to updates page --- components/UpdatesPage/index.tsx | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/components/UpdatesPage/index.tsx b/components/UpdatesPage/index.tsx index f80e6e89..9d29cdfb 100644 --- a/components/UpdatesPage/index.tsx +++ b/components/UpdatesPage/index.tsx @@ -56,6 +56,16 @@ const UpdatesPage = () => { return (

{common('about.segmented_control.updates')}

+ Date: Mon, 27 Feb 2023 20:54:57 -0800 Subject: [PATCH 3/3] Update index.tsx --- components/UpdatesPage/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/UpdatesPage/index.tsx b/components/UpdatesPage/index.tsx index 9d29cdfb..2b710efc 100644 --- a/components/UpdatesPage/index.tsx +++ b/components/UpdatesPage/index.tsx @@ -59,7 +59,7 @@ const UpdatesPage = () => {