Digital ACT-191 ONEAPP-6827 story: fixed layout issues

VDS/Components/Breadcrumbs/BreadcrumbCellItem.swift

@@ -22,7 +22,7 @@ final class BreadcrumbCellItem: UICollectionViewCell {
     var crumb : BreadcrumbItem? {
         didSet {
             guard let crumb = crumb else { return }
-            breadcrumb = crumb
+            breadCrumbItem = crumb
             crumbWidthConstraint?.constant = crumb.intrinsicContentSize.width
             crumbWidthConstraint?.isActive = true
         }
@@ -33,15 +33,12 @@ final class BreadcrumbCellItem: UICollectionViewCell {
             $0.translatesAutoresizingMaskIntoConstraints = false
             $0.axis = .horizontal
             $0.distribution = .fill
-            $0.alignment = .top
+            $0.alignment = .fill
             $0.spacing = VDSLayout.Spacing.space1X.value
         }
     }()
     
-    internal var breadcrumb = BreadcrumbItem().with {
+    internal var breadCrumbItem: BreadcrumbItem?
-        $0.translatesAutoresizingMaskIntoConstraints = false
-        $0.titleLabel?.numberOfLines = 0
-    }
     
     ///separator label
     private var separator: Label = Label().with {
@@ -74,22 +71,36 @@ final class BreadcrumbCellItem: UICollectionViewCell {
     
     ///Configuring the cell with default setup
     private func setUp() {
-        //add stackview - this is the horizontal stack that contains breadcrumb and separator
-        stackView.addArrangedSubview(breadcrumb)
-        crumbWidthConstraint = breadcrumb.widthAnchor.constraint(greaterThanOrEqualToConstant: 0).activate()
-        stackView.addArrangedSubview(separator)
-        stackView.setCustomSpacing(VDSLayout.Spacing.space1X.value, after: breadcrumb)
-        stackView.pinToSuperView()
         contentView.addSubview(stackView)
+        stackView.pinToSuperView()
         separator.backgroundColor = .clear
     }
     
     ///Updating UI based on selected index, current index along with surface
     func update(surface: Surface, hideSlash: Bool, breadCrumbItem: BreadcrumbItem) {
-        breadcrumb = breadCrumbItem
+        stackView.removeAllArrangedSubviews()
-        breadcrumb.text = breadCrumbItem.text
+        stackView.addArrangedSubview(separator)
+        stackView.addArrangedSubview(breadCrumbItem)
+        stackView.setCustomSpacing(VDSLayout.Spacing.space1X.value, after: breadCrumbItem)
         separator.textColor = textColorConfiguration.getColor(surface)
         separator.isHidden = hideSlash
-        print("selected: \(breadcrumb.isSelected), hideSlash: \(hideSlash), text: \(String(describing: breadCrumbItem.text)))")
+        print("selected: \(breadCrumbItem.isSelected), hideSlash: \(hideSlash), text: \(String(describing: breadCrumbItem.text)))")
+        self.breadCrumbItem = breadCrumbItem
+        layoutIfNeeded()
+    }
+}
+
+extension UIStackView {
+    
+    @discardableResult
+    func removeAllArrangedSubviews() -> [UIView] {
+        return arrangedSubviews.reduce([UIView]()) { $0 + [removeArrangedSubViewProperly($1)] }
+    }
+
+    func removeArrangedSubViewProperly(_ view: UIView) -> UIView {
+        removeArrangedSubview(view)
+        NSLayoutConstraint.deactivate(view.constraints)
+        view.removeFromSuperview()
+        return view
     }
 }

VDS/Components/Breadcrumbs/Breadcrumbs.swift

@@ -18,12 +18,17 @@ open class Breadcrumbs: View {
     //--------------------------------------------------
     // MARK: - Private Properties
     //--------------------------------------------------
-    let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout()
+    let layout: UICollectionViewFlowLayout = UICollectionViewFlowLayout().with {
+        $0.estimatedItemSize = UICollectionViewFlowLayout.automaticSize
+        $0.minimumInteritemSpacing = VDSLayout.Spacing.space1X.value
+        $0.minimumLineSpacing = VDSLayout.Spacing.space1X.value
+        $0.sectionInset = .zero
+        $0.scrollDirection = .vertical
+    }
     
     ///Collectionview to render Breadcrumbs indexes
     private lazy var collectionView: UICollectionView = {
         let collectionView = UICollectionView(frame: .zero, collectionViewLayout: layout)
-        layout.minimumInteritemSpacing = VDSLayout.Spacing.space1X.value
         collectionView.isScrollEnabled = false
         collectionView.translatesAutoresizingMaskIntoConstraints = false
         collectionView.delegate = self
@@ -84,7 +89,7 @@ open class Breadcrumbs: View {
     }
 }
 
-extension Breadcrumbs: UICollectionViewDelegate, UICollectionViewDataSource, UICollectionViewDelegateFlowLayout {
+extension Breadcrumbs: UICollectionViewDelegate, UICollectionViewDataSource {
     //--------------------------------------------------
     // MARK: - UICollectionView Delegate & Datasource
     //--------------------------------------------------
@@ -94,16 +99,11 @@ extension Breadcrumbs: UICollectionViewDelegate, UICollectionViewDataSource, UIC
     public func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
         guard let cell = collectionView.dequeueReusableCell(withReuseIdentifier: BreadcrumbCellItem.identifier, for: indexPath) as? BreadcrumbCellItem else { return UICollectionViewCell() }
         let breadcrumb : BreadcrumbItem = breadcrumbItems[indexPath.row] as! BreadcrumbItem
-        let hideSlash = (indexPath.row == (breadcrumbItems.count - 1))
+        let hideSlash = (indexPath.row == 0)
-        cell.crumb = breadcrumb
         cell.update(surface: surface, hideSlash: hideSlash, breadCrumbItem: breadcrumb)
         return cell
     }
     
-    public func collectionView(_ collectionView: UICollectionView, sizeForItemAtIndexPath indexPath: IndexPath) -> CGSize {
-        breadcrumbItems[indexPath.row].intrinsicContentSize
-    }
-    
     public func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
     }
 }