Merge pull request #4788 from wikimedia/image-recs/add-image-details

Image recommendations - go to Add Image Details
wikimedia · Mar 26, 2024 · 8177927 · 8177927
2 parents 63ed88f + 6dca528
commit 8177927
Show file tree

Hide file tree

Showing 77 changed files with 276 additions and 83 deletions.
diff --git a/...ggested Edits/Image Recommendations/WKImageRecommendationsBottomSheetViewController.swift b/...ggested Edits/Image Recommendations/WKImageRecommendationsBottomSheetViewController.swift
@@ -6,11 +6,13 @@ final public class WKImageRecommendationsBottomSheetViewController: WKCanvasView
     // MARK: Properties
 
     public var viewModel: WKImageRecommendationsViewModel
+    weak var delegate: WKImageRecommendationsDelegate?
 
     // MARK: Lifecycle
 
-    public init(viewModel: WKImageRecommendationsViewModel) {
+    public init(viewModel: WKImageRecommendationsViewModel, delegate: WKImageRecommendationsDelegate) {
         self.viewModel = viewModel
+        self.delegate = delegate
         super.init()
     }
 
@@ -56,7 +58,11 @@ extension WKImageRecommendationsBottomSheetViewController: WKImageRecommendation
     }
 
     func didTapYesButton() {
-
+        if let imageData = viewModel.currentRecommendation?.imageData {
+            self.dismiss(animated: true) {
+                self.delegate?.imageRecommendationsUserDidTapInsertImage(with: imageData)
+            }
+        }
     }
 
     func didTapNoButton() {

diff --git a/...mponents/Suggested Edits/Image Recommendations/WKImageRecommendationsViewController.swift b/...mponents/Suggested Edits/Image Recommendations/WKImageRecommendationsViewController.swift
@@ -5,6 +5,7 @@ import Combine
 
 public protocol WKImageRecommendationsDelegate: AnyObject {
     func imageRecommendationsUserDidTapViewArticle(project: WKProject, title: String)
+    func imageRecommendationsUserDidTapInsertImage(with imageData: WKImageRecommendationData)
 }
 
 fileprivate final class WKImageRecommendationsHostingViewController: WKComponentHostingController<WKImageRecommendationsView> {
@@ -43,7 +44,7 @@ public final class WKImageRecommendationsViewController: WKCanvasViewController
         self.hostingViewController = WKImageRecommendationsHostingViewController(viewModel: viewModel, delegate: delegate)
         self.delegate = delegate
         self.viewModel = viewModel
-        self.imageRecommendationBottomSheetController = WKImageRecommendationsBottomSheetViewController(viewModel: viewModel)
+        self.imageRecommendationBottomSheetController = WKImageRecommendationsBottomSheetViewController(viewModel: viewModel, delegate: delegate)
         super.init()
     }
 

diff --git a/...ts/Components/Suggested Edits/Image Recommendations/WKImageRecommendationsViewModel.swift b/...ts/Components/Suggested Edits/Image Recommendations/WKImageRecommendationsViewModel.swift
@@ -210,7 +210,8 @@ public final class WKImageRecommendationsViewModel: ObservableObject {
                     filename: firstImage.displayFilename,
                     thumbUrl: metadata.thumbUrl,
                     fullUrl: metadata.fullUrl,
-                    description: metadata.description
+                    description: metadata.description, 
+                    descriptionURL: metadata.descriptionUrl
                 )
                 imageData.append(imageRecommendation)
             }

diff --git a/WKData/Sources/WKData/Models/Image Recommendations/WKImageRecommendation.swift b/WKData/Sources/WKData/Models/Image Recommendations/WKImageRecommendation.swift
@@ -25,7 +25,7 @@ public struct WKImageRecommendation {
     }
 
     public struct ImageMetadata: Codable {
-        let descriptionUrl: String
+        public let descriptionUrl: String
         public let thumbUrl: String
         public let fullUrl: String
         let originalWidth: Int

diff --git a/WKData/Sources/WKData/Models/Image Recommendations/WKImageRecommendationData.swift b/WKData/Sources/WKData/Models/Image Recommendations/WKImageRecommendationData.swift
@@ -7,13 +7,15 @@ public struct WKImageRecommendationData {
     public let thumbUrl: String
     public let fullUrl: String
     public let description: String?
+    public let descriptionURL: String
 
-    public init(pageId: Int, image: String, filename: String, thumbUrl: String, fullUrl: String, description: String?) {
+    public init(pageId: Int, image: String, filename: String, thumbUrl: String, fullUrl: String, description: String?, descriptionURL: String) {
         self.pageId = pageId
         self.image = image
         self.filename = filename
         self.thumbUrl = thumbUrl
         self.fullUrl = fullUrl
         self.description = description
+        self.descriptionURL = descriptionURL
     }
 }
diff --git a/WMF Framework/CommonStrings.swift b/WMF Framework/CommonStrings.swift
@@ -643,6 +643,9 @@ public class CommonStrings: NSObject {
     public static let noButtonTitle = WMFLocalizedString("image-recs-no-title", value: "No", comment: "Button title for discarding an image suggestion")
     public static let yesButtonTitle = WMFLocalizedString("image-recs-yes-title", value: "Yes", comment: "Button title for accepting an image suggestion")
     public static let notSureButtonTitle = WMFLocalizedString("image-recs-not-sure-title", value: "Not sure", comment: "Button title for skipping an image suggestion")
+   public static let learnMoreText = WMFLocalizedString("add-image-learn-more-text", value: "Learn more", comment: "Text for button on add image details for going to links with more information on topics related to images on Wikipedia")
+
+
 }
 // Language variant strings
 public extension CommonStrings {

diff --git a/Wikipedia/Code/ExploreViewController.swift b/Wikipedia/Code/ExploreViewController.swift
@@ -1121,6 +1121,16 @@ extension ExploreViewController: WKImageRecommendationsDelegate {
 
         navigationController?.pushViewController(articleViewController, animated: true)
     }
-
-
+
+    func imageRecommendationsUserDidTapInsertImage(with imageData: WKData.WKImageRecommendationData) {
+
+        let image = UIImage() // TODO: fetch image properly
+        if let imageURL = URL(string: imageData.descriptionURL),
+           let thumbURL = URL(string: imageData.thumbUrl) {
+            let searchResult = InsertMediaSearchResult(fileTitle: imageData.filename, displayTitle: imageData.filename, thumbnailURL: thumbURL, imageDescription: imageData.description,  filePageURL: imageURL)
+            let insertMediaViewController = InsertMediaSettingsViewController(image: image, searchResult: searchResult, fromImageRecommendations: true)
+            navigationController?.pushViewController(insertMediaViewController, animated: true)
+        }
+    }
 }
+
diff --git a/Wikipedia/Code/InsertMediaSearchResultsCollectionViewController.swift b/Wikipedia/Code/InsertMediaSearchResultsCollectionViewController.swift
@@ -54,12 +54,16 @@ final class InsertMediaSearchResult {
     let fileTitle: String
     let displayTitle: String
     let thumbnailURL: URL
+    var filePageURL: URL?
+    var imageDescription: String?
     var imageInfo: MWKImageInfo?
 
-    init(fileTitle: String, displayTitle: String, thumbnailURL: URL) {
+    init(fileTitle: String, displayTitle: String, thumbnailURL: URL, imageDescription: String? = nil,  filePageURL: URL? = nil) {
         self.fileTitle = fileTitle
         self.displayTitle = displayTitle
         self.thumbnailURL = thumbnailURL
+        self.imageDescription = imageDescription
+        self.filePageURL = filePageURL
     }
 
     func imageURL(for width: CGFloat) -> URL? {
@@ -69,6 +73,7 @@ final class InsertMediaSearchResult {
         }
         return URL(string: WMFChangeImageSourceURLSizePrefix(thumbnailURL.absoluteString, Int(width))) ?? imageInfo?.canonicalFileURL
     }
+
 }
 
 class InsertMediaSearchResultsCollectionViewController: UICollectionViewController {

diff --git a/Wikipedia/Code/InsertMediaSettingsButtonView.swift b/Wikipedia/Code/InsertMediaSettingsButtonView.swift
@@ -19,7 +19,7 @@ final class InsertMediaSettingsButtonView: UIView {
     }
 
     private func updateFonts() {
-        button.titleLabel?.font = UIFont.wmf_font(.footnote, compatibleWithTraitCollection: traitCollection)
+        button.titleLabel?.font = UIFont.wmf_font(.callout, compatibleWithTraitCollection: traitCollection)
     }
 
     @IBAction private func delegateButtonAction(_ sender: UIButton) {
@@ -30,8 +30,7 @@ final class InsertMediaSettingsButtonView: UIView {
 extension InsertMediaSettingsButtonView: Themeable {
     func apply(theme: Theme) {
         backgroundColor = theme.colors.paperBackground
-        button.setTitleColor(theme.colors.secondaryText, for: .normal)
-        button.tintColor = theme.colors.secondaryText
-        separatorView.backgroundColor = theme.colors.border
+        button.setTitleColor(theme.colors.link, for: .normal)
+        separatorView.backgroundColor = .clear
     }
 }
diff --git a/Wikipedia/Code/InsertMediaSettingsImageView.swift b/Wikipedia/Code/InsertMediaSettingsImageView.swift
@@ -2,25 +2,27 @@ import UIKit
 
 final class InsertMediaSettingsImageView: UIView {
     @IBOutlet private weak var imageView: UIImageView!
-    @IBOutlet private weak var headingLabel: UILabel!
+    @IBOutlet private weak var imageDescriptionLabel: UILabel!
     @IBOutlet private weak var titleButton: AutoLayoutSafeMultiLineButton!
     @IBOutlet private weak var separatorView: UIView!
+    @IBOutlet weak var buttonHeightConstraint: NSLayoutConstraint!
+    @IBOutlet weak var imageHeightConstraint: NSLayoutConstraint!
 
     var image: UIImage? {
         didSet {
             imageView.image = image
         }
     }
 
-    var heading: String? {
+    var imageDescription: String? {
         didSet {
-            headingLabel.text = heading
+            imageDescriptionLabel.text = imageDescription
         }
     }
 
     var title: String? {
         didSet {
-            titleButton.setTitle(title, for: .normal)
+            titleButton.setAttributedTitle(getImageLinkButtonTitle(), for: .normal)
         }
     }
 
@@ -31,6 +33,7 @@ final class InsertMediaSettingsImageView: UIView {
         super.awakeFromNib()
         imageView.accessibilityIgnoresInvertColors = true
         updateFonts()
+        configTitleButton()
     }
 
     override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
@@ -39,13 +42,17 @@ final class InsertMediaSettingsImageView: UIView {
     }
 
     private func updateFonts() {
-        headingLabel.font = UIFont.wmf_font(.subheadline, compatibleWithTraitCollection: traitCollection)
-        titleButton.titleLabel?.font = UIFont.wmf_font(.body, compatibleWithTraitCollection: traitCollection)
+        imageDescriptionLabel.font = UIFont.wmf_font(.footnote, compatibleWithTraitCollection: traitCollection)
+        titleButton.titleLabel?.font = UIFont.wmf_font(.boldHeadline, compatibleWithTraitCollection: traitCollection)
+
     }
 
     override func layoutSubviews() {
         super.layoutSubviews()
-        headingLabel.preferredMaxLayoutWidth = headingLabel.bounds.width
+        imageDescriptionLabel.numberOfLines = 2
+        imageDescriptionLabel.preferredMaxLayoutWidth = imageDescriptionLabel.bounds.width
+        buttonHeightConstraint.constant = imageHeightConstraint.constant/2
+        titleButton.titleLabel?.numberOfLines = 3
     }
 
     @IBAction private func performTitleAction(_ sender: UIButton) {
@@ -55,12 +62,30 @@ final class InsertMediaSettingsImageView: UIView {
         }
         titleAction?(url)
     }
+
+    private func getImageLinkButtonTitle() -> NSMutableAttributedString {
+        let attributedString = NSMutableAttributedString()
+        if let imageAttachment = UIImage(named: "mini-external") {
+            let attachment = NSTextAttachment(image: imageAttachment)
+            attributedString.append(NSAttributedString(string: title ?? String()))
+            attributedString.append(NSAttributedString(string: "  "))
+            attributedString.append(NSAttributedString(attachment: attachment))
+        }
+        return attributedString
+    }
+
+    private func configTitleButton() {
+        titleButton.titleLabel?.lineBreakMode = .byTruncatingMiddle
+        titleButton.configuration?.contentInsets = .zero
+        titleButton.configuration?.titlePadding = .zero
+        titleButton.sizeToFit()
+    }
 }
 
 extension InsertMediaSettingsImageView: Themeable {
     func apply(theme: Theme) {
         backgroundColor = theme.colors.paperBackground
-        headingLabel.textColor = theme.colors.secondaryText
+        imageDescriptionLabel.textColor = theme.colors.secondaryText
         titleButton.setTitleColor(theme.colors.link, for: .normal)
         separatorView.backgroundColor = theme.colors.border
     }