mirror of
https://github.com/Dvorinka/MyClubServer.git
synced 2026-06-03 18:22:57 +00:00
Tomáš Dvořák
175 lines
3.9 KiB
Markdown
175 lines
3.9 KiB
Markdown
# Article System - Quick Fix Guide
|
|
|
|
## 🔴 Critical Issues - FIXED
|
|
|
|
### Error: "Minified React error #310"
|
|
**Status**: ✅ FIXED
|
|
**What was broken**: App crashed after publishing articles
|
|
**What we fixed**: Fixed infinite render loops in React hooks
|
|
**Testing**: Publish an article and verify admin page still works
|
|
|
|
### Error: "Album nenalezeno" despite API returning data
|
|
**Status**: ✅ FIXED
|
|
**What was broken**: Zonerama albums wouldn't load even with valid data
|
|
**What we fixed**: Added support for both API response formats
|
|
**Testing**: Load album via link in Media tab → should show photos
|
|
|
|
### Error: YouTube "Vybrat z kanálu" button does nothing
|
|
**Status**: ✅ FIXED
|
|
**What was broken**: Modal didn't exist, button was non-functional
|
|
**What we fixed**: Created complete YouTube video picker modal
|
|
**Testing**: Click "Vybrat z kanálu" → should open modal with videos
|
|
|
|
---
|
|
|
|
## 🟡 UX Issues - IMPROVED
|
|
|
|
### Image Cropping is Laggy
|
|
**Status**: ✅ OPTIMIZED
|
|
**Improvement**:
|
|
- Added max width control (default 1500px)
|
|
- Added quality control (default 85%)
|
|
- Optimized canvas rendering
|
|
- Better performance on large images
|
|
|
|
### Images in Blog Not Editable
|
|
**Status**: ✅ ENHANCED
|
|
**New Feature**:
|
|
- Click any image in editor to resize
|
|
- Enter width as percentage or pixels
|
|
- Visual hover/selection feedback
|
|
- Images now adjustable after insertion
|
|
|
|
### Media Tab Poor Organization
|
|
**Status**: ✅ REORGANIZED
|
|
**New Order**:
|
|
1. Zonerama photo picker (moved to top)
|
|
2. Cover image upload
|
|
3. YouTube video
|
|
4. OG image for sharing
|
|
5. Poll linker
|
|
|
|
---
|
|
|
|
## 📝 Quick Tasks
|
|
|
|
### How to Add Article with All Features
|
|
|
|
```
|
|
1. Open "Nový článek"
|
|
2. Tab: AI (optional)
|
|
- Enter your text
|
|
- Click "Rozvinout text"
|
|
|
|
3. Tab: Základní
|
|
- Enter title
|
|
- Select category (REQUIRED)
|
|
- Select match (optional)
|
|
- Toggle "Primární" if featured
|
|
|
|
4. Tab: Obsah
|
|
- Write/edit article
|
|
- Click images to resize
|
|
- Use "Vložit fotografie z alba"
|
|
|
|
5. Tab: Média
|
|
- Pick from Zonerama (now first!)
|
|
- OR upload cover image
|
|
- Add YouTube video if needed
|
|
|
|
6. Tab: SEO
|
|
- Auto-generated (optional edit)
|
|
|
|
7. Click "Uložit"
|
|
```
|
|
|
|
### Troubleshooting
|
|
|
|
#### Article won't save
|
|
- ✅ Check if category is selected (required)
|
|
- ✅ Check browser console for errors
|
|
- ✅ Verify API is running
|
|
|
|
#### Match info not showing
|
|
- ✅ Category must be selected first
|
|
- ✅ Wait for match list to load
|
|
- ✅ Check FACR cache is populated
|
|
|
|
#### YouTube videos not loading
|
|
- ✅ Check YouTube channel ID in settings
|
|
- ✅ Click "Obnovit seznam" to refresh
|
|
- ✅ Use manual input as fallback
|
|
|
|
#### Zonerama cache empty
|
|
- ✅ Set Zonerama URL in settings
|
|
- ✅ Wait for prefetch to complete
|
|
- ✅ Use "Album odkaz" as alternative
|
|
|
|
---
|
|
|
|
## 🚀 New Features
|
|
|
|
### 1. YouTube Video Picker
|
|
- Full modal with search
|
|
- Thumbnail previews
|
|
- Click to select
|
|
- Manual URL/ID input
|
|
|
|
### 2. Image Resize in Editor
|
|
- Click image → enter width
|
|
- Formats: "50%", "300px", "auto"
|
|
- Instant preview
|
|
|
|
### 3. Advanced Image Cropping
|
|
- Max width control
|
|
- Quality slider
|
|
- Performance optimized
|
|
|
|
### 4. Better Match Linking
|
|
- Category-based filtering
|
|
- Search and date filters
|
|
- Visual selection
|
|
- Confirmation messages
|
|
|
|
---
|
|
|
|
## 🛠️ Developer Notes
|
|
|
|
### Files Changed
|
|
- `frontend/src/pages/ArticleDetailPage.tsx`
|
|
- `frontend/src/pages/admin/ArticlesAdminPage.tsx`
|
|
|
|
### Key Changes
|
|
1. React hooks stabilized
|
|
2. Query invalidation improved
|
|
3. API response parsing enhanced
|
|
4. UI/UX flow optimized
|
|
|
|
### Testing Commands
|
|
```bash
|
|
# Frontend
|
|
cd frontend
|
|
npm start
|
|
|
|
# Check for React errors in console
|
|
# Test article creation workflow
|
|
# Verify all modals open
|
|
# Test image operations
|
|
```
|
|
|
|
---
|
|
|
|
## 📞 Support
|
|
|
|
If issues persist:
|
|
1. Clear browser cache
|
|
2. Check browser console for errors
|
|
3. Verify API is running
|
|
4. Check network tab for failed requests
|
|
5. Review error logs in backend
|
|
|
|
---
|
|
|
|
**Last Updated**: 2025-01-12
|
|
**Version**: 2.1.0
|