From c83edb4bc3fe2fb6c822e3476777131b5365ded5 Mon Sep 17 00:00:00 2001
From: Kateryna Kodonenko <kateryna@automattic.com>
Date: Fri, 10 Jan 2025 12:07:49 -0500
Subject: [PATCH 1/3] Make links open in sync modal

---
 src/components/sync-sites-modal-selector.tsx | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/sync-sites-modal-selector.tsx b/src/components/sync-sites-modal-selector.tsx
index a2398e184..c5b846416 100644
--- a/src/components/sync-sites-modal-selector.tsx
+++ b/src/components/sync-sites-modal-selector.tsx
@@ -206,11 +206,16 @@ function SiteItem( {
 				<div className={ cx( 'a8c-body truncate', ! isSyncable && 'text-a8c-gray-30' ) }>
 					{ site.name }
 				</div>
-				<div
-					className={ cx( 'a8c-body-small text-a8c-gray-30 truncate', isSelected && 'text-white' ) }
+				<Button
+					variant="link"
+					className={ cx(
+						'a8c-body-small !text-a8c-gray-30 truncate !p-0',
+						isSelected && '!text-white'
+					) }
+					onClick={ () => getIpcApi().openURL( site.url ) }
 				>
 					{ site.url.replace( /^https?:\/\//, '' ) }
-				</div>
+				</Button>
 			</div>
 			{ isSyncable && (
 				<div className="flex gap-2">

From fd4ee5ae7dbe0eae3232175148abab9ddad21b30 Mon Sep 17 00:00:00 2001
From: Kateryna Kodonenko <kateryna@automattic.com>
Date: Fri, 10 Jan 2025 14:19:35 -0500
Subject: [PATCH 2/3] Fix selected state

---
 src/components/sync-sites-modal-selector.tsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/sync-sites-modal-selector.tsx b/src/components/sync-sites-modal-selector.tsx
index c5b846416..6d7ad602b 100644
--- a/src/components/sync-sites-modal-selector.tsx
+++ b/src/components/sync-sites-modal-selector.tsx
@@ -209,8 +209,10 @@ function SiteItem( {
 				<Button
 					variant="link"
 					className={ cx(
-						'a8c-body-small !text-a8c-gray-30 truncate !p-0',
-						isSelected && '!text-white'
+						'a8c-body-small truncate !p-0',
+						isSelected
+							? '!text-inherit hover:!text-inherit'
+							: '!text-a8c-gray-30 hover:!text-a8c-gray-30'
 					) }
 					onClick={ () => getIpcApi().openURL( site.url ) }
 				>

From 4ab21ae6622616800509b74fd89348c0aefcfcde Mon Sep 17 00:00:00 2001
From: Kateryna Kodonenko <kateryna@automattic.com>
Date: Wed, 15 Jan 2025 14:11:02 +0100
Subject: [PATCH 3/3] Add arrow icon

---
 src/components/sync-sites-modal-selector.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/src/components/sync-sites-modal-selector.tsx b/src/components/sync-sites-modal-selector.tsx
index 6d7ad602b..af88eaa25 100644
--- a/src/components/sync-sites-modal-selector.tsx
+++ b/src/components/sync-sites-modal-selector.tsx
@@ -5,6 +5,7 @@ import { useState, useEffect } from 'react';
 import { useOffline } from '../hooks/use-offline';
 import { cx } from '../lib/cx';
 import { getIpcApi } from '../lib/get-ipc-api';
+import { ArrowIcon } from './arrow-icon';
 import { Badge } from './badge';
 import Button from './button';
 import { CreateButton } from './connect-create-buttons';
@@ -217,6 +218,7 @@ function SiteItem( {
 					onClick={ () => getIpcApi().openURL( site.url ) }
 				>
 					{ site.url.replace( /^https?:\/\//, '' ) }
+					<ArrowIcon />
 				</Button>
 			</div>
 			{ isSyncable && (