Concatenate some strings, each one should be clickable separately

Here is the piece of code, half is commented. In the first part, text elements from array are in VStack and each one appears in a new line. But on clicking, it gives details about the clicked array element. But in 2nd part, text is concatenated and visible in the paragraph. But on click it is unable to show the details for the clicked element. I just need the paragraphic representation of the text and each element clickable.

Here is the code

import SwiftUI

struct ContentView: View {
    let dummyStrings = [
        "1Lorem ipsum dolor sit amet",
        "2consectetur adipiscing elit",
        "3sed do eiusmod tempor incididunt",
        "4ut labore et dolore magna aliqua",
        "5Ut enim ad minim veniam",
        "6quis nostrud exercitation ullamco",
        "7laboris nisi ut aliquip ex ea commodo consequat",
        "8Duis aute irure dolor in reprehenderit",
        "9in voluptate velit esse cillum dolore",
        "10 eu fugiat nulla pariatur"
    ]
    
    var body: some View {
        let concatenatedText = dummyStrings.joined(separator: " ")
        
        return ScrollView {
            Text(concatenatedText)
                .font(.body)
                .foregroundColor(.blue)
                .lineSpacing(5)
                .onTapGesture {
                    // Handle tap gesture here (e.g., print tapped portion)
                    print("Text tapped")
                }
                .padding()
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

One way is to join all the strings into a AttributedString, where each string has a link associated with it. The link would be a URL with whatever information you want encoded in it. Then, you can intercept the openURL action and run whatever code you want.

For example, if you want to encode the string itself as the path of the URL

func encodeIntoAttributedString(_ str: String) -> AttributedString {
    var attrStr = AttributedString(str)
    attrStr.link = URL(filePath: str)
    return attrStr
}

Use something like this to join everything together:

extension Array where Element == AttributedString {
    func joined(separator: AttributedString = "") -> AttributedString {
        guard let first else { return "" }
        var result = first
        for elem in self[1...] {
            result += separator
            result += elem
        }
        return result
    }
}

Usage:

let text = [
    "1Lorem ipsum dolor sit amet",
    "2consectetur adipiscing elit",
    "3sed do eiusmod tempor incididunt",
    "4ut labore et dolore magna aliqua",
    "5Ut enim ad minim veniam",
    "6quis nostrud exercitation ullamco",
    "7laboris nisi ut aliquip ex ea commodo consequat",
    "8Duis aute irure dolor in reprehenderit",
    "9in voluptate velit esse cillum dolore",
    "10 eu fugiat nulla pariatur"
].map(encodeIntoAttributedString).joined(separator: " ")

var body: some View {
    ScrollView {
        Text(text)
            // these modifiers could also be replaced by adding the corresponding attributes in encodeIntoAttributedString
            .font(.body)
            .foregroundColor(.blue)
            .lineSpacing(5)
            .padding()
            .environment(\.openURL, OpenURLAction { x in
                // here I am printing the string itself, which is encoded in the path
                print(x.path(percentEncoded: false))
                return .handled
            })
    }
}