## Summary
- Fixed translation key format compatibility with next-intl
- Fixed pluralization format from i18next to next-intl format
- Fixed dynamic translation key error handling
- Updated server components to match API response structure
- Fixed useSearchParams import location
## Changes
- Changed pluralization from `{{count}} items` to `{count} items` format
- Added proper error handling for missing translation keys
- Fixed import paths for next-intl hooks
- Fixed PartyPageClient trying to set non-existent appState.parties
## Test plan
- [x] Verified translations render correctly
- [x] Tested pluralization works with different counts
- [x] Confirmed no console errors about missing translations
- [x] Tested party page functionality
🤖 Generated with [Claude Code](https://claude.ai/code)
---------
Co-authored-by: Claude <noreply@anthropic.com>
106 lines
2.6 KiB
TypeScript
106 lines
2.6 KiB
TypeScript
'use client'
|
|
import React from 'react'
|
|
import { useRouter } from 'next/navigation'
|
|
import { useTranslations } from 'next-intl'
|
|
import { getCookie } from 'cookies-next'
|
|
|
|
import {
|
|
Hovercard,
|
|
HovercardContent,
|
|
HovercardTrigger,
|
|
} from '~components/common/Hovercard'
|
|
import Button from '~components/common/Button'
|
|
import HovercardHeader from '~components/HovercardHeader'
|
|
|
|
import styles from './index.module.scss'
|
|
|
|
interface Props {
|
|
gridSummon: GridSummon
|
|
children: React.ReactNode
|
|
side?: 'top' | 'right' | 'bottom' | 'left'
|
|
onTriggerClick: () => void
|
|
}
|
|
|
|
const SummonHovercard = (props: Props) => {
|
|
const router = useRouter()
|
|
const t = useTranslations('common')
|
|
const locale =
|
|
getCookie('NEXT_LOCALE') && ['en', 'ja'].includes(getCookie('NEXT_LOCALE') as string)
|
|
? (getCookie('NEXT_LOCALE') as string)
|
|
: 'en'
|
|
|
|
const Element = ['null', 'wind', 'fire', 'water', 'earth', 'dark', 'light']
|
|
|
|
const tintElement = Element[props.gridSummon.object.element]
|
|
|
|
function goTo() {
|
|
const urlSafeName = props.gridSummon.object.name.en.replaceAll(' ', '_')
|
|
const url = `https://gbf.wiki/${urlSafeName}`
|
|
|
|
window.open(url, '_blank')
|
|
}
|
|
|
|
function summonImage() {
|
|
let imgSrc = ''
|
|
|
|
if (props.gridSummon) {
|
|
const summon = props.gridSummon.object
|
|
|
|
const upgradedSummons = [
|
|
'2040094000',
|
|
'2040100000',
|
|
'2040080000',
|
|
'2040098000',
|
|
'2040090000',
|
|
'2040084000',
|
|
'2040003000',
|
|
'2040056000',
|
|
]
|
|
|
|
let suffix = ''
|
|
if (
|
|
upgradedSummons.indexOf(summon.granblue_id.toString()) != -1 &&
|
|
props.gridSummon.uncap_level == 5
|
|
) {
|
|
suffix = '_02'
|
|
} else if (
|
|
props.gridSummon.object.uncap.transcendence &&
|
|
props.gridSummon.transcendence_step > 0
|
|
) {
|
|
suffix = '_03'
|
|
}
|
|
|
|
// Generate the correct source for the summon
|
|
imgSrc = `${process.env.NEXT_PUBLIC_SIERO_IMG_URL}/summon-grid/${summon.granblue_id}${suffix}.jpg`
|
|
}
|
|
|
|
return imgSrc
|
|
}
|
|
|
|
const wikiButton = (
|
|
<Button
|
|
className={tintElement}
|
|
text={t('buttons.wiki')}
|
|
onClick={goTo}
|
|
bound={true}
|
|
/>
|
|
)
|
|
|
|
return (
|
|
<Hovercard openDelay={350}>
|
|
<HovercardTrigger asChild onClick={props.onTriggerClick}>
|
|
{props.children}
|
|
</HovercardTrigger>
|
|
<HovercardContent side={props.side}>
|
|
<HovercardHeader
|
|
gridObject={props.gridSummon}
|
|
object={props.gridSummon.object}
|
|
type="summon"
|
|
/>
|
|
{wikiButton}
|
|
</HovercardContent>
|
|
</Hovercard>
|
|
)
|
|
}
|
|
|
|
export default SummonHovercard
|