From 35402dc0a897fb723a77291b99688ad956f9b740 Mon Sep 17 00:00:00 2001 From: Justin Edmund Date: Fri, 27 Jan 2023 20:28:20 -0800 Subject: [PATCH 01/14] Add translations --- public/locales/en/common.json | 1 + public/locales/ja/common.json | 1 + 2 files changed, 2 insertions(+) diff --git a/public/locales/en/common.json b/public/locales/en/common.json index eff0750c..89fc5b77 100644 --- a/public/locales/en/common.json +++ b/public/locales/en/common.json @@ -384,6 +384,7 @@ "extra_weapons": "Additional Weapons", "equipped": "Equipped", "coming_soon": "Coming Soon", + "new_party": "New party", "no_accessory": "No {{accessory}} equipped", "no_title": "Untitled", "no_raid": "No raid", diff --git a/public/locales/ja/common.json b/public/locales/ja/common.json index b6249a70..5faa47b8 100644 --- a/public/locales/ja/common.json +++ b/public/locales/ja/common.json @@ -385,6 +385,7 @@ "equipped": "装備した", "extra_weapons": "Additional Weapons", "coming_soon": "開発中", + "new_party": "新しい編成", "no_accessory": "{{accessory}}は装備していません", "no_title": "無題", "no_raid": "マルチなし", From 253472878579955eb807e5d3f8b2a3fdac20cd5e Mon Sep 17 00:00:00 2001 From: Justin Edmund Date: Fri, 27 Jan 2023 20:28:44 -0800 Subject: [PATCH 02/14] Extract capitalizeFirstLetter into util --- components/JobAccessoryPopover/index.tsx | 9 +++------ utils/capitalizeFirstLetter.tsx | 3 +++ 2 files changed, 6 insertions(+), 6 deletions(-) create mode 100644 utils/capitalizeFirstLetter.tsx diff --git a/components/JobAccessoryPopover/index.tsx b/components/JobAccessoryPopover/index.tsx index fa3bb6ba..8f7ae501 100644 --- a/components/JobAccessoryPopover/index.tsx +++ b/components/JobAccessoryPopover/index.tsx @@ -1,9 +1,11 @@ import React, { PropsWithChildren, useEffect, useState } from 'react' import { useRouter } from 'next/router' import { useTranslation } from 'next-i18next' +import classNames from 'classnames' + +import capitalizeFirstLetter from '~utils/capitalizeFirstLetter' import * as RadioGroup from '@radix-ui/react-radio-group' - import Button from '~components/Button' import { Popover, @@ -13,7 +15,6 @@ import { import JobAccessoryItem from '~components/JobAccessoryItem' import './index.scss' -import classNames from 'classnames' interface Props { buttonref: React.RefObject @@ -80,10 +81,6 @@ const JobAccessoryPopover = ({ onOpenChange(false) } - function capitalizeFirstLetter(string: string) { - return string.charAt(0).toUpperCase() + string.slice(1) - } - const radioGroup = ( <>

diff --git a/utils/capitalizeFirstLetter.tsx b/utils/capitalizeFirstLetter.tsx new file mode 100644 index 00000000..5dd33934 --- /dev/null +++ b/utils/capitalizeFirstLetter.tsx @@ -0,0 +1,3 @@ +export default function capitalizeFirstLetter(string: string) { + return string.charAt(0).toUpperCase() + string.slice(1) +} From 1baf8d3b06cf9aec00c94334457bd421a0f9da2b Mon Sep 17 00:00:00 2001 From: Justin Edmund Date: Fri, 27 Jan 2023 20:29:32 -0800 Subject: [PATCH 03/14] Add support for left and right button accessories --- components/Button/index.tsx | 41 ++++++++++++++++++++++++++---- components/CharacterUnit/index.tsx | 2 +- components/GridRep/index.tsx | 2 +- components/JobImage/index.tsx | 2 +- components/PartyDetails/index.tsx | 6 ++--- components/SummonUnit/index.tsx | 2 +- components/WeaponUnit/index.tsx | 2 +- 7 files changed, 44 insertions(+), 13 deletions(-) diff --git a/components/Button/index.tsx b/components/Button/index.tsx index e87e7ff7..f75b9a48 100644 --- a/components/Button/index.tsx +++ b/components/Button/index.tsx @@ -8,7 +8,10 @@ interface Props React.ButtonHTMLAttributes, HTMLButtonElement > { - accessoryIcon?: React.ReactNode + leftAccessoryIcon?: React.ReactNode + leftAccessoryClassName?: string + rightAccessoryIcon?: React.ReactNode + rightAccessoryClassName?: string active?: boolean blended?: boolean contained?: boolean @@ -24,7 +27,18 @@ const defaultProps = { } const Button = React.forwardRef(function button( - { accessoryIcon, active, blended, contained, buttonSize, text, ...props }, + { + leftAccessoryIcon, + leftAccessoryClassName, + rightAccessoryIcon, + rightAccessoryClassName, + active, + blended, + contained, + buttonSize, + text, + ...props + }, forwardedRef ) { const classes = classNames( @@ -38,8 +52,24 @@ const Button = React.forwardRef(function button( props.className ) - const hasAccessory = () => { - if (accessoryIcon) return {accessoryIcon} + const leftAccessoryClasses = classNames(leftAccessoryClassName, { + Accessory: true, + Left: true, + }) + + const rightAccessoryClasses = classNames(rightAccessoryClassName, { + Accessory: true, + Right: true, + }) + + const hasLeftAccessory = () => { + if (leftAccessoryIcon) + return {leftAccessoryIcon} + } + + const hasRightAccessory = () => { + if (rightAccessoryIcon) + return {rightAccessoryIcon} } const hasText = () => { @@ -48,8 +78,9 @@ const Button = React.forwardRef(function button( return ( ) }) diff --git a/components/CharacterUnit/index.tsx b/components/CharacterUnit/index.tsx index d813b877..6e1b0674 100644 --- a/components/CharacterUnit/index.tsx +++ b/components/CharacterUnit/index.tsx @@ -218,7 +218,7 @@ const CharacterUnit = ({