From 653945a5e883b5a287ce74867c8d251524c6258d Mon Sep 17 00:00:00 2001
From: Avi <avi@aiolabs.com>
Date: Sun, 23 Aug 2026 15:34:24 -0500
Subject: [PATCH] Select a profile by clicking anywhere on its card

---
 frontend/src/screens/ProfilesScreen.tsx   |  8 +++++++
 frontend/src/styles.css                   |  8 +++++++
 frontend/src/test/ProfilesScreen.test.tsx | 28 +++++++++++++++++++++++
 3 files changed, 44 insertions(+)

diff --git a/frontend/src/screens/ProfilesScreen.tsx b/frontend/src/screens/ProfilesScreen.tsx
index 813c58e..c75902b 100644
--- a/frontend/src/screens/ProfilesScreen.tsx
+++ b/frontend/src/screens/ProfilesScreen.tsx
@@ -132,6 +132,14 @@ export function ProfilesScreen({ onCreateProfile }: ProfilesScreenProps) {
             <article
               key={profile.npub}
               className={`profile-card${profile.is_active ? ' is-active' : ''}`}
+              onClick={
+                profile.is_active
+                  ? undefined
+                  : (event) => {
+                      if ((event.target as HTMLElement).closest('button, a, input')) return;
+                      void onSelect(profile.npub);
+                    }
+              }
             >
               <div className="profile-card-top">
                 <Avatar
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index beb19db..877d8ed 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -1048,6 +1048,14 @@ select {
   border-color: var(--success);
 }
 
+.profile-card:not(.is-active) {
+  cursor: pointer;
+}
+
+.profile-card:not(.is-active):hover {
+  border-color: var(--primary);
+}
+
 .profile-card-top {
   display: flex;
   align-items: center;
diff --git a/frontend/src/test/ProfilesScreen.test.tsx b/frontend/src/test/ProfilesScreen.test.tsx
index 49cf60d..0b9cdc6 100644
--- a/frontend/src/test/ProfilesScreen.test.tsx
+++ b/frontend/src/test/ProfilesScreen.test.tsx
@@ -37,6 +37,34 @@ describe('ProfilesScreen', () => {
     });
   });
 
+  it('selects a profile when its card is clicked', async () => {
+    const backend = createFakeBackend();
+    installFakeBackend(backend);
+    const user = userEvent.setup();
+    renderWithApp(<ProfilesScreen onCreateProfile={vi.fn()} />);
+
+    await screen.findByText('Bob');
+    await user.click(screen.getByText('Bob'));
+
+    await waitFor(() => {
+      expect(backend.state.active_profile?.npub).toBe(BOB);
+    });
+  });
+
+  it('does not select a profile when an action button inside the card is clicked', async () => {
+    const backend = createFakeBackend();
+    installFakeBackend(backend);
+    const user = userEvent.setup();
+    renderWithApp(<ProfilesScreen onCreateProfile={vi.fn()} />);
+
+    await screen.findByText('Bob');
+    const copyButtons = screen.getAllByRole('button', { name: 'Copy public key' });
+    await user.click(copyButtons[copyButtons.length - 1]);
+
+    expect(backend.copied).toContain(BOB);
+    expect(backend.state.active_profile?.npub).toBe(ALICE);
+  });
+
   it('disables Select for the active profile and copies public keys', async () => {
     const backend = createFakeBackend();
     installFakeBackend(backend);