Banner with Laurels & Expandable Text

import SwiftUI

struct UseBannerWLaurelsExpandableText: View {
    
    var body: some View {
        ScrollView {
            VStack {
                BannerWLaurelsExpandableText(headText: "App of the Day", bodyText: "Compot is a collection of great reusable SwiftUI components and templates designed for faster development of mobile apps. You can use Compot as a reference to various UI components, as a source of design inspiration, or to copy the code and use it in your projects.")
            }
            .padding()
        }
    }
}

#Preview {
    UseBannerWLaurelsExpandableText()
}

struct BannerWLaurelsExpandableText: View {
    
    let headText: String
    let bodyText: String
    @State private var isExpanded: Bool = false
    @State private var showMore: Bool = false
    
    var body: some View {
            VStack {
                bannerHead
                bannerBody
            }
            .frame(maxWidth: .infinity, alignment: .center)
            .background {
                bannerBackground
            }
    }
    
    private var bannerHead: some View {
        HStack {
            Image(systemName: "laurel.leading")
                .foregroundStyle(.yellow)
                .fontWeight(.black)
            Text(headText)
                .font(.system(size: 17, weight: .heavy))
            Image(systemName: "laurel.trailing")
                .foregroundStyle(.yellow)
                .fontWeight(.black)
        }
        .padding(.top)
        .padding(.horizontal)
        .padding(.bottom, 4)
        .foregroundStyle(.secondary)
        .font(.system(size: 34, weight: .semibold))
        .frame(maxWidth: .infinity, alignment: .center)
    }
    
    private var bannerBody: some View {
        ZStack {
            Text(bodyText)
                .multilineTextAlignment(.leading)
                .truncationMode(.tail)
                .baselineOffset(3)
                .monospaced(true)
                .frame(maxWidth: 390)
                .lineLimit(isExpanded ? nil : 3)
                .background {
                    ViewThatFits(in: .vertical) {
                        Text(bodyText)
                            .hidden()
                        Color.clear
                            .onAppear {
                                showMore = true
                            }
                    }
                }
                .overlay(alignment: .bottomTrailing) {
                    if showMore && !isExpanded {
                        Button {
                            isExpanded = true
                        } label: {
                            HStack(alignment: .center, spacing: 0) {
                                Text("more")
                                    .foregroundStyle(.accent)
                                    .fontWeight(.medium)
                            }
                            .frame(width: 60, alignment: .trailing)
                            .background {
                                Rectangle()
                                    .fill(LinearGradient(colors: [Color.clear, Color(UIColor.secondarySystemBackground), Color(UIColor.secondarySystemBackground), Color(UIColor.secondarySystemBackground)], startPoint: .leading, endPoint: .trailing))
                            }
                            .offset(y: -3)
                        }
                    }
                }
        }
        .font(.system(size: 15, weight: .regular))
        .padding(.horizontal, 24)
        .padding(.bottom, 24)
    }
    
    private var bannerBackground: some View {
        RoundedRectangle(cornerRadius: 12.0, style: .continuous)
            .fill(Color(UIColor.secondarySystemBackground))
    }
    
}