nvrl/holy-flavor-rater
1
0 Fork 0
mirror of https://github.com/narrrl/holy-flavor-rater.git synced 2026-11-03 16:41:27 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'main' into narl.io

Browse Source
This commit is contained in:
nvrl committed 2026-02-17 19:19:12 +01:00
2 parents 156d9c2606 ee8e51d891
commit 7902e0fbe6
4 files changed
+107 -58
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

frontend/src/i18n.ts
+42 -2
View File
@@ -94,7 +94,27 @@ const resources = {
"buyNow": "Buy Now",
"reviews": "reviews",
"rank": "Rank",
"loading": "Loading..."
"loading": "Loading...",
"replies": "Replies",
"reply": "Reply",
"edit": "Edit",
"delete": "Delete",
"save": "Save",
"cancel": "Cancel"
},
"community": {
"title": "Community Activity",
"subtitle": "Stay updated with your circle's latest ratings and discussions.",
"quietFeed": "Your feed is a bit empty...",
"followMore": "Follow more people to see their flavor ratings here!",
"topRated": "Circle's Top Rated",
"notifications": "Recent Notifications",
"notifReply": "replied",
"notifMention": "mentioned you",
"noNotifications": "No notifications.",
"searchFriends": "Search friends...",
"writeReply": "Add a reply...",
"rated": "rated"
},
"about": {
"title": "About This Project",
@@ -204,7 +224,27 @@ const resources = {
"buyNow": "Jetzt kaufen",
"reviews": "Bewertungen",
"rank": "Rang",
"loading": "Wird geladen..."
"loading": "Wird geladen...",
"replies": "Antworten",
"reply": "Antworten",
"edit": "Bearbeiten",
"delete": "Löschen",
"save": "Speichern",
"cancel": "Abbrechen"
},
"community": {
"title": "Community-Aktivität",
"subtitle": "Bleib auf dem Laufenden mit den neuesten Bewertungen und Diskussionen deines Kreises.",
"quietFeed": "Dein Feed ist noch etwas leer...",
"followMore": "Folge mehr Personen, um deren Bewertungen hier zu sehen!",
"topRated": "Top-Bewertungen deines Kreises",
"notifications": "Neueste Benachrichtigungen",
"notifReply": "hat geantwortet",
"notifMention": "hat dich erwähnt",
"noNotifications": "Keine Benachrichtigungen.",
"searchFriends": "Freunde suchen...",
"writeReply": "Eine Antwort hinzufügen...",
"rated": "bewertete"
},
"about": {
"title": "Über dieses Projekt",
frontend/src/pages/CommunityFeed.tsx
+18 -16
View File
@@ -32,6 +32,7 @@ import api from '../api';
import { useTitle } from '../hooks/useTitle';
import RichText from '../components/RichText';
import { formatDate } from '../utils/date';
import { useTranslation } from 'react-i18next';
interface Reply {
id: number;
@@ -76,7 +77,8 @@ interface Notification {
}
const CommunityFeed: React.FC = () => {
useTitle('Community Feed');
const { t } = useTranslation();
useTitle(t('community.title'));
const navigate = useNavigate();
const [ratings, setRatings] = useState<FeedRating[]>([]);
const [following, setFollowing] = useState<FollowedUser[]>([]);
@@ -175,9 +177,9 @@ const CommunityFeed: React.FC = () => {
return (
<Container maxWidth="lg" sx={{ py: 4 }}>
<Box sx={{ mb: 6 }}>
<Typography variant="h3" sx={{ fontWeight: '800', mb: 1 }}>Community Activity</Typography>
<Typography variant="h3" sx={{ fontWeight: '800', mb: 1 }}>{t('community.title')}</Typography>
<Typography variant="h6" color="text.secondary">
Stay updated with your circle's latest ratings and discussions.
{t('community.subtitle')}
</Typography>
</Box>
@@ -194,12 +196,12 @@ const CommunityFeed: React.FC = () => {
border: '1px dashed',
borderColor: 'divider'
}}>
<Typography variant="h6" gutterBottom color="text.secondary">Your feed is a bit empty...</Typography>
<Typography variant="h6" gutterBottom color="text.secondary">{t('community.quietFeed')}</Typography>
<Typography variant="body2" color="text.secondary" sx={{ mb: 3 }}>
Follow more people to see their flavor ratings here!
{t('community.followMore')}
</Typography>
<Button variant="contained" component={Link} to="/" sx={{ borderRadius: 2 }}>
Explore Flavors
{t('home.exploreFlavors')}
</Button>
</Box>
) : (
@@ -254,14 +256,14 @@ const CommunityFeed: React.FC = () => {
<Box sx={{ display: 'flex', gap: 3 }}>
<Box sx={{ flex: 1 }}>
<Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
Rated <MuiLink component={Link} to={`/flavor/${rating.flavor}`} sx={{ color: 'primary.main', fontWeight: 'bold', textDecoration: 'none' }}>{rating.flavor_name}</MuiLink>
{t('community.rated')} <MuiLink component={Link} to={`/flavor/${rating.flavor}`} sx={{ color: 'primary.main', fontWeight: 'bold', textDecoration: 'none' }}>{rating.flavor_name}</MuiLink>
</Typography>
{rating.comment ? (
<Typography variant="body1" sx={{ lineHeight: 1.6, fontStyle: 'italic', color: 'text.primary' }}>
<RichText text={rating.comment} />
</Typography>
) : (
<Typography variant="body2" color="text.secondary" sx={{ fontStyle: 'italic' }}>No review text.</Typography>
<Typography variant="body2" color="text.secondary" sx={{ fontStyle: 'italic' }}>{t('dashboard.noRatings')}</Typography>
)}
</Box>
<Link to={`/flavor/${rating.flavor}`} style={{ flexShrink: 0 }}>
@@ -280,7 +282,7 @@ const CommunityFeed: React.FC = () => {
onClick={() => handleReplyToggle(rating.id)}
sx={{ textTransform: 'none', color: 'text.secondary' }}
>
{rating.replies.length > 0 ? `${rating.replies.length} Replies` : 'Reply'}
{rating.replies.length > 0 ? `${rating.replies.length} ${t('common.replies')}` : t('common.reply')}
</Button>
<Collapse in={expandedReplies[rating.id]}>
@@ -296,7 +298,7 @@ const CommunityFeed: React.FC = () => {
))}
<Box sx={{ mt: 2, display: 'flex', gap: 1 }}>
<TextField
fullWidth size="small" placeholder="Add a reply..."
fullWidth size="small" placeholder={t('community.writeReply')}
value={replyInputs[rating.id] || ''}
onChange={(e) => setReplyInputs(prev => ({ ...prev, [rating.id]: e.target.value }))}
onKeyDown={(e) => e.key === 'Enter' && handleReplySubmit(rating.id)}
@@ -327,11 +329,11 @@ const CommunityFeed: React.FC = () => {
<Card elevation={0} sx={{ borderRadius: 4, border: '1px solid', borderColor: 'divider' }}>
<Box sx={{ p: 2, borderBottom: '1px solid', borderColor: 'divider', bgcolor: alpha('#000', 0.02), display: 'flex', alignItems: 'center', gap: 1 }}>
<NotificationsIcon color="primary" fontSize="small" />
<Typography variant="subtitle1" sx={{ fontWeight: 'bold' }}>Recent Notifications</Typography>
<Typography variant="subtitle1" sx={{ fontWeight: 'bold' }}>{t('community.notifications')}</Typography>
</Box>
<List disablePadding>
{notifications.length === 0 ? (
<Box sx={{ p: 3, textAlign: 'center' }}><Typography variant="body2" color="text.secondary">No notifications.</Typography></Box>
<Box sx={{ p: 3, textAlign: 'center' }}><Typography variant="body2" color="text.secondary">{t('community.noNotifications')}</Typography></Box>
) : (
notifications.map(n => (
<ListItemButton key={n.id} onClick={() => n.flavor_id && navigate(`/flavor/${n.flavor_id}`)} sx={{ py: 1.5 }}>
@@ -341,7 +343,7 @@ const CommunityFeed: React.FC = () => {
<ListItemText
primary={
<Typography variant="body2" sx={{ fontSize: '0.8rem' }}>
<strong>{n.actor_username}</strong> {n.notification_type === 'reply' ? 'replied' : 'mentioned you'}
<strong>{n.actor_username}</strong> {n.notification_type === 'reply' ? t('community.notifReply') : t('community.notifMention')}
</Typography>
}
secondary={formatTimestamp(n.created_at)}
@@ -357,11 +359,11 @@ const CommunityFeed: React.FC = () => {
<Card elevation={0} sx={{ borderRadius: 4, border: '1px solid', borderColor: 'divider' }}>
<Box sx={{ p: 2, borderBottom: '1px solid', borderColor: 'divider', bgcolor: alpha('#000', 0.02), display: 'flex', alignItems: 'center', gap: 1 }}>
<PeopleIcon color="primary" fontSize="small" />
<Typography variant="subtitle1" sx={{ fontWeight: 'bold' }}>Following</Typography>
<Typography variant="subtitle1" sx={{ fontWeight: 'bold' }}>{t('nav.following')}</Typography>
</Box>
<Box sx={{ p: 1.5 }}>
<TextField
fullWidth size="small" placeholder="Search friends..."
fullWidth size="small" placeholder={t('community.searchFriends')}
value={followingSearch}
onChange={(e) => setFollowingSearch(e.target.value)}
InputProps={{ startAdornment: <SearchIcon fontSize="small" sx={{ mr: 1, color: 'text.secondary' }} /> }}
@@ -381,7 +383,7 @@ const CommunityFeed: React.FC = () => {
<Card elevation={0} sx={{ borderRadius: 4, border: '1px solid', borderColor: 'divider' }}>
<Box sx={{ p: 2, borderBottom: '1px solid', borderColor: 'divider', bgcolor: alpha('#000', 0.02), display: 'flex', alignItems: 'center', gap: 1 }}>
<WhatshotIcon color="error" fontSize="small" />
<Typography variant="subtitle1" sx={{ fontWeight: 'bold' }}>Circle's Top Rated</Typography>
<Typography variant="subtitle1" sx={{ fontWeight: 'bold' }}>{t('community.topRated')}</Typography>
</Box>
<List disablePadding>
{topFollowed.map((flavor, idx) => (
frontend/src/pages/MainPage.tsx
+37 -30
View File
@@ -251,56 +251,63 @@ const MainPage: React.FC = () => {
<Button variant="contained" component={Link} to="/" size="small" sx={{ borderRadius: 2 }}>{t('home.exploreFlavors')}</Button>
</Paper>
) : (
<Box sx={{ display: 'grid', gridTemplateColumns: { xs: '1fr', sm: 'repeat(2, 1fr)', lg: 'repeat(3, 1fr)' }, gap: 3 }}>
<Box sx={{ display: 'grid', gridTemplateColumns: { xs: '1fr', sm: 'repeat(2, 1fr)', lg: 'repeat(3, 1fr)' }, gap: 2 }}>
{feedRatings.map(rating => (
<Card
key={rating.id}
component={Link}
to={`/flavor/${rating.flavor}`}
sx={{
borderRadius: 3,
transition: 'all 0.3s ease',
'&:hover': { transform: 'translateY(-4px)', boxShadow: '0 12px 24px rgba(0,0,0,0.15)' },
textDecoration: 'none',
transition: 'all 0.2s ease',
'&:hover': { transform: 'translateY(-2px)', borderColor: 'primary.main', boxShadow: '0 8px 16px rgba(0,0,0,0.1)' },
bgcolor: (theme) => alpha(theme.palette.background.paper, 0.4),
backdropFilter: 'blur(10px)',
border: '1px solid',
borderColor: (theme) => alpha(theme.palette.text.primary, 0.05)
borderColor: 'divider',
color: 'inherit',
display: 'flex',
flexDirection: 'column'
}}
>
<CardContent sx={{ p: { xs: 1.5, sm: 2 } }}>
<Box sx={{ display: 'flex', alignItems: 'center', mb: 1.5 }}>
<Link to={`/profile/${rating.user}`} style={{ textDecoration: 'none', color: 'inherit', display: 'flex', alignItems: 'center' }}>
<Avatar src={rating.user_avatar || undefined} sx={{ width: 24, height: 24, mr: 1 }}>
<CardContent sx={{ p: 2, flex: 1, '&:last-child': { pb: 2 } }}>
<Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start', mb: 1.5 }}>
<Box sx={{ display: 'flex', alignItems: 'center', minWidth: 0, flex: 1 }}>
<Avatar src={rating.user_avatar || undefined} sx={{ width: 22, height: 22, mr: 1 }}>
{!rating.user_avatar && rating.user.charAt(0).toUpperCase()}
</Avatar>
<Typography variant="subtitle2" sx={{ fontWeight: 'bold', fontSize: '0.8rem' }}>{rating.user}</Typography>
</Link>
<Typography variant="caption" color="text.secondary" sx={{ ml: 0.5 }}>rated</Typography>
<Box sx={{ flexGrow: 1 }} />
<Typography variant="caption" color="text.secondary">
{formatDate(rating.created_at)}
<Typography variant="subtitle2" sx={{ fontWeight: 'bold', fontSize: '0.8rem', whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>
{rating.user}
</Typography>
</Box>
<Typography variant="caption" color="text.secondary" sx={{ fontSize: '0.65rem', ml: 1, whiteSpace: 'nowrap' }}>
{t('home.rated')} {formatDate(rating.created_at)}
</Typography>
</Box>
<Box sx={{ display: 'flex', gap: 1.5, alignItems: 'center' }}>
<Box sx={{ display: 'flex', gap: 2, alignItems: 'center' }}>
<Box
component="img"
src={rating.flavor_image || undefined}
sx={{ width: 50, height: 50, borderRadius: 1, objectFit: 'cover', border: '1px solid', borderColor: 'divider' }}
sx={{ width: 44, height: 44, borderRadius: 1.5, objectFit: 'contain', bgcolor: 'action.hover', p: 0.5, border: '1px solid', borderColor: 'divider' }}
/>
<Box sx={{ minWidth: 0, flex: 1 }}>
<Link to={`/flavor/${rating.flavor}`} style={{ textDecoration: 'none', color: 'inherit' }}>
<Typography variant="body2" sx={{ fontWeight: 'bold', display: '-webkit-box', WebkitLineClamp: 1, WebkitBoxOrient: 'vertical', overflow: 'hidden', fontSize: '0.85rem', mb: 0.5 }}>
{rating.flavor_name}
<Typography variant="body2" sx={{ fontWeight: 'bold', lineHeight: 1.2, mb: 0.5, fontSize: '0.85rem', display: '-webkit-box', WebkitLineClamp: 1, WebkitBoxOrient: 'vertical', overflow: 'hidden' }}>
{rating.flavor_name}
</Typography>
<Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>
<Typography variant="caption" sx={{
fontWeight: '900',
color: 'primary.main',
bgcolor: (theme) => alpha(theme.palette.primary.main, 0.1),
px: 1,
py: 0.2,
borderRadius: 1,
fontSize: '0.75rem'
}}>
{rating.score} / 10
</Typography>
</Link>
<Box sx={{ display: 'flex', alignItems: 'center' }}>
{/* Compact rating for anything below Large desktop to prevent cutoffs */}
<Box sx={{ display: { xs: 'flex', lg: 'none' }, alignItems: 'center', gap: 0.5 }}>
<StarIcon sx={{ fontSize: '1rem', color: 'primary.main' }} />
<Typography variant="caption" sx={{ fontWeight: 'bold' }}>{rating.score}/10</Typography>
</Box>
<Box sx={{ display: { xs: 'none', lg: 'flex' }, alignItems: 'center' }}>
<MuiRating value={rating.score} readOnly size="small" max={10} />
<Typography variant="caption" sx={{ ml: 1, fontWeight: 'bold' }}>{rating.score}/10</Typography>
</Box>
</Box>
</Box>
</Box>
frontend/src/pages/flavors/FlavorDetail.tsx
+10 -10
View File
@@ -388,8 +388,8 @@ const FlavorDetail: React.FC = () => {
onChange={(e) => setEditComment(e.target.value)}
/>
<Box sx={{ display: 'flex', gap: 1 }}>
<Button variant="contained" onClick={() => handleUpdateRating(rating.id)}>Save</Button>
<Button onClick={() => setEditMode(null)}>Cancel</Button>
<Button variant="contained" onClick={() => handleUpdateRating(rating.id)}>{t('common.save')}</Button>
<Button onClick={() => setEditMode(null)}>{t('common.cancel')}</Button>
</Box>
</Box>
) : (
@@ -437,8 +437,8 @@ const FlavorDetail: React.FC = () => {
<Box />
{currentUser === rating.user && (
<Box>
<Button size="small" onClick={() => startEdit(rating)} sx={{ minWidth: 0, mr: 1 }}>Edit</Button>
<Button size="small" color="error" onClick={() => handleDeleteRating(rating.id)} sx={{ minWidth: 0 }}>Delete</Button>
<Button size="small" onClick={() => startEdit(rating)} sx={{ minWidth: 0, mr: 1 }}>{t('common.edit')}</Button>
<Button size="small" color="error" onClick={() => handleDeleteRating(rating.id)} sx={{ minWidth: 0 }}>{t('common.delete')}</Button>
</Box>
)}
</Box>
@@ -471,8 +471,8 @@ const FlavorDetail: React.FC = () => {
</Typography>
{currentUser === reply.user && editingReplyId !== reply.id && (
<Box sx={{ display: 'flex' }}>
<Button size="small" sx={{ minWidth: 0, p: 0.5, fontSize: '0.7rem' }} onClick={() => { setEditingReplyId(reply.id); setEditReplyText(reply.text); }}>Edit</Button>
<Button size="small" color="error" sx={{ minWidth: 0, p: 0.5, fontSize: '0.7rem' }} onClick={() => handleDeleteReply(reply.id)}>Delete</Button>
<Button size="small" sx={{ minWidth: 0, p: 0.5, fontSize: '0.7rem' }} onClick={() => { setEditingReplyId(reply.id); setEditReplyText(reply.text); }}>{t('common.edit')}</Button>
<Button size="small" color="error" sx={{ minWidth: 0, p: 0.5, fontSize: '0.7rem' }} onClick={() => handleDeleteReply(reply.id)}>{t('common.delete')}</Button>
</Box>
)}
</Box>
@@ -487,8 +487,8 @@ const FlavorDetail: React.FC = () => {
onChange={(e) => setEditReplyText(e.target.value)}
/>
<Box sx={{ display: 'flex', gap: 1 }}>
<Button variant="contained" size="small" onClick={() => handleUpdateReply(reply.id)}>Save</Button>
<Button size="small" onClick={() => setEditingReplyId(null)}>Cancel</Button>
<Button variant="contained" size="small" onClick={() => handleUpdateReply(reply.id)}>{t('common.save')}</Button>
<Button size="small" onClick={() => setEditingReplyId(null)}>{t('common.cancel')}</Button>
</Box>
</Box>
) : (
@@ -505,13 +505,13 @@ const FlavorDetail: React.FC = () => {
<Box sx={{ mt: 2, display: 'flex', gap: 1 }}>
<TextField
size="small"
placeholder="Write a reply..."
placeholder={t('community.writeReply')}
fullWidth
value={replyInputs[rating.id] || ''}
onChange={(e) => setReplyInputs({ ...replyInputs, [rating.id]: e.target.value })}
sx={{ '& .MuiOutlinedInput-root': { bgcolor: 'background.paper' } }}
/>
<Button variant="contained" size="small" disabled={!replyInputs[rating.id]} onClick={() => handleReplySubmit(rating.id)}>Reply</Button>
<Button variant="contained" size="small" disabled={!replyInputs[rating.id]} onClick={() => handleReplySubmit(rating.id)}>{t('common.reply')}</Button>
</Box>
)}
</CardContent>