From 8ad834d778001b86eed8e420e6b24d58295bc3f5 Mon Sep 17 00:00:00 2001
From: Mike Johnston <mike@nervesocket.com>
Date: Fri, 30 Jan 2026 17:28:06 -0500
Subject: [PATCH] cleanup friend invite buttons

---
 frontend/src/pages/ChallengeDetail.jsx | 10 +++++++---
 frontend/src/pages/Friends.jsx         |  7 -------
 2 files changed, 7 insertions(+), 10 deletions(-)

diff --git a/frontend/src/pages/ChallengeDetail.jsx b/frontend/src/pages/ChallengeDetail.jsx
index 2034b5d..b824bc5 100644
--- a/frontend/src/pages/ChallengeDetail.jsx
+++ b/frontend/src/pages/ChallengeDetail.jsx
@@ -306,12 +306,13 @@ export default function ChallengeDetail() {
                         display: 'flex',
                         justifyContent: 'space-between',
                         alignItems: 'center',
+                        gap: '1rem',
                         padding: '0.75rem',
                         border: '1px solid var(--border)',
                         borderRadius: '0.5rem'
                       }}
                     >
-                      <div>
+                      <div style={{ flex: 1, minWidth: 0 }}>
                         <div style={{ fontWeight: 500 }}>{friend.username}</div>
                         <div style={{ fontSize: '0.875rem', color: 'var(--text-muted)' }}>{friend.email}</div>
                       </div>
@@ -319,6 +320,7 @@ export default function ChallengeDetail() {
                         className="btn btn-primary btn-sm"
                         onClick={() => handleInvite(friend.id, friend.username)}
                         disabled={inviting === friend.id}
+                        style={{ flexShrink: 0 }}
                       >
                         {inviting === friend.id ? 'Inviting...' : 'Invite'}
                       </button>
@@ -362,10 +364,11 @@ export default function ChallengeDetail() {
                       borderBottom: '1px solid var(--border)',
                       display: 'flex',
                       justifyContent: 'space-between',
-                      alignItems: 'center'
+                      alignItems: 'center',
+                      gap: '1rem'
                     }}
                   >
-                    <div>
+                    <div style={{ flex: 1, minWidth: 0 }}>
                       <div style={{ fontWeight: 500 }}>{user.username}</div>
                       <div style={{ fontSize: '0.875rem', color: 'var(--text-muted)' }}>{user.email}</div>
                     </div>
@@ -373,6 +376,7 @@ export default function ChallengeDetail() {
                       className="btn btn-primary btn-sm"
                       onClick={() => handleInvite(user.id, user.username)}
                       disabled={inviting === user.id}
+                      style={{ flexShrink: 0 }}
                     >
                       {inviting === user.id ? 'Inviting...' : 'Invite'}
                     </button>
diff --git a/frontend/src/pages/Friends.jsx b/frontend/src/pages/Friends.jsx
index 4f29aae..088e79e 100644
--- a/frontend/src/pages/Friends.jsx
+++ b/frontend/src/pages/Friends.jsx
@@ -285,13 +285,6 @@ export default function Friends() {
                         >
                           {sending === friend.id ? 'Sending...' : 'Add Friend'}
                         </button>
-                        <button
-                          className="btn btn-danger btn-sm"
-                          onClick={() => handleRemoveFriend(friend.id, friend.username)}
-                          disabled={removing === friend.id}
-                        >
-                          {removing === friend.id ? 'Removing...' : 'Remove'}
-                        </button>
                       </div>
                     </div>
                   ))}