elpatron/hoerdle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Admin-Seite lokalisiert: Übersetzungen hinzugefügt und URLs angepasst

Browse Source 
- Admin-Namespace zu de.json und en.json hinzugefügt
- Alle UI-Texte in der Admin-Seite mit useTranslations lokalisiert
- Link-Komponente von next-intl verwendet für korrekte Locale-URLs
- Buttons, Labels, Formulare und Tabellen-Header übersetzt
This commit is contained in:
Hördle Bot
2025-11-28 18:39:52 +01:00
parent 0182db69b5
commit 25a79230a8
3 changed files with 199 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

188
app/[locale]/admin/page.tsx
View File

@@ -1,6 +1,8 @@
'use client';
import { useState, useEffect, useRef } from 'react';
import { useTranslations, useLocale } from 'next-intl';
import { Link } from '@/lib/navigation';
import { getLocalizedValue } from '@/lib/i18n';
@@ -70,6 +72,8 @@ type SortField = 'id' | 'title' | 'artist' | 'createdAt' | 'releaseYear' | 'acti
type SortDirection = 'asc' | 'desc';
export default function AdminPage({ params }: { params: { locale: string } }) {
const t = useTranslations('Admin');
const locale = useLocale();
const [activeTab, setActiveTab] = useState<'de' | 'en'>('de');
const [password, setPassword] = useState('');
const [isAuthenticated, setIsAuthenticated] = useState(false);
@@ -194,7 +198,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
fetchSpecials();
fetchNews();
} else {
alert('Wrong password');
alert(t('wrongPassword'));
}
};
@@ -1020,16 +1024,16 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
if (!isAuthenticated) {
return (
<div className="container" style={{ justifyContent: 'center' }}>
<h1 className="title" style={{ marginBottom: '1rem', fontSize: '1.5rem' }}>Admin Login</h1>
<h1 className="title" style={{ marginBottom: '1rem', fontSize: '1.5rem' }}>{t('login')}</h1>
<input
type="password"
value={password}
onChange={e => setPassword(e.target.value)}
className="form-input"
style={{ marginBottom: '1rem', maxWidth: '300px' }}
placeholder="Password"
placeholder={t('password')}
/>
<button onClick={handleLogin} className="btn-primary">Login</button>
<button onClick={handleLogin} className="btn-primary">{t('loginButton')}</button>
</div>
);
}
@@ -1037,11 +1041,16 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
return (
<div className="admin-container">
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '2rem' }}>
<h1 className="title" style={{ margin: 0 }}>Hördle Admin Dashboard</h1>
<h1 className="title" style={{ margin: 0 }}>{t('title')}</h1>
<div style={{ display: 'flex', gap: '1rem', alignItems: 'center' }}>
<div style={{ display: 'flex', background: '#e5e7eb', borderRadius: '0.25rem', padding: '0.25rem' }}>
<button
onClick={() => setActiveTab('de')}
type="button"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
setActiveTab('de');
}}
style={{
padding: '0.25rem 0.75rem',
background: activeTab === 'de' ? 'white' : 'transparent',
@@ -1055,7 +1064,12 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
DE
</button>
<button
onClick={() => setActiveTab('en')}
type="button"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
setActiveTab('en');
}}
style={{
padding: '0.25rem 0.75rem',
background: activeTab === 'en' ? 'white' : 'transparent',
@@ -1082,7 +1096,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
fontSize: '0.9rem'
}}
>
🚪 Logout
🚪 {t('logout')}
</button>
</div>
</div>
@@ -1091,7 +1105,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<div className="admin-card" style={{ marginBottom: '2rem' }}>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
<h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', margin: 0 }}>
Manage Specials
{t('manageSpecials')}
</h2>
<button
onClick={() => setShowSpecials(!showSpecials)}
@@ -1104,42 +1118,42 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
fontSize: '0.875rem'
}}
>
{showSpecials ? '▼ Hide' : '▶ Show'}
{showSpecials ? t('hide') : t('show')}
</button>
</div>
{showSpecials && (
<>
<form onSubmit={handleCreateSpecial} style={{ marginBottom: '1rem' }}>
<form onSubmit={handleCreateSpecial} style={{ marginBottom: '1rem' }} key={`special-form-${activeTab}`}>
<div style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap', alignItems: 'flex-end' }}>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Name</label>
<input type="text" placeholder="Special name" value={newSpecialName[activeTab]} onChange={e => setNewSpecialName({ ...newSpecialName, [activeTab]: e.target.value })} className="form-input" required />
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('name')}</label>
<input type="text" placeholder={t('name')} value={newSpecialName[activeTab] || ''} onChange={e => setNewSpecialName({ ...newSpecialName, [activeTab]: e.target.value })} className="form-input" required key={`special-name-${activeTab}`} />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Subtitle</label>
<input type="text" placeholder="Subtitle" value={newSpecialSubtitle[activeTab]} onChange={e => setNewSpecialSubtitle({ ...newSpecialSubtitle, [activeTab]: e.target.value })} className="form-input" />
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('subtitle')}</label>
<input type="text" placeholder={t('subtitle')} value={newSpecialSubtitle[activeTab] || ''} onChange={e => setNewSpecialSubtitle({ ...newSpecialSubtitle, [activeTab]: e.target.value })} className="form-input" key={`special-subtitle-${activeTab}`} />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Max Attempts</label>
<input type="number" placeholder="Max attempts" value={newSpecialMaxAttempts} onChange={e => setNewSpecialMaxAttempts(Number(e.target.value))} className="form-input" min={1} style={{ width: '80px' }} />
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('maxAttempts')}</label>
<input type="number" placeholder={t('maxAttempts')} value={newSpecialMaxAttempts} onChange={e => setNewSpecialMaxAttempts(Number(e.target.value))} className="form-input" min={1} style={{ width: '80px' }} />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Unlock Steps</label>
<input type="text" placeholder="Unlock steps JSON" value={newSpecialUnlockSteps} onChange={e => setNewSpecialUnlockSteps(e.target.value)} className="form-input" style={{ width: '200px' }} />
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('unlockSteps')}</label>
<input type="text" placeholder={t('unlockSteps')} value={newSpecialUnlockSteps} onChange={e => setNewSpecialUnlockSteps(e.target.value)} className="form-input" style={{ width: '200px' }} />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Launch Date</label>
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('launchDate')}</label>
<input type="date" value={newSpecialLaunchDate} onChange={e => setNewSpecialLaunchDate(e.target.value)} className="form-input" />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>End Date</label>
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('endDate')}</label>
<input type="date" value={newSpecialEndDate} onChange={e => setNewSpecialEndDate(e.target.value)} className="form-input" />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Curator</label>
<input type="text" placeholder="Curator name" value={newSpecialCurator} onChange={e => setNewSpecialCurator(e.target.value)} className="form-input" />
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('curator')}</label>
<input type="text" placeholder={t('curator')} value={newSpecialCurator} onChange={e => setNewSpecialCurator(e.target.value)} className="form-input" />
</div>
<button type="submit" className="btn-primary" style={{ height: '38px' }}>Add Special</button>
<button type="submit" className="btn-primary" style={{ height: '38px' }}>{t('addSpecial')}</button>
</div>
</form>
<div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.5rem' }}>
@@ -1155,46 +1169,46 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
}}>
<span>{getLocalizedValue(special.name, activeTab)} ({special._count?.songs || 0})</span>
{special.subtitle && <span style={{ fontSize: '0.75rem', color: '#666', marginLeft: '0.25rem' }}>- {getLocalizedValue(special.subtitle, activeTab)}</span>}
<a href={`/admin/specials/${special.id}`} className="btn-primary" style={{ marginRight: '0.5rem', textDecoration: 'none' }}>Curate</a>
<button onClick={() => startEditSpecial(special)} className="btn-secondary" style={{ marginRight: '0.5rem' }}>Edit</button>
<button onClick={() => handleDeleteSpecial(special.id)} className="btn-danger">Delete</button>
<Link href={`/admin/specials/${special.id}`} className="btn-primary" style={{ marginRight: '0.5rem', textDecoration: 'none' }}>{t('curate')}</Link>
<button onClick={() => startEditSpecial(special)} className="btn-secondary" style={{ marginRight: '0.5rem' }}>{t('edit')}</button>
<button onClick={() => handleDeleteSpecial(special.id)} className="btn-danger">{t('delete')}</button>
</div>
))}
</div>
{editingSpecialId !== null && (
<div style={{ marginTop: '1rem', padding: '1rem', background: '#f9fafb', borderRadius: '0.5rem' }}>
<h3>Edit Special</h3>
<h3>{t('editSpecial')}</h3>
<div style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap', alignItems: 'flex-end' }}>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Name</label>
<input type="text" value={editSpecialName[activeTab]} onChange={e => setEditSpecialName({ ...editSpecialName, [activeTab]: e.target.value })} className="form-input" />
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('name')}</label>
<input type="text" value={editSpecialName[activeTab] || ''} onChange={e => setEditSpecialName({ ...editSpecialName, [activeTab]: e.target.value })} className="form-input" key={`edit-special-name-${activeTab}`} />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Subtitle</label>
<input type="text" value={editSpecialSubtitle[activeTab]} onChange={e => setEditSpecialSubtitle({ ...editSpecialSubtitle, [activeTab]: e.target.value })} className="form-input" />
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('subtitle')}</label>
<input type="text" value={editSpecialSubtitle[activeTab] || ''} onChange={e => setEditSpecialSubtitle({ ...editSpecialSubtitle, [activeTab]: e.target.value })} className="form-input" key={`edit-special-subtitle-${activeTab}`} />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Max Attempts</label>
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('maxAttempts')}</label>
<input type="number" value={editSpecialMaxAttempts} onChange={e => setEditSpecialMaxAttempts(Number(e.target.value))} className="form-input" min={1} style={{ width: '80px' }} />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Unlock Steps</label>
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('unlockSteps')}</label>
<input type="text" value={editSpecialUnlockSteps} onChange={e => setEditSpecialUnlockSteps(e.target.value)} className="form-input" style={{ width: '200px' }} />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Launch Date</label>
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('launchDate')}</label>
<input type="date" value={editSpecialLaunchDate} onChange={e => setEditSpecialLaunchDate(e.target.value)} className="form-input" />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>End Date</label>
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('endDate')}</label>
<input type="date" value={editSpecialEndDate} onChange={e => setEditSpecialEndDate(e.target.value)} className="form-input" />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Curator</label>
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('curator')}</label>
<input type="text" value={editSpecialCurator} onChange={e => setEditSpecialCurator(e.target.value)} className="form-input" />
</div>
<button onClick={saveEditedSpecial} className="btn-primary" style={{ height: '38px' }}>Save</button>
<button onClick={() => setEditingSpecialId(null)} className="btn-secondary" style={{ height: '38px' }}>Cancel</button>
<button onClick={saveEditedSpecial} className="btn-primary" style={{ height: '38px' }}>{t('save')}</button>
<button onClick={() => setEditingSpecialId(null)} className="btn-secondary" style={{ height: '38px' }}>{t('cancel')}</button>
</div>
</div>
)}
@@ -1206,7 +1220,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<div className="admin-card" style={{ marginBottom: '2rem' }}>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
<h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', margin: 0 }}>
Manage Genres
{t('manageGenres')}
</h2>
<button
onClick={() => setShowGenres(!showGenres)}
@@ -1219,7 +1233,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
fontSize: '0.875rem'
}}
>
{showGenres ? '▼ Hide' : '▶ Show'}
{showGenres ? t('hide') : t('show')}
</button>
</div>
{showGenres && (
@@ -1227,19 +1241,21 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<div style={{ display: 'flex', gap: '0.5rem', marginBottom: '1rem', alignItems: 'center' }}>
<input
type="text"
value={newGenreName[activeTab]}
value={newGenreName[activeTab] || ''}
onChange={e => setNewGenreName({ ...newGenreName, [activeTab]: e.target.value })}
placeholder="New Genre Name"
placeholder={t('newGenreName')}
className="form-input"
style={{ maxWidth: '200px' }}
key={`genre-name-${activeTab}`}
/>
<input
type="text"
value={newGenreSubtitle[activeTab]}
value={newGenreSubtitle[activeTab] || ''}
onChange={e => setNewGenreSubtitle({ ...newGenreSubtitle, [activeTab]: e.target.value })}
placeholder="Subtitle"
placeholder={t('subtitle')}
className="form-input"
style={{ maxWidth: '300px' }}
key={`genre-subtitle-${activeTab}`}
/>
<label style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', fontSize: '0.875rem', cursor: 'pointer' }}>
<input
@@ -1247,9 +1263,9 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
checked={newGenreActive}
onChange={e => setNewGenreActive(e.target.checked)}
/>
Active
{t('active')}
</label>
<button onClick={createGenre} className="btn-primary">Add Genre</button>
<button onClick={createGenre} className="btn-primary">{t('addGenre')}</button>
</div>
<div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.5rem' }}>
{genres.map(genre => (
@@ -1265,22 +1281,22 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
}}>
<span>{getLocalizedValue(genre.name, activeTab)} ({genre._count?.songs || 0})</span>
{genre.subtitle && <span style={{ fontSize: '0.75rem', color: '#666' }}>- {getLocalizedValue(genre.subtitle, activeTab)}</span>}
<button onClick={() => startEditGenre(genre)} className="btn-secondary" style={{ padding: '0.1rem 0.5rem', fontSize: '0.75rem' }}>Edit</button>
<button onClick={() => startEditGenre(genre)} className="btn-secondary" style={{ padding: '0.1rem 0.5rem', fontSize: '0.75rem' }}>{t('edit')}</button>
<button onClick={() => deleteGenre(genre.id)} className="btn-danger" style={{ padding: '0.1rem 0.5rem', fontSize: '0.75rem' }}>×</button>
</div>
))}
</div>
{editingGenreId !== null && (
<div style={{ marginTop: '1rem', padding: '1rem', background: '#f9fafb', borderRadius: '0.5rem' }}>
<h3>Edit Genre</h3>
<h3>{t('editGenre')}</h3>
<div style={{ display: 'flex', gap: '0.5rem', alignItems: 'flex-end' }}>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Name</label>
<input type="text" value={editGenreName[activeTab]} onChange={e => setEditGenreName({ ...editGenreName, [activeTab]: e.target.value })} className="form-input" />
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('name')}</label>
<input type="text" value={editGenreName[activeTab] || ''} onChange={e => setEditGenreName({ ...editGenreName, [activeTab]: e.target.value })} className="form-input" key={`edit-genre-name-${activeTab}`} />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>Subtitle</label>
<input type="text" value={editGenreSubtitle[activeTab]} onChange={e => setEditGenreSubtitle({ ...editGenreSubtitle, [activeTab]: e.target.value })} className="form-input" style={{ width: '300px' }} />
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('subtitle')}</label>
<input type="text" value={editGenreSubtitle[activeTab] || ''} onChange={e => setEditGenreSubtitle({ ...editGenreSubtitle, [activeTab]: e.target.value })} className="form-input" style={{ width: '300px' }} key={`edit-genre-subtitle-${activeTab}`} />
</div>
<div style={{ display: 'flex', flexDirection: 'column', justifyContent: 'flex-end', paddingBottom: '0.5rem' }}>
<label style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', fontSize: '0.875rem', cursor: 'pointer' }}>
@@ -1289,11 +1305,11 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
checked={editGenreActive}
onChange={e => setEditGenreActive(e.target.checked)}
/>
Active
{t('active')}
</label>
</div>
<button onClick={saveEditedGenre} className="btn-primary">Save</button>
<button onClick={() => setEditingGenreId(null)} className="btn-secondary">Cancel</button>
<button onClick={saveEditedGenre} className="btn-primary">{t('save')}</button>
<button onClick={() => setEditingGenreId(null)} className="btn-secondary">{t('cancel')}</button>
</div>
</div>
)}
@@ -1386,7 +1402,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<div className="admin-card" style={{ marginBottom: '2rem' }}>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
<h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', margin: 0 }}>
Manage News & Announcements
{t('manageNews')}
</h2>
<button
onClick={() => setShowNews(!showNews)}
@@ -1399,7 +1415,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
fontSize: '0.875rem'
}}
>
{showNews ? '▼ Hide' : '▶ Show'}
{showNews ? t('hide') : t('show')}
</button>
</div>
{showNews && (
@@ -1408,27 +1424,29 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<div style={{ display: 'flex', flexDirection: 'column', gap: '0.5rem' }}>
<input
type="text"
value={newNewsTitle[activeTab]}
value={newNewsTitle[activeTab] || ''}
onChange={e => setNewNewsTitle({ ...newNewsTitle, [activeTab]: e.target.value })}
placeholder="News Title"
placeholder={t('newsTitle')}
className="form-input"
required
key={`news-title-${activeTab}`}
/>
<textarea
value={newNewsContent[activeTab]}
value={newNewsContent[activeTab] || ''}
onChange={e => setNewNewsContent({ ...newNewsContent, [activeTab]: e.target.value })}
placeholder="Content (Markdown supported)"
placeholder={t('content')}
className="form-input"
rows={4}
required
style={{ fontFamily: 'monospace', fontSize: '0.875rem' }}
key={`news-content-${activeTab}`}
/>
<div style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap', alignItems: 'center' }}>
<input
type="text"
value={newNewsAuthor}
onChange={e => setNewNewsAuthor(e.target.value)}
placeholder="Author (optional)"
placeholder={t('author')}
className="form-input"
style={{ maxWidth: '200px' }}
/>
@@ -1438,7 +1456,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
className="form-input"
style={{ maxWidth: '200px' }}
>
<option value="">No Special Link</option>
<option value="">{t('noSpecialLink')}</option>
{specials.map(s => (
<option key={s.id} value={s.id}>{getLocalizedValue(s.name, activeTab)}</option>
))}
@@ -1449,9 +1467,9 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
checked={newNewsFeatured}
onChange={e => setNewNewsFeatured(e.target.checked)}
/>
Featured
{t('featured')}
</label>
<button type="submit" className="btn-primary">Add News</button>
<button type="submit" className="btn-primary">{t('addNews')}</button>
</div>
</div>
</form>
@@ -1468,23 +1486,25 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<div style={{ display: 'flex', flexDirection: 'column', gap: '0.5rem' }}>
<input
type="text"
value={editNewsTitle[activeTab]}
value={editNewsTitle[activeTab] || ''}
onChange={e => setEditNewsTitle({ ...editNewsTitle, [activeTab]: e.target.value })}
className="form-input"
key={`edit-news-title-${activeTab}`}
/>
<textarea
value={editNewsContent[activeTab]}
value={editNewsContent[activeTab] || ''}
onChange={e => setEditNewsContent({ ...editNewsContent, [activeTab]: e.target.value })}
className="form-input"
rows={4}
style={{ fontFamily: 'monospace', fontSize: '0.875rem' }}
key={`edit-news-content-${activeTab}`}
/>
<div style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap', alignItems: 'center' }}>
<input
type="text"
value={editNewsAuthor}
onChange={e => setEditNewsAuthor(e.target.value)}
placeholder="Author"
placeholder={t('author')}
className="form-input"
style={{ maxWidth: '200px' }}
/>
@@ -1494,7 +1514,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
className="form-input"
style={{ maxWidth: '200px' }}
>
<option value="">No Special Link</option>
<option value="">{t('noSpecialLink')}</option>
{specials.map(s => (
<option key={s.id} value={s.id}>{getLocalizedValue(s.name, activeTab)}</option>
))}
@@ -1505,10 +1525,10 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
checked={editNewsFeatured}
onChange={e => setEditNewsFeatured(e.target.checked)}
/>
Featured
{t('featured')}
</label>
<button onClick={saveEditedNews} className="btn-primary">Save</button>
<button onClick={() => setEditingNewsId(null)} className="btn-secondary">Cancel</button>
<button onClick={saveEditedNews} className="btn-primary">{t('save')}</button>
<button onClick={() => setEditingNewsId(null)} className="btn-secondary">{t('cancel')}</button>
</div>
</div>
) : (
@@ -1543,7 +1563,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
</div>
<div style={{ display: 'flex', gap: '0.25rem', marginLeft: '1rem' }}>
<button onClick={() => startEditNews(newsItem)} className="btn-secondary" style={{ padding: '0.25rem 0.5rem', fontSize: '0.75rem' }}>Edit</button>
<button onClick={() => handleDeleteNews(newsItem.id)} className="btn-danger" style={{ padding: '0.25rem 0.5rem', fontSize: '0.75rem' }}>Delete</button>
<button onClick={() => handleDeleteNews(newsItem.id)} className="btn-danger" style={{ padding: '0.25rem 0.5rem', fontSize: '0.75rem' }}>{t('delete')}</button>
</div>
</div>
</>
@@ -1552,7 +1572,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
))}
{news.length === 0 && (
<p style={{ color: '#666', fontSize: '0.875rem', textAlign: 'center', padding: '1rem' }}>
No news items yet. Create one above!
{t('noNewsItems')}
</p>
)}
</div>
@@ -1561,7 +1581,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
</div>
<div className="admin-card" style={{ marginBottom: '2rem' }}>
<h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', marginBottom: '1rem' }}>Upload Songs</h2>
<h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', marginBottom: '1rem' }}>{t('uploadSongs')}</h2>
<form onSubmit={handleBatchUpload}>
{/* Drag & Drop Zone */}
<div
@@ -1713,7 +1733,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<div className="admin-card">
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
<h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', margin: 0 }}>
Today's Daily Puzzles
{t('todaysPuzzles')}
</h2>
<button
onClick={() => setShowDailyPuzzles(!showDailyPuzzles)}
@@ -1730,15 +1750,15 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
</button>
</div>
{showDailyPuzzles && (dailyPuzzles.length === 0 ? (
<p style={{ color: '#6b7280' }}>No daily puzzles found for today.</p>
<p style={{ color: '#6b7280' }}>{t('noPuzzlesToday')}</p>
) : (
<table style={{ width: '100%', borderCollapse: 'collapse' }}>
<thead>
<tr style={{ borderBottom: '2px solid #e5e7eb' }}>
<th style={{ padding: '0.75rem', textAlign: 'left', fontWeight: 'bold' }}>Category</th>
<th style={{ padding: '0.75rem', textAlign: 'left', fontWeight: 'bold' }}>Song</th>
<th style={{ padding: '0.75rem', textAlign: 'left', fontWeight: 'bold' }}>Artist</th>
<th style={{ padding: '0.75rem', textAlign: 'center', fontWeight: 'bold' }}>Actions</th>
<th style={{ padding: '0.75rem', textAlign: 'left', fontWeight: 'bold' }}>{t('category')}</th>
<th style={{ padding: '0.75rem', textAlign: 'left', fontWeight: 'bold' }}>{t('song')}</th>
<th style={{ padding: '0.75rem', textAlign: 'left', fontWeight: 'bold' }}>{t('artist')}</th>
<th style={{ padding: '0.75rem', textAlign: 'center', fontWeight: 'bold' }}>{t('actions')}</th>
</tr>
</thead>
<tbody>
@@ -1770,7 +1790,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<button
onClick={() => handleDeletePuzzle(puzzle.id)}
style={{ fontSize: '1.25rem', cursor: 'pointer', border: 'none', background: 'none' }}
title="Delete"
title={t('deletePuzzle')}
>
🗑️
</button>
@@ -2118,7 +2138,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<button
onClick={() => handleDelete(song.id, song.title)}
style={{ fontSize: '1.25rem', cursor: 'pointer', border: 'none', background: 'none' }}
title="Delete"
title={t('deletePuzzle')}
>
🗑️
</button>

47
messages/de.json
View File

@@ -104,5 +104,52 @@
"globalTooltip": "Ein zufälliger Song aus der gesamten Sammlung",
"comingSoon": "Demnächst",
"curatedBy": "Kuratiert von"
},
"Admin": {
"title": "Hördle Admin Dashboard",
"login": "Admin Login",
"password": "Passwort",
"loginButton": "Login",
"logout": "Abmelden",
"manageSpecials": "Specials verwalten",
"manageGenres": "Genres verwalten",
"manageNews": "News & Ankündigungen verwalten",
"uploadSongs": "Songs hochladen",
"todaysPuzzles": "Heutige tägliche Rätsel",
"show": "▶ Anzeigen",
"hide": "▼ Ausblenden",
"addSpecial": "Special hinzufügen",
"addGenre": "Genre hinzufügen",
"addNews": "News hinzufügen",
"edit": "Bearbeiten",
"delete": "Löschen",
"save": "Speichern",
"cancel": "Abbrechen",
"curate": "Kurieren",
"name": "Name",
"subtitle": "Untertitel",
"maxAttempts": "Max. Versuche",
"unlockSteps": "Freischalt-Schritte",
"launchDate": "Startdatum",
"endDate": "Enddatum",
"curator": "Kurator",
"active": "Aktiv",
"newGenreName": "Neuer Genre-Name",
"editSpecial": "Special bearbeiten",
"editGenre": "Genre bearbeiten",
"editNews": "News bearbeiten",
"newsTitle": "News-Titel",
"content": "Inhalt (Markdown unterstützt)",
"author": "Autor (optional)",
"featured": "Hervorgehoben",
"noSpecialLink": "Kein Special-Link",
"noNewsItems": "Noch keine News-Einträge. Erstelle einen oben!",
"noPuzzlesToday": "Keine täglichen Rätsel für heute gefunden.",
"category": "Kategorie",
"song": "Song",
"artist": "Interpret",
"actions": "Aktionen",
"deletePuzzle": "Löschen",
"wrongPassword": "Falsches Passwort"
}
}

47
messages/en.json
View File

@@ -104,5 +104,52 @@
"globalTooltip": "A random song from the entire collection",
"comingSoon": "Coming soon",
"curatedBy": "Curated by"
},
"Admin": {
"title": "Hördle Admin Dashboard",
"login": "Admin Login",
"password": "Password",
"loginButton": "Login",
"logout": "Logout",
"manageSpecials": "Manage Specials",
"manageGenres": "Manage Genres",
"manageNews": "Manage News & Announcements",
"uploadSongs": "Upload Songs",
"todaysPuzzles": "Today's Daily Puzzles",
"show": "▶ Show",
"hide": "▼ Hide",
"addSpecial": "Add Special",
"addGenre": "Add Genre",
"addNews": "Add News",
"edit": "Edit",
"delete": "Delete",
"save": "Save",
"cancel": "Cancel",
"curate": "Curate",
"name": "Name",
"subtitle": "Subtitle",
"maxAttempts": "Max Attempts",
"unlockSteps": "Unlock Steps",
"launchDate": "Launch Date",
"endDate": "End Date",
"curator": "Curator",
"active": "Active",
"newGenreName": "New Genre Name",
"editSpecial": "Edit Special",
"editGenre": "Edit Genre",
"editNews": "Edit News",
"newsTitle": "News Title",
"content": "Content (Markdown supported)",
"author": "Author (optional)",
"featured": "Featured",
"noSpecialLink": "No Special Link",
"noNewsItems": "No news items yet. Create one above!",
"noPuzzlesToday": "No daily puzzles found for today.",
"category": "Category",
"song": "Song",
"artist": "Artist",
"actions": "Actions",
"deletePuzzle": "Delete",
"wrongPassword": "Wrong password"
}
}