MyClub/DOCS/BLOG_MATCH_LINK_VERIFICATION.md

Blog Match Link Fix - Verification Checklist

Issue Summary

Problem: When creating a blog article and selecting a match from the "Propojit se zápasem" section, the match ID was not being saved to the database.

User Evidence: Console log showed:

Saving article with payload: {
  "title": "U17: Rýmařov...",
  "category_name": "KALMAN TRADE Krajský přebor mladší dorost",
  // ... other fields ...
  // ❌ NO match_id field in payload
}

Fix Applied

Technical Changes

1. Moved match linking from async callback to synchronous flow

   • Previous: Match linking happened in createMut.onSuccess callback (after article creation)
   • New: Match linking happens in onSubmit function (immediately after article creation completes)
   • Benefit: Prevents race conditions and React error interruptions

2. Added comprehensive error handling

   • Separate try-catch blocks for article save and match linking
   • Clear user feedback for each operation
   • Logging at each step for debugging

3. Fixed React error #310

   • Added loading state to MatchLinkBadge component
   • Prevents rendering errors during query refetch

Verification Steps

1. Check Console Logs

After applying the fix, when creating an article with a match link, you should see:

Match link state before submit: {
  tempMatchLink: "12345",
  matchIdInput: "12345",
  linkedMatchId: "",
  isNewArticle: true
}
Linking new article 42 with match 12345
Match link created for new article

2. Check Toast Messages

• ✅ Success: "Článek vytvořen a propojen se zápasem" (with Match ID)
• ⚠️ Partial Success: "Článek vytvořen, ale propojení se zápasem selhalo"

3. Check Database

Query to verify match link was saved:

SELECT * FROM article_match_links WHERE article_id = [NEW_ARTICLE_ID];

Should return:

• article_id: The ID of the newly created article
• external_match_id: The FACR match ID (e.g., "12345")
• title: The article title

4. Check Article List UI

• Badge should show: "Zápas: [Home Team] [Score] [Away Team]" in green (if match has score) or yellow (if no score yet)
• Should NOT show: "Nepropojeno" in gray

5. Check API Response

The article creation response should include match_link:

{
  "id": 42,
  "title": "U17: Rýmařov...",
  "match_link": {
    "article_id": 42,
    "external_match_id": "12345",
    "title": "U17: Rýmařov..."
  }
}

Test Scenarios

Scenario A: New Article with Match

1. Open Admin → Články → Nový článek
2. Fill in title: "Test článek"
3. Select category: "KALMAN TRADE Krajský přebor mladší dorost"
4. Click on a match in the match picker
5. Click "Uložit"
6. Expected: Green toast with match ID
7. Verify: List shows match badge with team names

Scenario B: New Article without Match

1. Create article without selecting match
2. Expected: Standard success toast
3. Verify: List shows "Nepropojeno" badge

Scenario C: Edit Existing Article, Add Match

1. Open existing article
2. Select a match
3. Click "Uložit"
4. Expected: Success toast with match info
5. Verify: Badge updates immediately

Scenario D: Edit Existing Article, Change Match

1. Open article that already has a match
2. Select different match
3. Click "Uložit"
4. Expected: Success toast
5. Verify: Badge shows new match

Scenario E: Backend Error Handling

1. Stop backend server
2. Try to create article with match
3. Expected: Article created locally, warning toast about match linking failure
4. Restart backend
5. Verify: Can manually link match by editing article

Code Changes Summary

Files Modified

1. /frontend/src/pages/admin/ArticlesAdminPage.tsx
   • Lines 40-43: Added loading state to MatchLinkBadge
   • Lines 655-673: Simplified createMut.onSuccess
   • Lines 686-702: Simplified updateMut.onSuccess
   • Lines 928-987: Refactored onSubmit with inline match linking

Files Created

1. /DOCS/BLOG_MATCH_LINK_FIX.md - Detailed fix documentation
2. /DOCS/BLOG_MATCH_LINK_VERIFICATION.md - This file

Rollback Plan

If issues occur, revert the ArticlesAdminPage.tsx changes:

git checkout HEAD -- frontend/src/pages/admin/ArticlesAdminPage.tsx

Performance Impact

• No performance degradation
• Actually improved: One less async operation in mutation callback
• Better user experience: Immediate feedback on match linking status

Browser Compatibility

• No new browser APIs used
• Compatible with all modern browsers (Chrome, Firefox, Safari, Edge)
• React Query handles all async state management

Known Limitations

• Match linking requires article to be saved first (can't preview match before save)
• If backend is down, match link won't be saved (fails gracefully)
• Maximum 100 matches shown in picker (performance optimization)

Related Documentation

• DOCS/BLOG_CREATION_FIXED.md - Previous blog creation fixes
• DOCS/FACR_INTEGRATION.md - FACR match data integration
• DOCS/ADMIN_QUICK_REFERENCE.md - Admin panel overview