Add internationalization to account page

Replace hardcoded text with next-intl placeholders for proper i18n support.
- Add translation keys for page title, settings button, and logout button
- Add translations for both Croatian (hr) and English (en) locales

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Knee Cola
2025-11-25 20:48:49 +01:00
parent 6f0ba15eb8
commit a8a1253067
3 changed files with 27 additions and 20 deletions

View File

@@ -1,32 +1,29 @@
import { FC, Suspense } from 'react';
import { FC } from 'react';
import { Main } from '@/app/ui/Main';
import { UserSettingsForm as UserSettingsForm, UserSettingsFormSkeleton } from '@/app/ui/UserSettingsForm';
import { getUserSettings } from '@/app/lib/actions/userSettingsActions';
import Link from 'next/link';
import SettingsIcon from "@mui/icons-material/Settings";
import LogoutIcon from "@mui/icons-material/Logout";
import AccountCircle from "@mui/icons-material/AccountCircle";
import { useTranslations } from 'next-intl';
const AccountPage: FC = async () => {
const userSettings = await getUserSettings();
const Page: FC = () => {
const t = useTranslations('account-page');
return (
<Main>
<div className="flex flex-col items-center">
<UserSettingsForm userSettings={userSettings} />
<div className="card card-compact card-bordered min-w-[20em] max-w-[90em] bg-base-100 shadow-s my-1">
<div className="card-body">
<h2 className="card-title"><AccountCircle /> {t('title')}</h2>
<Link href="/account/settings" className='btn btn-neutral'><SettingsIcon /> {t('settings-button')}</Link>
<Link href="/account/logout" className='btn btn-error'><LogoutIcon /> {t('logout-button')}</Link>
</div>
</div>
</div>
</Main>
);
};
const Page: FC = () => {
return (
<Suspense fallback={
<Main>
<div className="flex flex-col items-center">
<div className="h-8 w-48 skeleton mb-4"></div>
<UserSettingsFormSkeleton />
</div>
</Main>
}>
<AccountPage />
</Suspense>
);
};

View File

@@ -2,6 +2,11 @@
"Index": {
"title": "Welcome!"
},
"account-page": {
"title": "User account",
"settings-button": "User Settings",
"logout-button": "Logout"
},
"PageFooter": {
"app-description": "Helping you to stay on top of your utility bills",
"links": {

View File

@@ -2,6 +2,11 @@
"Index": {
"title": "Dobrodošli"
},
"account-page": {
"title": "Korisnički račun",
"settings-button": "Korisničke postavke",
"logout-button": "Odjava"
},
"PageFooter": {
"app-description": "Preuzmite kontrolu nad svojim režijama!",
"links": {