# Blog Match Link Fix ## Problem When creating a new blog article with a match link in the admin panel, the match link was not being saved to the database. The article was created successfully, but the association with the FACR match was lost. ## Root Cause The match linking logic was placed in the React Query mutation's `onSuccess` callback. When the page re-rendered after article creation (especially when invalidating queries), a React error #310 was occurring, which interrupted the `onSuccess` callback before the match linking API call could complete. ## Solution Moved the match linking logic from the mutation's `onSuccess` callback directly into the `onSubmit` function. This ensures the match linking happens synchronously after article creation, before the modal closes and queries are invalidated. ### Changes Made #### 1. Match Linking in `onSubmit` Function **File**: `frontend/src/pages/admin/ArticlesAdminPage.tsx` - For **new articles**: After `createArticle()` completes, immediately call `putArticleMatchLink()` with the new article ID - For **existing articles**: After `updateArticle()` completes, call `putArticleMatchLink()` to update or create the link - All match linking now happens within the same try-catch block as article creation/update - Modal only closes after all operations complete successfully #### 2. Simplified Mutation Callbacks - `createMut.onSuccess`: Only handles query invalidation and state cleanup - `updateMut.onSuccess`: Only handles query invalidation - Removed duplicate match linking code from callbacks - Success toasts moved to `onSubmit` after all operations complete #### 3. Enhanced Error Handling - Added try-catch blocks around match linking API calls - Separate error messages for article creation vs. match linking failures - If article creation succeeds but match linking fails, user gets a warning toast with instructions - All errors logged to console for debugging #### 4. Added Debug Logging - Log match link state before submission - Log article creation success - Log match linking attempts and results - Helps diagnose issues in production #### 5. Fixed `MatchLinkBadge` Loading State - Added loading state check to prevent React errors when refetching - Shows "Načítání..." badge while match link data is loading ## Testing Instructions ### Test 1: Create New Article with Match Link 1. Go to Admin → Články 2. Click "Nový článek" 3. Fill in required fields (Název, Kategorie) 4. Switch to "Základní" tab 5. Select a match from the picker 6. Click "Uložit" 7. **Expected**: Toast shows "Článek vytvořen a propojen se zápasem" 8. **Verify**: Article list shows match badge with match details ### Test 2: Create Article Without Match Link 1. Create article without selecting a match 2. **Expected**: Toast shows "Článek byl úspěšně vytvořen" 3. **Verify**: Article list shows "Nepropojeno" badge ### Test 3: Update Existing Article Match Link 1. Open existing article for editing 2. Select a different match 3. Click "Uložit" 4. **Expected**: Toast shows "Článek aktualizován a propojen se zápasem" 5. **Verify**: Badge updates to show new match ### Test 4: Match Linking Failure (Backend Error) 1. Simulate backend error (e.g., stop backend) 2. Try to create article with match link 3. **Expected**: Toast shows "Článek vytvořen, ale propojení se zápasem selhalo" 4. **Verify**: Article is created but without match link ## API Endpoints Used - `POST /api/v1/articles` - Create article - `PUT /api/v1/articles/:id` - Update article - `POST /api/v1/articles/:id/match-link` - Create/update match link - `GET /api/v1/articles/:id/match-link` - Get match link (for badge display) - `DELETE /api/v1/articles/:id/match-link` - Delete match link ## Database Tables - `articles` - Main article data - `article_match_links` - Junction table linking articles to FACR match IDs ## State Management - `tempMatchLink` - Stores selected match ID for new articles - `matchIdInput` - Stores selected match ID (UI input) - `linkedMatchId` - Stores confirmed linked match ID after successful save ## Future Improvements - Consider adding optimistic updates to show match link immediately - Add bulk match linking for multiple articles - Show match preview in article form before saving - Add match link history/audit log