From 229aafc8e99edf7731ecbeb79ddb66924de8dba4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rados=C5=82aw=20Gierwia=C5=82o?= <github@radziel.com>
Date: Fri, 5 Dec 2025 22:16:49 +0100
Subject: [PATCH] refactor(recordings): remove manual matching trigger from
 Recording tab

Removed "Run matching" buttons from the Recording tab to prevent manual
triggering. The system now only displays matching status information:
- Shows countdown when registration deadline is approaching
- Shows last run time when matching has been completed
- Shows informational message when matching hasn't run yet

This ensures matching is only triggered automatically by the system
or through the admin interface, maintaining better control over the
matching process.

Changes:
- Removed handleRunMatching function and runningMatching state
- Replaced actionable buttons with informational status displays
- Improved date/time formatting for last run timestamp
- Changed "not run yet" status to positive "will be run soon" message
---
 .../components/recordings/RecordingTab.jsx    | 61 ++++++-------------
 1 file changed, 18 insertions(+), 43 deletions(-)

diff --git a/frontend/src/components/recordings/RecordingTab.jsx b/frontend/src/components/recordings/RecordingTab.jsx
index cca7232..2cfe87f 100644
--- a/frontend/src/components/recordings/RecordingTab.jsx
+++ b/frontend/src/components/recordings/RecordingTab.jsx
@@ -16,7 +16,6 @@ const RecordingTab = ({ slug, event, myHeats }) => {
   const [suggestions, setSuggestions] = useState(null);
   const [recorderOptOut, setRecorderOptOut] = useState(false);
   const [updatingOptOut, setUpdatingOptOut] = useState(false);
-  const [runningMatching, setRunningMatching] = useState(false);
 
   // Load suggestions on mount
   useEffect(() => {
@@ -66,18 +65,6 @@ const RecordingTab = ({ slug, event, myHeats }) => {
     }
   };
 
-  const handleRunMatching = async () => {
-    try {
-      setRunningMatching(true);
-      await matchingAPI.runMatching(slug);
-      await loadSuggestions();
-    } catch (err) {
-      console.error('Failed to run matching:', err);
-    } finally {
-      setRunningMatching(false);
-    }
-  };
-
   // Calculate countdown to matching
   const getCountdown = () => {
     if (!event?.registrationDeadline) return null;
@@ -149,41 +136,29 @@ const RecordingTab = ({ slug, event, myHeats }) => {
         </div>
       ) : matchingRunAt ? (
         <div className="bg-green-50 border border-green-200 rounded-lg p-4">
-          <div className="flex items-center justify-between">
-            <div className="flex items-center gap-3">
-              <CheckCircle className="w-5 h-5 text-green-600" />
-              <div>
-                <p className="font-medium text-green-800">Matching completed</p>
-                <p className="text-sm text-green-600">
-                  Last run: {new Date(matchingRunAt).toLocaleString('en-US')}
-                </p>
-              </div>
+          <div className="flex items-center gap-3">
+            <CheckCircle className="w-5 h-5 text-green-600" />
+            <div>
+              <p className="font-medium text-green-800">Matching completed</p>
+              <p className="text-sm text-green-600">
+                Last run: {new Date(matchingRunAt).toLocaleString('en-US', {
+                  dateStyle: 'medium',
+                  timeStyle: 'short'
+                })}
+              </p>
             </div>
-            <button
-              onClick={handleRunMatching}
-              disabled={runningMatching}
-              className="flex items-center gap-2 px-3 py-1.5 text-sm bg-green-600 text-white rounded-md hover:bg-green-700 disabled:opacity-50"
-            >
-              <RefreshCw className={`w-4 h-4 ${runningMatching ? 'animate-spin' : ''}`} />
-              {runningMatching ? 'Running...' : 'Run again'}
-            </button>
           </div>
         </div>
       ) : (
-        <div className="bg-gray-50 border border-gray-200 rounded-lg p-4">
-          <div className="flex items-center justify-between">
-            <div className="flex items-center gap-3">
-              <AlertTriangle className="w-5 h-5 text-gray-500" />
-              <p className="text-gray-600">Matching has not been run yet</p>
+        <div className="bg-blue-50 border border-blue-200 rounded-lg p-4">
+          <div className="flex items-center gap-3">
+            <Clock className="w-5 h-5 text-blue-600" />
+            <div>
+              <p className="font-medium text-blue-800">Matching will be run soon</p>
+              <p className="text-sm text-blue-600">
+                The system will automatically pair recording partners when ready.
+              </p>
             </div>
-            <button
-              onClick={handleRunMatching}
-              disabled={runningMatching}
-              className="flex items-center gap-2 px-3 py-1.5 text-sm bg-primary-600 text-white rounded-md hover:bg-primary-700 disabled:opacity-50"
-            >
-              <RefreshCw className={`w-4 h-4 ${runningMatching ? 'animate-spin' : ''}`} />
-              {runningMatching ? 'Running...' : 'Run matching'}
-            </button>
           </div>
         </div>
       )}