Added images and bold text for generic error page

firefox-ios/Client/Application/ImageIdentifiers.swift

@@ -65,6 +65,7 @@ public struct ImageIdentifiers {
 
     public struct NativeErrorPage {
         public static let noInternetConnection = "noInternetConnection"
+        public static let securityError = "securityError"
     }
 
     public struct TrackingProtection {

firefox-ios/Client/Assets/Images.xcassets/NativeErrorPage/securityError.imageset/Contents.json

@@ -0,0 +1,12 @@
+{
+  "images" : [
+    {
+      "filename" : "securityError.pdf",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

firefox-ios/Client/Frontend/NativeErrorPage/NativeErrorPageHelper.swift

@@ -28,19 +28,31 @@ class NativeErrorPageHelper {
         var title = ""
         var description = ""
         var foxImageName = ""
-
-        switch error.code {
-        case Int(CFNetworkErrors.cfurlErrorNotConnectedToInternet.rawValue):
-            foxImageName = ImageIdentifiers.NativeErrorPage.noInternetConnection
-            title = .NativeErrorPage.NoInternetConnection.TitleLabel
-            description = .NativeErrorPage.NoInternetConnection.Description
-        default:
-            foxImageName = ImageIdentifiers.NativeErrorPage.noInternetConnection
-            title = .NativeErrorPage.GenericError.TitleLabel
-            description = .NativeErrorPage.GenericError.Description
+        var errorURL: URL?
+
+        if let url = error.userInfo[NSURLErrorFailingURLErrorKey] as? URL {
+            switch error.code {
+            case Int(CFNetworkErrors.cfurlErrorNotConnectedToInternet.rawValue):
+                foxImageName = ImageIdentifiers.NativeErrorPage.noInternetConnection
+                title = .NativeErrorPage.NoInternetConnection.TitleLabel
+                description = .NativeErrorPage.NoInternetConnection.Description
+                errorURL = nil
+            default:
+                foxImageName = ImageIdentifiers.NativeErrorPage.securityError
+                title = .NativeErrorPage.GenericError.TitleLabel
+                description = .NativeErrorPage.GenericError.Description
+                errorURL = url
+            }
+        } else {
+            errorURL = nil
         }
 
-        let model = ErrorPageModel(errorTitle: title, errorDescription: description, foxImageName: foxImageName)
+        let model = ErrorPageModel(
+            errorTitle: title,
+            errorDescription: description,
+            foxImageName: foxImageName,
+            url: errorURL
+        )
         return model
     }
 }

firefox-ios/Client/Frontend/NativeErrorPage/NativeErrorPageModel.swift

@@ -8,4 +8,5 @@ struct ErrorPageModel: Equatable {
     let errorTitle: String
     let errorDescription: String
     let foxImageName: String
+    let url: URL?
 }

firefox-ios/Client/Frontend/NativeErrorPage/NativeErrorPageState.swift

@@ -11,6 +11,7 @@ struct NativeErrorPageState: ScreenState, Equatable {
     var title: String?
     var description: String?
     var foxImage: String?
+    var url: URL?
 
     init(appState: AppState, uuid: WindowUUID) {
         guard let nativeErrorPageState = store.state.screenState(
@@ -26,20 +27,23 @@ struct NativeErrorPageState: ScreenState, Equatable {
             windowUUID: nativeErrorPageState.windowUUID,
             title: nativeErrorPageState.title,
             description: nativeErrorPageState.description,
-            foxImage: nativeErrorPageState.foxImage
+            foxImage: nativeErrorPageState.foxImage,
+            url: nativeErrorPageState.url
         )
     }
 
     init(
         windowUUID: WindowUUID,
         title: String? = nil,
         description: String? = nil,
-        foxImage: String? = nil
+        foxImage: String? = nil,
+        url: URL? = nil
     ) {
         self.windowUUID = windowUUID
         self.title = title
         self.description = description
         self.foxImage = foxImage
+        self.url = url
     }
 
     static let reducer: Reducer<Self> = { state, action in
@@ -56,7 +60,8 @@ struct NativeErrorPageState: ScreenState, Equatable {
                 windowUUID: state.windowUUID,
                 title: model.errorTitle,
                 description: model.errorDescription,
-                foxImage: model.foxImageName
+                foxImage: model.foxImageName,
+                url: model.url
             )
         default:
             return defaultState(from: state)
@@ -68,7 +73,8 @@ struct NativeErrorPageState: ScreenState, Equatable {
             windowUUID: state.windowUUID,
             title: state.title,
             description: state.description,
-            foxImage: state.foxImage
+            foxImage: state.foxImage,
+            url: state.url
         )
     }
 }

firefox-ios/Client/Frontend/NativeErrorPage/NativeErrorPageViewController.swift

@@ -50,7 +50,7 @@ final class NativeErrorPageViewController: UIViewController,
             top: 100,
             leading: 166,
             bottom: -16,
-            trailing: -144
+            trailing: -166
         )
     }
 
@@ -72,9 +72,6 @@ final class NativeErrorPageViewController: UIViewController,
     }
 
     private lazy var foxImage: UIImageView = .build { imageView in
-        imageView.image = UIImage(
-            named: ImageIdentifiers.NativeErrorPage.noInternetConnection
-        )
         imageView.contentMode = .scaleAspectFit
         imageView.isAccessibilityElement = false
         imageView.accessibilityIdentifier = AccessibilityIdentifiers.NativeErrorPage.foxImage
@@ -133,8 +130,22 @@ final class NativeErrorPageViewController: UIViewController,
     // MARK: Redux
     func newState(state: NativeErrorPageState) {
         nativeErrorPageState = state
+
+        if let validImageName = nativeErrorPageState.foxImage {
+            foxImage.image = UIImage(named: validImageName)
+        }
+
         titleLabel.text = state.title
-        errorDescriptionLabel.text = state.description
+
+        if let validURL = state.url, let validDescription = state.description {
+            let errorDescription = getDescriptionWithHostName(
+                errorURL: validURL,
+                description: validDescription
+            )
+            errorDescriptionLabel.attributedText = errorDescription
+        } else {
+            errorDescriptionLabel.text = state.description
+        }
     }
 
     func subscribeToRedux() {
@@ -316,4 +327,22 @@ final class NativeErrorPageViewController: UIViewController,
             )
         )
     }
+
+    func getDescriptionWithHostName(errorURL: URL, description: String) -> NSAttributedString? {
+        guard let validHostName = errorURL.host else { return nil }
+        let errDescription = String(format: description, validHostName)
+        let attributedString = errDescription.attributedText(
+            boldString: validHostName,
+            font: errorDescriptionLabel.font
+        )
+        return attributedString
+    }
+}
+
+public extension NSMutableAttributedString {
+    func setFont(_ font: UIFont) -> NSMutableAttributedString {
+        addAttribute(NSAttributedString.Key.font, value: font, range: NSRange(location: 0, length: string.count))
+
+        return self
+    }
 }