Hide long excerpts under the cut

Author: kean

Modules/Sources/WordPressReader/Detail/ReaderPostHeaderView.swift

@@ -1,5 +1,6 @@
 import UIKit
 import AsyncImageKit
+import DesignSystem
 import WordPressShared
 import WordPressUI
 
@@ -145,6 +146,7 @@ public final class ReaderPostHeaderView: UIView {
         let label = UILabel()
         label.numberOfLines = 0
         label.adjustsFontForContentSizeCategory = true
+        label.isUserInteractionEnabled = true
         label.isHidden = true
         return label
     }()
@@ -236,6 +238,9 @@ public final class ReaderPostHeaderView: UIView {
     private var featuredImageAspectConstraint: NSLayoutConstraint?
     private var avatarSizeConstraints: [NSLayoutConstraint] = []
     private var displaySettings: ReaderDisplaySettings = .standard
+    private var fullExcerptText: String?
+    private var isExcerptExpanded = false
+    private var lastExcerptLayoutWidth: CGFloat = 0
 
     public var isShowingSubscribeLoadingIndicator: Bool = false {
         didSet {
@@ -331,6 +336,9 @@ public final class ReaderPostHeaderView: UIView {
         separator.backgroundColor = colors.border
 
         subscribeLoadingIndicator.color = colors.secondaryForeground
+
+        lastExcerptLayoutWidth = 0
+        updateExcerptTruncation()
     }
 
     // MARK: - Private
@@ -360,6 +368,8 @@ public final class ReaderPostHeaderView: UIView {
         authorRow.isUserInteractionEnabled = true
         authorRow.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(authorTapped)))
 
+        excerptLabel.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(excerptTapped)))
+
         featuredImageView.isUserInteractionEnabled = true
         featuredImageView.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(featuredImageTapped)))
 
@@ -368,6 +378,16 @@ public final class ReaderPostHeaderView: UIView {
         apply(.standard)
     }
 
+    public override func layoutSubviews() {
+        super.layoutSubviews()
+
+        let width = mainStack.bounds.width
+        if width > 0 && width != lastExcerptLayoutWidth {
+            lastExcerptLayoutWidth = width
+            updateExcerptTruncation()
+        }
+    }
+
     // Extends tap area of the controls.
     public override func hitTest(_ point: CGPoint, with event: UIEvent?) -> UIView? {
         let expandedViews: [UIView] = [buttonSubscribe, siteNameLabel, authorRow, featuredImageView, buttonViewOriginal]
@@ -392,6 +412,14 @@ public final class ReaderPostHeaderView: UIView {
         delegate?.readerPostHeaderView(self, didTap: .author)
     }
 
+    @objc private func excerptTapped() {
+        guard !isExcerptExpanded, let text = fullExcerptText else { return }
+        isExcerptExpanded = true
+        let font = displaySettings.font(with: .callout)
+        let textColor = displaySettings.color.secondaryForeground
+        excerptLabel.attributedText = NSAttributedString(string: text, attributes: [.font: font, .foregroundColor: textColor])
+    }
+
     @objc private func featuredImageTapped() {
         delegate?.readerPostHeaderView(self, didTap: .featuredImage)
     }
@@ -445,13 +473,73 @@ public final class ReaderPostHeaderView: UIView {
 
     private func configureExcerpt(with excerpt: String?) {
         if let excerpt, !excerpt.isEmpty {
-            excerptLabel.text = excerpt
+            fullExcerptText = excerpt
             excerptLabel.isHidden = false
+            lastExcerptLayoutWidth = 0
+            updateExcerptTruncation()
         } else {
+            fullExcerptText = nil
             excerptLabel.isHidden = true
         }
     }
 
+    private func updateExcerptTruncation() {
+        guard let text = fullExcerptText, !text.isEmpty, !isExcerptExpanded else { return }
+
+        let font = displaySettings.font(with: .callout)
+        let textColor = displaySettings.color.secondaryForeground
+        let atttributes: [NSAttributedString.Key: Any] = [.font: font, .foregroundColor: textColor]
+        let availableWidth = mainStack.bounds.width
+
+        guard availableWidth > 0 else {
+            excerptLabel.attributedText = NSAttributedString(string: text, attributes: atttributes)
+            return
+        }
+
+        let maxHeight = font.lineHeight * CGFloat(Constants.excerptMaxLines) + 1
+
+        func isEnoughSpace(for string: String, maxHeight: CGFloat) -> Bool {
+            let height = (string as NSString).boundingRect(
+                with: CGSize(width: availableWidth, height: .greatestFiniteMagnitude),
+                options: [.usesLineFragmentOrigin, .usesFontLeading],
+                attributes: atttributes,
+                context: nil
+            ).height
+            return height <= maxHeight
+        }
+
+        // Hide under the cut only if there is enough text to warrant it. If there is only one extra
+        // line, there is no reason to cut it.
+        if isEnoughSpace(for: text, maxHeight: maxHeight + font.leading * 1) {
+            excerptLabel.attributedText = NSAttributedString(string: text, attributes: atttributes)
+            return
+        }
+
+        let suffix = " " + Strings.viewMore
+
+        // Find the longest prefix that fits with the suffix.
+        var low = 0, high = text.count, bestCut = 0
+        while low <= high {
+            let mid = (low + high) / 2
+            if isEnoughSpace(for: String(text.prefix(mid)) + suffix, maxHeight: maxHeight) {
+                bestCut = mid
+                low = mid + 1
+            } else {
+                high = mid - 1
+            }
+        }
+
+        let trimmed = String(text.prefix(bestCut)).trimmingCharacters(in: .whitespacesAndNewlines)
+        let result = NSMutableAttributedString(string: trimmed, attributes: atttributes)
+        result.append(
+            NSAttributedString(string: suffix, attributes: [
+                .font: font.withWeight(.regular),
+                .foregroundColor: UIColor.label,
+            ])
+        )
+        excerptLabel.attributedText = result
+    }
+
     private func configureReadingTime(with readingTime: String) {
         readingTimeLabel.text = readingTime
     }
@@ -464,6 +552,7 @@ private extension ReaderPostHeaderView {
         static let padding: CGFloat = 16
         static let avatarSize: CGFloat = 32
         static let avatarSizeRegular: CGFloat = 40
+        static let excerptMaxLines: Int = 5
         static let defaultFeaturedImageAspectRatio: CGFloat = 9.0 / 16.0
         static let maxFeaturedImageAspectRatio: CGFloat = 2.0
     }
@@ -480,6 +569,11 @@ private enum Strings {
         value: "View Original",
         comment: "Button in the reader post header to view the original post in a browser"
     )
+    static let viewMore = AppLocalizedString(
+        "reader.post.header.viewMore",
+        value: "\u{2026}view more",
+        comment: "Appended to the truncated excerpt in the reader post header to indicate more content is available"
+    )
 }
 
 // MARK: - Preview