TDvorak/MyClub
1
0
Fork 0
mirror of https://github.com/Dvorinka/MyClubServer.git synced 2026-06-04 18:52:56 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

dev day #62

Browse Source
This commit is contained in:
Tomáš Dvořák
2025-10-16 17:10:13 +02:00
parent f5e7be92c7
commit 35d0954afd
84 changed files with 9571 additions and 4668 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/pages/MatchesPage.tsx
+9 -43
View File
@@ -4,7 +4,7 @@ import MainLayout from '../components/layout/MainLayout';
import { getPublicSettings } from '../services/settings';
import { getCompetitionAliasesPublic, CompetitionAlias } from '../services/competitionAliases';
import { sortCategoriesWithOrder } from '../utils/categorySort';
import { assetUrl } from '../utils/url';
import { assetUrl, sanitizeClubName } from '../utils/url';
import MatchModal from '../components/home/MatchModal';
import { useCountdown, useMultipleCountdowns } from '../hooks/useCountdown';
import '../styles/theme.css';
@@ -54,11 +54,13 @@ const MatchesPage: React.FC = () => {
}
};
// Helper function to truncate long club names
// Helper function to sanitize and truncate long club names
const truncateClubName = (name: string, maxLength: number = 35) => {
if (!name) return name;
if (name.length <= maxLength) return name;
return name.substring(0, maxLength).trim() + '…';
// First sanitize the club name
const sanitized = sanitizeClubName(name);
if (sanitized.length <= maxLength) return sanitized;
return sanitized.substring(0, maxLength).trim() + '…';
};
// Format date to Czech format
@@ -457,13 +459,7 @@ const MatchesPage: React.FC = () => {
}}
>
<div style={{ fontSize: '0.85rem', color: textSecondary, marginBottom: 16, display: 'flex', justifyContent: 'space-between', alignItems: 'center', fontWeight: 600 }}>
<span style={{ display: 'flex', alignItems: 'center', gap: 6 }}>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
<rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect>
<line x1="16" y1="2" x2="16" y2="6"></line>
<line x1="8" y1="2" x2="8" y2="6"></line>
<line x1="3" y1="10" x2="21" y2="10"></line>
</svg>
<span>
{formatCzechDate(m.date, m.time || '00:00')}
</span>
<span style={{ background: 'var(--chakra-colors-brand-primary, #3b82f6)', color: 'white', padding: '4px 10px', borderRadius: 8, fontSize: '0.8rem', fontWeight: 700 }}>{m.time}</span>
@@ -529,11 +525,7 @@ const MatchesPage: React.FC = () => {
</div>
</div>
{m.venue && (
<div style={{ fontSize: '0.85rem', color: textSecondary, marginTop: 12, textAlign: 'center', display: 'flex', alignItems: 'center', justifyContent: 'center', gap: 6 }}>
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
<path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"></path>
<circle cx="12" cy="10" r="3"></circle>
</svg>
<div style={{ fontSize: '0.85rem', color: textSecondary, marginTop: 12, textAlign: 'center' }}>
{m.venue}
</div>
)}
@@ -565,38 +557,12 @@ const MatchesPage: React.FC = () => {
fontWeight: 700,
textTransform: 'uppercase',
letterSpacing: '0.5px',
boxShadow: `0 2px 8px ${color.shadow}`,
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
gap: 6
boxShadow: `0 2px 8px ${color.shadow}`
}}>
{sentiment.label === 'Výhra' && '🏆'}
{sentiment.label === 'Remíza' && '⚖️'}
{sentiment.label === 'Prohra' && '😔'}
{sentiment.label}
</div>
);
}
if (hasScore && isPast) {
return (
<div style={{
fontSize: '0.75rem',
background: 'linear-gradient(135deg, #10b981 0%, #059669 100%)',
color: 'white',
marginTop: 12,
padding: '6px 12px',
borderRadius: 8,
textAlign: 'center',
fontWeight: 700,
textTransform: 'uppercase',
letterSpacing: '0.5px',
boxShadow: '0 2px 8px rgba(16, 185, 129, 0.3)'
}}>
✓ Skončeno
</div>
);
}
if (!hasScore && isPast) {
return (
<div style={{