Grid Item should have Dynamic Height in SwiftUI

Question

I am making a clone app like Notes in SwiftUI. I want to show the notes in LazyVGrid items to have dynamic heights

Currently I am using a LazyVGrid with flexible columns to show exactly 2 items in a row but I want to have each item should have the height according to its content.

This is my code:

let columns = [GridItem(.flexible()),
               GridItem(.flexible())]
    
   var body: some View {

        ScrollView {
            
            LazyVGrid(columns: columns, content: {
                
                ForEach(notesArray) { note in
                    
                    HStack {
                        
                        VStack(alignment: .leading) {
                            
                            Text(note.title)
                                .font(.poppinsSemiBold(size: 12))
                            
                            Text(note.description)
                                .font(.poppinsRegular(size: 10))
                                .foregroundStyle(.gray)
                        }
                        .padding()
                        
                        Spacer()
                    }
                    .background {
                        RoundedRectangle(cornerRadius: 5)
                            .foregroundStyle(.white)
                    }
                    .frame(minHeight: 50, maxHeight: 300)
                }
            })
            .padding(.horizontal)
        }
   }

And this code is returning this:

What I want here is the item below should start from exactly the same place where the top one ends, neglecting the spaces.

This is what I want: