vds_ios/VDS/Components/Badge/Badge.swift

//
//  Badge.swift
//  VDS
//
//  Created by Matt Bruce on 9/22/22.
//

import Foundation
import UIKit
import VDSCoreTokens
import Combine

/// A badge is a visual label used to convey status or highlight supplemental information.
///
/// If you are using AutoLayoutConstraints you have a combination of Leading/Left and Trailing/Right NSLayoutConstraints,
/// you need to ensure that one of these Horizontal Contraints is not constraint of "equatTo".  If you are to pin the left/right edges
/// to its parent this object will stretch to the parent's width.
@objcMembers
@objc(VDSBadge)
open class Badge: View, ParentViewProtocol {
    
    //--------------------------------------------------
    // MARK: - Initializers
    //--------------------------------------------------
    required public init() {
        super.init(frame: .zero)
    }
    
    public override init(frame: CGRect) {
        super.init(frame: .zero)
    }
    
    public required init?(coder: NSCoder) {
        super.init(coder: coder)
    }
    
    //--------------------------------------------------
    // MARK: - Enums
    //--------------------------------------------------
    /// Enum used to describe the primary color for the view.
    public enum FillColor: String, CaseIterable {
        case red, yellow, green, orange, blue, black, white
    }
    
    //--------------------------------------------------
    // MARK: - Public Properties
    //--------------------------------------------------
    open var children: [any ViewProtocol] { [label] }

    /// Label used to render text
    open var label = Label().with {
        $0.isAccessibilityElement = false
        $0.lineBreakMode = .byTruncatingTail
        $0.setContentCompressionResistancePriority(.required, for: .vertical)
        $0.setContentHuggingPriority(.defaultHigh, for: .vertical)
        $0.setContentCompressionResistancePriority(.required, for: .horizontal)
        $0.setContentHuggingPriority(.defaultHigh, for: .horizontal)
        $0.textStyle = .boldBodySmall
    }
    
    /// This will render the badges fill color based on the available options.
    /// When used in conjunction with the surface prop, this fill color will change its tint automatically based on a light or dark surface.
    open var fillColor: FillColor = .red { didSet { setNeedsUpdate() }}
    
    /// The text that will be shown in the label.
    open var text: String = "" { didSet { setNeedsUpdate() }}
    
    /// When applied, this property takes a px value  that will restrict the width at that point.
    open var maxWidth: CGFloat? { didSet { setNeedsUpdate() }}
    
    /// This will restrict the badge height to a specific number of lines. If the text overflows the allowable space, ellipsis will show.
    open var numberOfLines: Int = 1 { didSet { setNeedsUpdate() }}
    
    //--------------------------------------------------
    // MARK: - Constraints
    //--------------------------------------------------
    private var maxWidthConstraint: NSLayoutConstraint?
    
    private func updateMaxWidth() {
        maxWidthConstraint?.isActive = false
        guard let maxWidth, maxWidth > minWidth else { return }
        maxWidthConstraint?.constant = maxWidth
        maxWidthConstraint?.isActive = true
    }
    
    //--------------------------------------------------
    // MARK: - Configuration
    //--------------------------------------------------
    private var minWidth: CGFloat = 23.0
    private var labelInset: UIEdgeInsets = .init(top: 2,
                                                 left: VDSLayout.space1X,
                                                 bottom: 2,
                                                 right: VDSLayout.space1X)
    
    /// ColorConfiguration that is mapped to the 'fillColor' for the surface.
    private var backgroundColorConfiguration: AnyColorable = {
        let config = KeyedColorConfiguration<Badge, FillColor>(keyPath: \.fillColor)
        config.setSurfaceColors(VDSColor.badgesBackgroundRedOnlight, VDSColor.badgesBackgroundRedOndark, forKey: .red)
        config.setSurfaceColors(VDSColor.badgesBackgroundYellowOnlight, VDSColor.badgesBackgroundYellowOndark, forKey: .yellow)
        config.setSurfaceColors(VDSColor.badgesBackgroundGreenOnlight, VDSColor.badgesBackgroundGreenOndark, forKey: .green)
        config.setSurfaceColors(VDSColor.badgesBackgroundOrangeOnlight, VDSColor.badgesBackgroundOrangeOndark, forKey: .orange)
        config.setSurfaceColors(VDSColor.badgesBackgroundBlueOnlight, VDSColor.badgesBackgroundBlueOndark, forKey: .blue)
        config.setSurfaceColors(VDSColor.badgesBackgroundBlackOnlight, VDSColor.badgesBackgroundBlackOndark, forKey: .black)
        config.setSurfaceColors(VDSColor.badgesBackgroundWhiteOnlight, VDSColor.badgesBackgroundWhiteOndark, forKey: .white)
        return config.eraseToAnyColorable()
    }()
    
    /// ColorConfiguration for the Text.
    private var textColorConfiguration = ViewColorConfiguration()
    
    /// Updates the textColorConfiguration based on the fillColor.
    public func updateTextColorConfig() {
        textColorConfiguration.reset()
        
        switch fillColor {
            
        case .red, .black:
            textColorConfiguration.setSurfaceColors(VDSColor.elementsPrimaryOndark, VDSColor.elementsPrimaryOndark, forDisabled: false)
            textColorConfiguration.setSurfaceColors(VDSColor.elementsPrimaryOndark, VDSColor.elementsPrimaryOndark, forDisabled: true)
            
        case .yellow, .white:
            textColorConfiguration.setSurfaceColors(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOnlight, forDisabled: false)
            textColorConfiguration.setSurfaceColors(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOnlight, forDisabled: true)
            
        case .orange, .green, .blue:
            textColorConfiguration.setSurfaceColors(VDSColor.elementsPrimaryOndark, VDSColor.elementsPrimaryOnlight, forDisabled: false)
            textColorConfiguration.setSurfaceColors(VDSColor.elementsPrimaryOndark, VDSColor.elementsPrimaryOnlight, forDisabled: true)
        }
    }
    
    //--------------------------------------------------
    // MARK: - Lifecycle
    //--------------------------------------------------
    /// Called once when a view is initialized and is used to Setup additional UI or other constants and configurations.
    open override func setup() {
        super.setup()
        isAccessibilityElement = true
        accessibilityTraits = .staticText
        
        layer.cornerRadius = 2
        
        addSubview(label)
        
        label
            .pinTop(labelInset.top)
            .pinLeading(labelInset.left)
            .pinTrailing(labelInset.right)
            .pinBottom(labelInset.bottom, .defaultHigh)
        
        label.widthGreaterThanEqualTo(constant: minWidth)
        maxWidthConstraint = label.widthLessThanEqualTo(constant: 0).with { $0.isActive = false }
        clipsToBounds = true
        
    }
    
    open override func setDefaults() {
        super.setDefaults()
        
        bridge_accessibilityLabelBlock = {  [weak self] in
            guard let self else { return "" }
            return text
        }
        
        label.lineBreakMode = .byTruncatingTail
        label.textStyle = .boldBodySmall
        fillColor = .red
        text = ""
        maxWidth = nil
        numberOfLines = 1
    }
    
    /// Resets to default settings.
    open override func reset() {
        label.reset()
        super.reset()
    }
    
    /// Used to make changes to the View based off a change events or from local properties.
    open override func updateView() {
        super.updateView()
        
        updateTextColorConfig()
        updateMaxWidth()

        backgroundColor = backgroundColorConfiguration.getColor(self)
        
        label.textColorConfiguration = textColorConfiguration.eraseToAnyColorable()
        label.numberOfLines = numberOfLines
        label.text = text
        label.surface = surface
        label.isEnabled = isEnabled
    }
}