Added h2h communication.

frontend/src/components/bets/MyOtherBets.tsx

@@ -5,7 +5,7 @@ import { useAuthStore } from '@/store'
 import { spreadBetsApi } from '@/api/spread-bets'
 import type { SpreadBetDetail } from '@/types/spread-bet'
 import { SpreadBetStatus } from '@/types/spread-bet'
-import { ExternalLink, Trophy, XCircle } from 'lucide-react'
+import { ExternalLink, Trophy, XCircle, MessageCircle } from 'lucide-react'
 
 interface MyOtherBetsProps {
   currentEventId?: number
@@ -125,6 +125,17 @@ export const MyOtherBets = ({ currentEventId }: MyOtherBetsProps) => {
             <span className="text-gray-400">-</span>
           )}
         </td>
+        <td className="px-4 py-3 text-sm text-center">
+          {(bet.status === SpreadBetStatus.MATCHED || bet.status === SpreadBetStatus.COMPLETED) && (
+            <Link
+              to={`/matches/${bet.id}`}
+              className="inline-flex items-center gap-1 text-blue-600 hover:text-blue-700 text-xs font-medium"
+            >
+              <MessageCircle size={14} />
+              Chat
+            </Link>
+          )}
+        </td>
       </tr>
     )
   }
@@ -202,6 +213,7 @@ export const MyOtherBets = ({ currentEventId }: MyOtherBetsProps) => {
                 <th className="px-4 py-3 text-right">Stake</th>
                 <th className="px-4 py-3 text-center">Status</th>
                 <th className="px-4 py-3 text-right">Result</th>
+                <th className="px-4 py-3 text-center"></th>
               </tr>
             </thead>
             <tbody className="divide-y divide-gray-100">