Tappable Areas in a SwiftUI List Row

I have a problem with the tappable area in a SwiftUI list row: it doesn’t cover the entire row.

Here is my code:

Section(header: Text("Latest Transit News").bold(), content: {
	HStack(alignment: .center) {
		Image("Twitter")
			.resizable()
			.renderingMode(.template)
			.frame(width: 18.33, height: 15.14)
			.foregroundColor(Color("TwitterBlue"))
		VStack(alignment: .leading) {
			Text("SBS Transit")
			Text("@SBSTransit_Ltd").font(.caption).foregroundColor(.secondary)
		}
		Spacer()
	}.onTapGesture {
		UIApplication
			.shared
			.open(SupportURL.sbs.url, 
				  options: [UIApplication.OpenExternalURLOptionsKey.universalLinksOnly : false], completionHandler: nil)
}

This produces the expected row:

The only tappable area in the entire row is enclosed in the red box: the Image and Text. My expectation is that the entire HStack should be tappable.

Am I doing something wrong or is there a solution? Please let me know.