Various improvements

submodules/StatisticsUI/Sources/CpmSliderItem.swift

@@ -0,0 +1,322 @@
+import Foundation
+import UIKit
+import Display
+import AsyncDisplayKit
+import SwiftSignalKit
+import TelegramCore
+import TelegramUIPreferences
+import TelegramPresentationData
+import LegacyComponents
+import ItemListUI
+import PresentationDataUtils
+import EmojiTextAttachmentView
+import TextFormat
+import AccountContext
+import UIKitRuntimeUtils
+
+final class CpmSliderItem: ListViewItem, ItemListItem {
+    let context: AccountContext
+    let theme: PresentationTheme
+    let strings: PresentationStrings
+    let value: Int32
+    let animatedEmoji: TelegramMediaFile?
+    let sectionId: ItemListSectionId
+    let updated: (Int32) -> Void
+    
+    init(context: AccountContext, theme: PresentationTheme, strings: PresentationStrings, value: Int32, enabled: Bool, animatedEmoji: TelegramMediaFile?, sectionId: ItemListSectionId, updated: @escaping (Int32) -> Void) {
+        self.context = context
+        self.theme = theme
+        self.strings = strings
+        self.value = value
+        self.animatedEmoji = animatedEmoji
+        self.sectionId = sectionId
+        self.updated = updated
+    }
+    
+    func nodeConfiguredForParams(async: @escaping (@escaping () -> Void) -> Void, params: ListViewItemLayoutParams, synchronousLoads: Bool, previousItem: ListViewItem?, nextItem: ListViewItem?, completion: @escaping (ListViewItemNode, @escaping () -> (Signal<Void, NoError>?, (ListViewItemApply) -> Void)) -> Void) {
+        async {
+            let node = CpmSliderItemNode()
+            let (layout, apply) = node.asyncLayout()(self, params, itemListNeighbors(item: self, topItem: previousItem as? ItemListItem, bottomItem: nextItem as? ItemListItem))
+            
+            node.contentSize = layout.contentSize
+            node.insets = layout.insets
+            
+            Queue.mainQueue().async {
+                completion(node, {
+                    return (nil, { _ in apply() })
+                })
+            }
+        }
+    }
+    
+    func updateNode(async: @escaping (@escaping () -> Void) -> Void, node: @escaping () -> ListViewItemNode, params: ListViewItemLayoutParams, previousItem: ListViewItem?, nextItem: ListViewItem?, animation: ListViewItemUpdateAnimation, completion: @escaping (ListViewItemNodeLayout, @escaping (ListViewItemApply) -> Void) -> Void) {
+        Queue.mainQueue().async {
+            if let nodeValue = node() as? CpmSliderItemNode {
+                let makeLayout = nodeValue.asyncLayout()
+                
+                async {
+                    let (layout, apply) = makeLayout(self, params, itemListNeighbors(item: self, topItem: previousItem as? ItemListItem, bottomItem: nextItem as? ItemListItem))
+                    Queue.mainQueue().async {
+                        completion(layout, { _ in
+                            apply()
+                        })
+                    }
+                }
+            }
+        }
+    }
+}
+
+private let allowedValues: [Int32] = [1, 2, 3, 4, 5]
+
+class CpmSliderItemNode: ListViewItemNode {
+    private let backgroundNode: ASDisplayNode
+    private let topStripeNode: ASDisplayNode
+    private let bottomStripeNode: ASDisplayNode
+    private let maskNode: ASImageNode
+    
+    private let minTextNode: TextNode
+    private let maxTextNode: TextNode
+    private let textNode: TextNode
+    private var sliderView: TGPhotoEditorSliderView?
+    private var animatedEmojiLayer: InlineStickerItemLayer?
+    private var maxAnimatedEmojiLayer: InlineStickerItemLayer?
+    
+    private var item: CpmSliderItem?
+    private var layoutParams: ListViewItemLayoutParams?
+    private var reportedValue: Int32?
+    
+    init() {
+        self.backgroundNode = ASDisplayNode()
+        self.backgroundNode.isLayerBacked = true
+        
+        self.maskNode = ASImageNode()
+        
+        self.topStripeNode = ASDisplayNode()
+        self.topStripeNode.isLayerBacked = true
+        
+        self.bottomStripeNode = ASDisplayNode()
+        self.bottomStripeNode.isLayerBacked = true
+        
+        self.textNode = TextNode()
+        self.textNode.isUserInteractionEnabled = false
+        self.textNode.displaysAsynchronously = false
+        
+        self.minTextNode = TextNode()
+        self.minTextNode.isUserInteractionEnabled = false
+        self.minTextNode.displaysAsynchronously = false
+        
+        self.maxTextNode = TextNode()
+        self.maxTextNode.isUserInteractionEnabled = false
+        self.maxTextNode.displaysAsynchronously = false
+        
+        super.init(layerBacked: false, dynamicBounce: false)
+        
+        self.addSubnode(self.textNode)
+        self.addSubnode(self.minTextNode)
+        self.addSubnode(self.maxTextNode)
+    }
+    
+    override func didLoad() {
+        super.didLoad()
+        
+        self.view.disablesInteractiveTransitionGestureRecognizer = true
+        
+        let sliderView = TGPhotoEditorSliderView()
+        sliderView.enablePanHandling = true
+        sliderView.trackCornerRadius = 2.0
+        sliderView.lineSize = 4.0
+        sliderView.dotSize = 5.0
+        sliderView.minimumValue = 0.0
+        sliderView.maximumValue = 1.0
+        sliderView.startValue = 0.0
+        sliderView.displayEdges = true
+        sliderView.disablesInteractiveTransitionGestureRecognizer = true
+        if let item = self.item, let params = self.layoutParams {
+            sliderView.value = CGFloat(item.value) / 50.0
+            sliderView.backgroundColor = item.theme.list.itemBlocksBackgroundColor
+            sliderView.backColor = item.theme.list.itemSwitchColors.frameColor
+            sliderView.startColor = item.theme.list.itemSwitchColors.frameColor
+            sliderView.trackColor = item.theme.list.itemAccentColor
+            sliderView.knobImage = PresentationResourcesItemList.knobImage(item.theme)
+            
+            sliderView.frame = CGRect(origin: CGPoint(x: params.leftInset + 15.0, y: 37.0), size: CGSize(width: params.width - params.leftInset - params.rightInset - 15.0 * 2.0, height: 44.0))
+            sliderView.hitTestEdgeInsets = UIEdgeInsets(top: -sliderView.frame.minX, left: 0.0, bottom: 0.0, right: -sliderView.frame.minX)
+        }
+        self.view.addSubview(sliderView)
+        sliderView.addTarget(self, action: #selector(self.sliderValueChanged), for: .valueChanged)
+        self.sliderView = sliderView
+    }
+    
+    func asyncLayout() -> (_ item: CpmSliderItem, _ params: ListViewItemLayoutParams, _ neighbors: ItemListNeighbors) -> (ListViewItemNodeLayout, () -> Void) {
+        let currentItem = self.item
+        let makeTextLayout = TextNode.asyncLayout(self.textNode)
+        let makeMinTextLayout = TextNode.asyncLayout(self.minTextNode)
+        let makeMaxTextLayout = TextNode.asyncLayout(self.maxTextNode)
+        
+        return { item, params, neighbors in
+            var themeUpdated = false
+            if currentItem?.theme !== item.theme {
+                themeUpdated = true
+            }
+            
+            let contentSize: CGSize
+            let insets: UIEdgeInsets
+            let separatorHeight = UIScreenPixel
+            
+            //TODO:localize
+            let (textLayout, textApply) = makeTextLayout(TextNodeLayoutArguments(attributedString: NSAttributedString(string: item.value == 0 ? "No Ads" : "\(item.value) CPM", font: Font.regular(17.0), textColor: item.theme.list.itemPrimaryTextColor), backgroundColor: nil, maximumNumberOfLines: 1, truncationType: .end, constrainedSize: CGSize(width: params.width, height: CGFloat.greatestFiniteMagnitude), alignment: .center, lineSpacing: 0.0, cutout: nil, insets: UIEdgeInsets()))
+            
+            let (minTextLayout, minTextApply) = makeMinTextLayout(TextNodeLayoutArguments(attributedString: NSAttributedString(string: "No Ads", font: Font.regular(13.0), textColor: item.theme.list.itemSecondaryTextColor), backgroundColor: nil, maximumNumberOfLines: 1, truncationType: .end, constrainedSize: CGSize(width: params.width, height: CGFloat.greatestFiniteMagnitude), alignment: .center, lineSpacing: 0.0, cutout: nil, insets: UIEdgeInsets()))
+            
+            let (maxTextLayout, maxTextApply) = makeMaxTextLayout(TextNodeLayoutArguments(attributedString: NSAttributedString(string: "50 CPM", font: Font.regular(13.0), textColor: item.theme.list.itemSecondaryTextColor), backgroundColor: nil, maximumNumberOfLines: 1, truncationType: .end, constrainedSize: CGSize(width: params.width, height: CGFloat.greatestFiniteMagnitude), alignment: .center, lineSpacing: 0.0, cutout: nil, insets: UIEdgeInsets()))
+            
+            contentSize = CGSize(width: params.width, height: 88.0)
+            insets = itemListNeighborsGroupedInsets(neighbors, params)
+            
+            let layout = ListViewItemNodeLayout(contentSize: contentSize, insets: insets)
+            let layoutSize = layout.size
+            
+            return (layout, { [weak self] in
+                if let strongSelf = self {
+                    strongSelf.item = item
+                    strongSelf.layoutParams = params
+                    
+                    strongSelf.backgroundNode.backgroundColor = item.theme.list.itemBlocksBackgroundColor
+                    strongSelf.topStripeNode.backgroundColor = item.theme.list.itemBlocksSeparatorColor
+                    strongSelf.bottomStripeNode.backgroundColor = item.theme.list.itemBlocksSeparatorColor
+                    
+                    if strongSelf.backgroundNode.supernode == nil {
+                        strongSelf.insertSubnode(strongSelf.backgroundNode, at: 0)
+                    }
+                    if strongSelf.topStripeNode.supernode == nil {
+                        strongSelf.insertSubnode(strongSelf.topStripeNode, at: 1)
+                    }
+                    if strongSelf.bottomStripeNode.supernode == nil {
+                        strongSelf.insertSubnode(strongSelf.bottomStripeNode, at: 2)
+                    }
+                    if strongSelf.maskNode.supernode == nil {
+                        strongSelf.insertSubnode(strongSelf.maskNode, at: 3)
+                    }
+                    let hasCorners = itemListHasRoundedBlockLayout(params)
+                    var hasTopCorners = false
+                    var hasBottomCorners = false
+                    switch neighbors.top {
+                        case .sameSection(false):
+                            strongSelf.topStripeNode.isHidden = true
+                        default:
+                            hasTopCorners = true
+                            strongSelf.topStripeNode.isHidden = hasCorners
+                    }
+                    let bottomStripeInset: CGFloat
+                    let bottomStripeOffset: CGFloat
+                    switch neighbors.bottom {
+                        case .sameSection(false):
+                            bottomStripeInset = 0.0
+                            bottomStripeOffset = -separatorHeight
+                            strongSelf.bottomStripeNode.isHidden = false
+                        default:
+                            bottomStripeInset = 0.0
+                            hasBottomCorners = true
+                            strongSelf.bottomStripeNode.isHidden = hasCorners
+                            bottomStripeOffset = 0.0
+                    }
+                    
+                    strongSelf.maskNode.image = hasCorners ? PresentationResourcesItemList.cornersImage(item.theme, top: hasTopCorners, bottom: hasBottomCorners) : nil
+                    
+                    strongSelf.backgroundNode.frame = CGRect(origin: CGPoint(x: 0.0, y: -min(insets.top, separatorHeight)), size: CGSize(width: params.width, height: contentSize.height + min(insets.top, separatorHeight) + min(insets.bottom, separatorHeight)))
+                    strongSelf.maskNode.frame = strongSelf.backgroundNode.frame.insetBy(dx: params.leftInset, dy: 0.0)
+                    strongSelf.topStripeNode.frame = CGRect(origin: CGPoint(x: 0.0, y: -min(insets.top, separatorHeight)), size: CGSize(width: layoutSize.width, height: separatorHeight))
+                    strongSelf.bottomStripeNode.frame = CGRect(origin: CGPoint(x: bottomStripeInset, y: contentSize.height + bottomStripeOffset), size: CGSize(width: layoutSize.width - bottomStripeInset, height: separatorHeight))
+                    
+                    let _ = textApply()
+                    let textFrame = CGRect(origin: CGPoint(x: floor((params.width - textLayout.size.width) / 2.0), y: 12.0), size: textLayout.size)
+                    strongSelf.textNode.frame = textFrame
+                    
+                    if let animatedEmoji = item.animatedEmoji {
+                        let itemSize = floorToScreenPixels(17.0 * 20.0 / 17.0)
+                        
+                        var itemFrame = CGRect(origin: CGPoint(x: textFrame.minX - itemSize / 2.0 - 1.0, y: textFrame.midY), size: CGSize()).insetBy(dx: -itemSize / 2.0, dy: -itemSize / 2.0)
+                        itemFrame.origin.x = floorToScreenPixels(itemFrame.origin.x)
+                        itemFrame.origin.y = floorToScreenPixels(itemFrame.origin.y)
+                        
+                        let itemLayer: InlineStickerItemLayer
+                        if let current = strongSelf.animatedEmojiLayer {
+                            itemLayer = current
+                        } else {
+                            let pointSize = floor(itemSize * 1.3)
+                            itemLayer = InlineStickerItemLayer(context: item.context, userLocation: .other, attemptSynchronousLoad: true, emoji: ChatTextInputTextCustomEmojiAttribute(interactivelySelectedFromPackId: nil, fileId: animatedEmoji.fileId.id, file: animatedEmoji, custom: nil), file: animatedEmoji, cache: item.context.animationCache, renderer: item.context.animationRenderer, placeholderColor: item.theme.list.mediaPlaceholderColor, pointSize: CGSize(width: pointSize, height: pointSize), dynamicColor: nil)
+                            strongSelf.animatedEmojiLayer = itemLayer
+                            strongSelf.layer.addSublayer(itemLayer)
+                            
+                            itemLayer.isVisibleForAnimations = true
+                        }
+                        itemLayer.frame = itemFrame
+                    }
+                    
+                    let _ = minTextApply()
+                    strongSelf.minTextNode.frame = CGRect(origin: CGPoint(x: params.leftInset + 16.0, y: 16.0), size: minTextLayout.size)
+                    
+                    let _ = maxTextApply()
+                    let maxTextFrame = CGRect(origin: CGPoint(x: params.width - params.rightInset - 16.0 - maxTextLayout.size.width, y: 16.0), size: maxTextLayout.size)
+                    strongSelf.maxTextNode.frame = maxTextFrame
+                    
+                    if let animatedEmoji = item.animatedEmoji {
+                        let itemSize = floorToScreenPixels(13.0 * 20.0 / 17.0)
+                        
+                        var itemFrame = CGRect(origin: CGPoint(x: maxTextFrame.minX - itemSize / 2.0 - 1.0, y: maxTextFrame.midY), size: CGSize()).insetBy(dx: -itemSize / 2.0, dy: -itemSize / 2.0)
+                        itemFrame.origin.x = floorToScreenPixels(itemFrame.origin.x)
+                        itemFrame.origin.y = floorToScreenPixels(itemFrame.origin.y)
+                        
+                        let itemLayer: InlineStickerItemLayer
+                        if let current = strongSelf.maxAnimatedEmojiLayer {
+                            itemLayer = current
+                        } else {
+                            let pointSize = floor(itemSize * 1.3)
+                            itemLayer = InlineStickerItemLayer(context: item.context, userLocation: .other, attemptSynchronousLoad: true, emoji: ChatTextInputTextCustomEmojiAttribute(interactivelySelectedFromPackId: nil, fileId: animatedEmoji.fileId.id, file: animatedEmoji, custom: nil), file: animatedEmoji, cache: item.context.animationCache, renderer: item.context.animationRenderer, placeholderColor: item.theme.list.mediaPlaceholderColor, pointSize: CGSize(width: pointSize, height: pointSize), dynamicColor: nil)
+                            strongSelf.maxAnimatedEmojiLayer = itemLayer
+                            strongSelf.layer.addSublayer(itemLayer)
+                            
+                            itemLayer.isVisibleForAnimations = true
+                            
+                            if let filter = makeMonochromeFilter() {
+                                filter.setValue([1.0, 1.0, 1.0, 1.0] as [NSNumber], forKey: "inputColor")
+                                filter.setValue(1.0 as NSNumber, forKey: "inputAmount")
+                                itemLayer.filters = [filter]
+                            }
+                        }
+                        itemLayer.frame = itemFrame
+                    }
+                    
+                    if let sliderView = strongSelf.sliderView {
+                        if themeUpdated {
+                            sliderView.backgroundColor = item.theme.list.itemBlocksBackgroundColor
+                            sliderView.backColor = item.theme.list.itemSwitchColors.frameColor
+                            sliderView.startColor = item.theme.list.itemSwitchColors.frameColor
+                            sliderView.trackColor = item.theme.list.itemAccentColor
+                            sliderView.knobImage = PresentationResourcesItemList.knobImage(item.theme)
+                        }
+                        
+                        sliderView.frame = CGRect(origin: CGPoint(x: params.leftInset + 15.0, y: 37.0), size: CGSize(width: params.width - params.leftInset - params.rightInset - 15.0 * 2.0, height: 44.0))
+                        sliderView.hitTestEdgeInsets = UIEdgeInsets(top: -sliderView.frame.minX, left: 0.0, bottom: 0.0, right: -sliderView.frame.minX)
+                    }
+                }
+            })
+        }
+    }
+    
+    override func animateInsertion(_ currentTimestamp: Double, duration: Double, short: Bool) {
+        self.layer.animateAlpha(from: 0.0, to: 1.0, duration: 0.4)
+    }
+    
+    override func animateRemoved(_ currentTimestamp: Double, duration: Double) {
+        self.layer.animateAlpha(from: 1.0, to: 0.0, duration: 0.15, removeOnCompletion: false)
+    }
+    
+    @objc func sliderValueChanged() {
+        guard let item = self.item, let sliderView = self.sliderView else {
+            return
+        }
+        item.updated(Int32(sliderView.value * 50.0))
+    }
+}

submodules/StatisticsUI/Sources/GroupStatsController.swift

@@ -381,7 +381,7 @@ private enum StatsEntry: ItemListNodeEntry {
                  let .topInvitersTitle(_, text, dates):
                 return ItemListSectionHeaderItem(presentationData: presentationData, text: text, accessoryText: ItemListSectionHeaderAccessoryText(value: dates, color: .generic), sectionId: self.section)
             case let .overview(_, stats):
-                return StatsOverviewItem(presentationData: presentationData, isGroup: true, stats: stats, sectionId: self.section, style: .blocks)
+                return StatsOverviewItem(context: arguments.context, presentationData: presentationData, isGroup: true, stats: stats, sectionId: self.section, style: .blocks)
             case let .growthGraph(_, _, _, graph, type),
                  let .membersGraph(_, _, _, graph, type),
                  let .newMembersBySourceGraph(_, _, _, graph, type),

submodules/StatisticsUI/Sources/MessageStatsController.swift

@@ -160,7 +160,7 @@ private enum StatsEntry: ItemListNodeEntry {
                  let .publicForwardsTitle(_, text):
                 return ItemListSectionHeaderItem(presentationData: presentationData, text: text, sectionId: self.section)
             case let .overview(_, stats, storyViews, publicShares):
-                return StatsOverviewItem(presentationData: presentationData, isGroup: false, stats: stats as! Stats, storyViews: storyViews, publicShares: publicShares, sectionId: self.section, style: .blocks)
+                return StatsOverviewItem(context: arguments.context, presentationData: presentationData, isGroup: false, stats: stats as! Stats, storyViews: storyViews, publicShares: publicShares, sectionId: self.section, style: .blocks)
             case let .interactionsGraph(_, _, _, graph, type, noInitialZoom), let .reactionsGraph(_, _, _, graph, type, noInitialZoom):
                 return StatsGraphItem(presentationData: presentationData, graph: graph, type: type, noInitialZoom: noInitialZoom, getDetailsData: { date, completion in
                     let _ = arguments.loadDetailedGraph(graph, Int64(date.timeIntervalSince1970) * 1000).start(next: { graph in

submodules/StatisticsUI/Sources/MonetizationBalanceItem.swift

@@ -0,0 +1,488 @@
+import Foundation
+import UIKit
+import Display
+import AsyncDisplayKit
+import SwiftSignalKit
+import AccountContext
+import TelegramPresentationData
+import ItemListUI
+import SolidRoundedButtonNode
+import TelegramCore
+import EmojiTextAttachmentView
+import TextFormat
+
+final class MonetizationBalanceItem: ListViewItem, ItemListItem {
+    let context: AccountContext
+    let presentationData: ItemListPresentationData
+    let stats: MonetizationStats
+    let animatedEmoji: TelegramMediaFile?
+    let address: String
+    let withdrawAction: () -> Void
+    let qrAction: () -> Void
+    let action: (() -> Void)?
+    let textUpdated: (String) -> Void
+    let shouldUpdateText: (String) -> Bool
+    let processPaste: ((String) -> Void)?
+    let sectionId: ItemListSectionId
+    let style: ItemListStyle
+    
+    init(
+        context: AccountContext,
+        presentationData: ItemListPresentationData,
+        stats: MonetizationStats,
+        animatedEmoji: TelegramMediaFile?,
+        address: String,
+        withdrawAction: @escaping () -> Void,
+        qrAction: @escaping () -> Void,
+        action: (() -> Void)?,
+        textUpdated: @escaping (String) -> Void,
+        shouldUpdateText: @escaping (String) -> Bool,
+        processPaste: ((String) -> Void)?,
+        sectionId: ItemListSectionId,
+        style: ItemListStyle
+    ) {
+        self.context = context
+        self.presentationData = presentationData
+        self.stats = stats
+        self.animatedEmoji = animatedEmoji
+        self.address = address
+        self.withdrawAction = withdrawAction
+        self.qrAction = qrAction
+        self.action = action
+        self.textUpdated = textUpdated
+        self.shouldUpdateText = shouldUpdateText
+        self.processPaste = processPaste
+        self.sectionId = sectionId
+        self.style = style
+    }
+    
+    func nodeConfiguredForParams(async: @escaping (@escaping () -> Void) -> Void, params: ListViewItemLayoutParams, synchronousLoads: Bool, previousItem: ListViewItem?, nextItem: ListViewItem?, completion: @escaping (ListViewItemNode, @escaping () -> (Signal<Void, NoError>?, (ListViewItemApply) -> Void)) -> Void) {
+        async {
+            let node = MonetizationBalanceItemNode()
+            let (layout, apply) = node.asyncLayout()(self, params, itemListNeighbors(item: self, topItem: previousItem as? ItemListItem, bottomItem: nextItem as? ItemListItem))
+            
+            node.contentSize = layout.contentSize
+            node.insets = layout.insets
+            
+            Queue.mainQueue().async {
+                completion(node, {
+                    return (nil, { _ in apply() })
+                })
+            }
+        }
+    }
+    
+    func updateNode(async: @escaping (@escaping () -> Void) -> Void, node: @escaping () -> ListViewItemNode, params: ListViewItemLayoutParams, previousItem: ListViewItem?, nextItem: ListViewItem?, animation: ListViewItemUpdateAnimation, completion: @escaping (ListViewItemNodeLayout, @escaping (ListViewItemApply) -> Void) -> Void) {
+        Queue.mainQueue().async {
+            if let nodeValue = node() as? MonetizationBalanceItemNode {
+                let makeLayout = nodeValue.asyncLayout()
+                
+                async {
+                    let (layout, apply) = makeLayout(self, params, itemListNeighbors(item: self, topItem: previousItem as? ItemListItem, bottomItem: nextItem as? ItemListItem))
+                    Queue.mainQueue().async {
+                        completion(layout, { _ in
+                            apply()
+                        })
+                    }
+                }
+            }
+        }
+    }
+    
+    var selectable: Bool = false
+}
+
+final class MonetizationBalanceItemNode: ListViewItemNode, ItemListItemNode, ASEditableTextNodeDelegate {
+    private let backgroundNode: ASDisplayNode
+    private let topStripeNode: ASDisplayNode
+    private let bottomStripeNode: ASDisplayNode
+    private let maskNode: ASImageNode
+    
+    private var animatedEmojiLayer: InlineStickerItemLayer?
+    private let balanceTextNode: TextNode
+    private let valueTextNode: TextNode
+    
+    private let fieldNode: ASImageNode
+    private let textClippingNode: ASDisplayNode
+    private let textNode: EditableTextNode
+    private let measureTextNode: TextNode
+    
+    private let qrButtonNode: HighlightableButtonNode
+    private var withdrawButtonNode: SolidRoundedButtonNode?
+        
+    private let activateArea: AccessibilityAreaNode
+    
+    private var item: MonetizationBalanceItem?
+    
+    override var canBeSelected: Bool {
+        return false
+    }
+    
+    var tag: ItemListItemTag? {
+        return self.item?.tag
+    }
+    
+    init() {
+        self.backgroundNode = ASDisplayNode()
+        self.backgroundNode.isLayerBacked = true
+        self.backgroundNode.backgroundColor = .white
+        
+        self.maskNode = ASImageNode()
+        
+        self.topStripeNode = ASDisplayNode()
+        self.topStripeNode.isLayerBacked = true
+        
+        self.bottomStripeNode = ASDisplayNode()
+        self.bottomStripeNode.isLayerBacked = true
+        
+        self.balanceTextNode = TextNode()
+        self.balanceTextNode.isUserInteractionEnabled = false
+        self.balanceTextNode.displaysAsynchronously = false
+        
+        self.valueTextNode = TextNode()
+        self.valueTextNode.isUserInteractionEnabled = false
+        self.valueTextNode.displaysAsynchronously = false
+        
+        self.fieldNode = ASImageNode()
+        self.fieldNode.displaysAsynchronously = false
+        self.fieldNode.displayWithoutProcessing = true
+        
+        self.textClippingNode = ASDisplayNode()
+        self.textClippingNode.clipsToBounds = true
+        
+        self.textNode = EditableTextNode()
+        self.measureTextNode = TextNode()
+        
+        self.qrButtonNode = HighlightableButtonNode()
+    
+        self.activateArea = AccessibilityAreaNode()
+        
+        super.init(layerBacked: false, dynamicBounce: false)
+        
+        self.addSubnode(self.balanceTextNode)
+        self.addSubnode(self.valueTextNode)
+        self.addSubnode(self.fieldNode)
+        self.addSubnode(self.qrButtonNode)
+        
+        self.textClippingNode.addSubnode(self.textNode)
+        self.addSubnode(self.textClippingNode)
+        
+        self.qrButtonNode.addTarget(self, action: #selector(self.qrButtonPressed), forControlEvents: .touchUpInside)
+    }
+    
+    override public func didLoad() {
+        super.didLoad()
+        
+        var textColor: UIColor = .black
+        if let item = self.item {
+            textColor = item.presentationData.theme.list.itemPrimaryTextColor
+            self.textNode.typingAttributes = [NSAttributedString.Key.font.rawValue: Font.regular(item.presentationData.fontSize.itemListBaseFontSize), NSAttributedString.Key.foregroundColor.rawValue: textColor]
+        } else {
+            self.textNode.typingAttributes = [NSAttributedString.Key.font.rawValue: Font.regular(17.0), NSAttributedString.Key.foregroundColor.rawValue: textColor]
+        }
+        self.textNode.clipsToBounds = true
+        self.textNode.delegate = self
+        self.textNode.hitTestSlop = UIEdgeInsets(top: -5.0, left: -5.0, bottom: -5.0, right: -5.0)
+    }
+    
+    @objc private func qrButtonPressed() {
+        guard let item = self.item else {
+            return
+        }
+        item.qrAction()
+    }
+    
+    func asyncLayout() -> (_ item: MonetizationBalanceItem, _ params: ListViewItemLayoutParams, _ insets: ItemListNeighbors) -> (ListViewItemNodeLayout, () -> Void) {
+        let currentItem = self.item
+        let makeBalanceTextLayout = TextNode.asyncLayout(self.balanceTextNode)
+        let makeValueTextLayout = TextNode.asyncLayout(self.valueTextNode)
+        let makeTextLayout = TextNode.asyncLayout(self.measureTextNode)
+        
+        return { item, params, neighbors in
+            var updatedTheme: PresentationTheme?
+            if currentItem?.presentationData.theme !== item.presentationData.theme {
+                updatedTheme = item.presentationData.theme
+            }
+            
+            let contentSize: CGSize
+            let insets: UIEdgeInsets
+            let separatorHeight = UIScreenPixel
+            let itemBackgroundColor: UIColor
+            let itemSeparatorColor: UIColor
+            
+            let leftInset = 16.0 + params.leftInset
+            let rightInset = 16.0 + params.rightInset
+            let constrainedWidth = params.width - leftInset - rightInset
+            
+            let integralFont = Font.with(size: 48.0, design: .round, weight: .semibold)
+            let fractionalFont = Font.with(size: 24.0, design: .round, weight: .semibold)
+            
+            let cryptoValue = formatBalanceText(item.stats.availableBalance.cryptoAmount, decimalSeparator: item.presentationData.dateTimeFormat.decimalSeparator)
+            
+            let amountString = amountAttributedString(cryptoValue, integralFont: integralFont, fractionalFont: fractionalFont, color: item.presentationData.theme.list.itemPrimaryTextColor)
+
+            let (balanceLayout, balanceApply) = makeBalanceTextLayout(TextNodeLayoutArguments(attributedString: amountString, backgroundColor: nil, maximumNumberOfLines: 1, truncationType: .middle, constrainedSize: CGSize(width: constrainedWidth, height: CGFloat.greatestFiniteMagnitude), alignment: .center, cutout: nil, insets: UIEdgeInsets()))
+            
+            let value = "≈$100"
+            let (valueLayout, valueApply) = makeValueTextLayout(TextNodeLayoutArguments(attributedString: NSAttributedString(string: value, font: Font.regular(17.0), textColor: item.presentationData.theme.list.itemSecondaryTextColor), backgroundColor: nil, maximumNumberOfLines: 1, truncationType: .middle, constrainedSize: CGSize(width: constrainedWidth, height: CGFloat.greatestFiniteMagnitude), alignment: .center, cutout: nil, insets: UIEdgeInsets()))
+            
+            var measureText = item.address
+            if measureText.hasSuffix("\n") || measureText.isEmpty {
+               measureText += "|"
+            }
+            let attributedMeasureText = NSAttributedString(string: measureText, font: Font.regular(item.presentationData.fontSize.itemListBaseFontSize), textColor: .black)
+            let attributedText = NSAttributedString(string: item.address, font: Font.regular(item.presentationData.fontSize.itemListBaseFontSize), textColor: item.presentationData.theme.list.itemPrimaryTextColor)
+            let (textLayout, _) = makeTextLayout(TextNodeLayoutArguments(attributedString: attributedMeasureText, backgroundColor: nil, maximumNumberOfLines: 0, truncationType: .end, constrainedSize: CGSize(width: params.width - leftInset - rightInset - 12.0 - 36.0, height: CGFloat.greatestFiniteMagnitude), alignment: .natural, lineSpacing: 0.0, cutout: nil, insets: UIEdgeInsets()))
+            
+            let attributedPlaceholderText = NSAttributedString(string: "Enter your TON address", font: Font.regular(item.presentationData.fontSize.itemListBaseFontSize), textColor: item.presentationData.theme.list.itemPlaceholderTextColor)
+            
+            let verticalInset: CGFloat = 16.0
+            let fieldHeight: CGFloat = max(52.0, textLayout.size.height + 32.0)
+            let fieldSpacing: CGFloat = 16.0
+            let buttonHeight: CGFloat = 50.0
+            
+            var height: CGFloat = verticalInset * 2.0 + balanceLayout.size.height + 7.0
+            if valueLayout.size.height > 0.0 {
+                height += valueLayout.size.height
+                height += fieldHeight + fieldSpacing + buttonHeight
+            }
+
+            switch item.style {
+            case .plain:
+                itemBackgroundColor = item.presentationData.theme.list.plainBackgroundColor
+                itemSeparatorColor = .clear
+                insets = UIEdgeInsets()
+            case .blocks:
+                itemBackgroundColor = item.presentationData.theme.list.itemBlocksBackgroundColor
+                itemSeparatorColor = item.presentationData.theme.list.itemBlocksSeparatorColor
+                insets = itemListNeighborsGroupedInsets(neighbors, params)
+            }
+                        
+            contentSize = CGSize(width: params.width, height: height)
+            
+            let layout = ListViewItemNodeLayout(contentSize: contentSize, insets: insets)
+            
+            return (ListViewItemNodeLayout(contentSize: contentSize, insets: insets), { [weak self] in
+                if let strongSelf = self {
+                    strongSelf.item = item
+                    
+                    let _ = balanceApply()
+                    let _ = valueApply()
+                    
+                    strongSelf.activateArea.frame = CGRect(origin: CGPoint(x: params.leftInset, y: 0.0), size: CGSize(width: params.width - params.leftInset - params.rightInset, height: layout.contentSize.height))
+                    strongSelf.activateArea.accessibilityTraits = []
+                    
+                    if let _ = updatedTheme {
+                        strongSelf.topStripeNode.backgroundColor = itemSeparatorColor
+                        strongSelf.bottomStripeNode.backgroundColor = itemSeparatorColor
+                        strongSelf.backgroundNode.backgroundColor = itemBackgroundColor
+                        strongSelf.fieldNode.image = generateStretchableFilledCircleImage(diameter: 18.0, color: item.presentationData.theme.list.itemInputField.backgroundColor)
+                        
+                        strongSelf.qrButtonNode.setImage(generateTintedImage(image: UIImage(bundleImageName: "Settings/QrButtonIcon"), color: item.presentationData.theme.list.itemAccentColor), for: .normal)
+                    }
+                                                            
+                    switch item.style {
+                    case .plain:
+                        if strongSelf.backgroundNode.supernode != nil {
+                            strongSelf.backgroundNode.removeFromSupernode()
+                        }
+                        if strongSelf.topStripeNode.supernode != nil {
+                            strongSelf.topStripeNode.removeFromSupernode()
+                        }
+                        if strongSelf.bottomStripeNode.supernode == nil {
+                            strongSelf.insertSubnode(strongSelf.bottomStripeNode, at: 0)
+                        }
+                        if strongSelf.maskNode.supernode != nil {
+                            strongSelf.maskNode.removeFromSupernode()
+                        }
+                        strongSelf.bottomStripeNode.frame = CGRect(origin: CGPoint(x: leftInset, y: contentSize.height - separatorHeight), size: CGSize(width: params.width - leftInset, height: separatorHeight))
+                    case .blocks:
+                        if strongSelf.backgroundNode.supernode == nil {
+                            strongSelf.insertSubnode(strongSelf.backgroundNode, at: 0)
+                        }
+                        if strongSelf.topStripeNode.supernode == nil {
+                            strongSelf.insertSubnode(strongSelf.topStripeNode, at: 1)
+                        }
+                        if strongSelf.bottomStripeNode.supernode == nil {
+                            strongSelf.insertSubnode(strongSelf.bottomStripeNode, at: 2)
+                        }
+                        if strongSelf.maskNode.supernode == nil {
+                            strongSelf.insertSubnode(strongSelf.maskNode, at: 3)
+                        }
+                        
+                        let hasCorners = itemListHasRoundedBlockLayout(params)
+                        var hasTopCorners = false
+                        var hasBottomCorners = false
+                        switch neighbors.top {
+                            case .sameSection(false):
+                                strongSelf.topStripeNode.isHidden = true
+                            default:
+                                hasTopCorners = true
+                                strongSelf.topStripeNode.isHidden = hasCorners
+                        }
+                        let bottomStripeInset: CGFloat
+                        switch neighbors.bottom {
+                            case .sameSection(false):
+                                bottomStripeInset = leftInset
+                                strongSelf.bottomStripeNode.isHidden = false
+                            default:
+                                bottomStripeInset = 0.0
+                                hasBottomCorners = true
+                                strongSelf.bottomStripeNode.isHidden = hasCorners
+                        }
+                        
+                        strongSelf.maskNode.image = hasCorners ? PresentationResourcesItemList.cornersImage(item.presentationData.theme, top: hasTopCorners, bottom: hasBottomCorners) : nil
+                        
+                        strongSelf.backgroundNode.frame = CGRect(origin: CGPoint(x: 0.0, y: -min(insets.top, separatorHeight)), size: CGSize(width: params.width, height: contentSize.height + min(insets.top, separatorHeight) + min(insets.bottom, separatorHeight)))
+                        strongSelf.maskNode.frame = strongSelf.backgroundNode.frame.insetBy(dx: params.leftInset, dy: 0.0)
+                        strongSelf.topStripeNode.frame = CGRect(origin: CGPoint(x: 0.0, y: -min(insets.top, separatorHeight)), size: CGSize(width: params.width, height: separatorHeight))
+                        strongSelf.bottomStripeNode.frame = CGRect(origin: CGPoint(x: bottomStripeInset, y: contentSize.height - separatorHeight), size: CGSize(width: params.width - bottomStripeInset, height: separatorHeight))
+                    }
+                    
+                    var emojiItemFrame: CGRect = .zero
+                    var emojiItemSize: CGFloat = 0.0
+                    if let animatedEmoji = item.animatedEmoji {
+                        emojiItemSize = floorToScreenPixels(46.0 * 20.0 / 17.0)
+                        
+                        emojiItemFrame = CGRect(origin: CGPoint(x: -emojiItemSize / 2.0 - 5.0, y: -3.0), size: CGSize()).insetBy(dx: -emojiItemSize / 2.0, dy: -emojiItemSize / 2.0)
+                        emojiItemFrame.origin.x = floorToScreenPixels(emojiItemFrame.origin.x)
+                        emojiItemFrame.origin.y = floorToScreenPixels(emojiItemFrame.origin.y)
+                        
+                        let itemLayer: InlineStickerItemLayer
+                        if let current = strongSelf.animatedEmojiLayer {
+                            itemLayer = current
+                        } else {
+                            let pointSize = floor(emojiItemSize * 1.3)
+                            itemLayer = InlineStickerItemLayer(context: item.context, userLocation: .other, attemptSynchronousLoad: true, emoji: ChatTextInputTextCustomEmojiAttribute(interactivelySelectedFromPackId: nil, fileId: animatedEmoji.fileId.id, file: animatedEmoji, custom: nil), file: animatedEmoji, cache: item.context.animationCache, renderer: item.context.animationRenderer, placeholderColor: item.presentationData.theme.list.mediaPlaceholderColor, pointSize: CGSize(width: pointSize, height: pointSize), dynamicColor: nil)
+                            strongSelf.animatedEmojiLayer = itemLayer
+                            strongSelf.layer.addSublayer(itemLayer)
+                            
+                            itemLayer.isVisibleForAnimations = true
+                        }
+                    }
+                    
+                    let balanceTotalWidth: CGFloat = emojiItemSize + balanceLayout.size.width
+                    let balanceTextFrame = CGRect(origin: CGPoint(x: floorToScreenPixels((params.width - balanceTotalWidth) / 2.0) + emojiItemSize, y: 13.0), size: balanceLayout.size)
+                    strongSelf.balanceTextNode.frame = balanceTextFrame
+                    strongSelf.animatedEmojiLayer?.frame = emojiItemFrame.offsetBy(dx: balanceTextFrame.minX, dy: balanceTextFrame.midY)
+                    
+                    strongSelf.valueTextNode.frame = CGRect(origin: CGPoint(x: floorToScreenPixels((params.width - valueLayout.size.width) / 2.0), y: balanceTextFrame.maxY - 5.0), size: valueLayout.size)
+                    
+                    strongSelf.textNode.textView.autocapitalizationType = .none
+                    strongSelf.textNode.textView.autocorrectionType = .no
+                    strongSelf.textNode.textView.returnKeyType = .done
+                    
+                    if let currentText = strongSelf.textNode.attributedText {
+                        if currentText.string != attributedText.string || updatedTheme != nil {
+                            strongSelf.textNode.attributedText = attributedText
+                        }
+                    } else {
+                        strongSelf.textNode.attributedText = attributedText
+                    }
+                    
+                    if strongSelf.textNode.attributedPlaceholderText == nil || !strongSelf.textNode.attributedPlaceholderText!.isEqual(to: attributedPlaceholderText) {
+                        strongSelf.textNode.attributedPlaceholderText = attributedPlaceholderText
+                    }
+                    strongSelf.textNode.keyboardAppearance = item.presentationData.theme.rootController.keyboardColor.keyboardAppearance
+                    
+                    let textTopInset: CGFloat = 108.0
+                    if strongSelf.animationForKey("apparentHeight") == nil {
+                        strongSelf.backgroundNode.frame = CGRect(origin: CGPoint(x: 0.0, y: -min(insets.top, separatorHeight)), size: CGSize(width: params.width, height: contentSize.height + min(insets.top, separatorHeight) + min(insets.bottom, separatorHeight)))
+                        strongSelf.maskNode.frame = strongSelf.backgroundNode.frame.insetBy(dx: params.leftInset, dy: 0.0)
+                        strongSelf.textClippingNode.frame = CGRect(origin: CGPoint(x: leftInset + 12.0, y: textTopInset + 15.0), size: CGSize(width: params.width - leftInset - rightInset - 12.0 - 36.0, height: textLayout.size.height))
+                    }
+                    strongSelf.textNode.frame = CGRect(origin: CGPoint(), size: CGSize(width: params.width - leftInset - rightInset - 12.0 - 36.0, height: textLayout.size.height + 1.0))
+                    
+                    let fieldFrame = CGRect(origin: CGPoint(x: leftInset, y: textTopInset), size: CGSize(width: params.width - leftInset - rightInset, height: fieldHeight))
+                    strongSelf.fieldNode.frame = fieldFrame
+                    
+                    let qrButtonSize = CGSize(width: 32.0, height: 32.0)
+                    let qrButtonFrame = CGRect(origin: CGPoint(x: fieldFrame.maxX - qrButtonSize.width - 5.0, y: fieldFrame.midY - qrButtonSize.height / 2.0), size: qrButtonSize)
+                    strongSelf.qrButtonNode.frame = qrButtonFrame
+                           
+                    let withdrawButtonNode: SolidRoundedButtonNode
+                    if let currentShareButtonNode = strongSelf.withdrawButtonNode {
+                        withdrawButtonNode = currentShareButtonNode
+                    } else {
+                        var buttonTheme = SolidRoundedButtonTheme(theme: item.presentationData.theme)
+                        buttonTheme = buttonTheme.withUpdated(disabledBackgroundColor: buttonTheme.backgroundColor, disabledForegroundColor: buttonTheme.foregroundColor.withAlphaComponent(0.6))
+                        withdrawButtonNode = SolidRoundedButtonNode(theme: buttonTheme, height: buttonHeight, cornerRadius: 11.0)
+                        withdrawButtonNode.pressed = { [weak self] in
+                            if let self, let item = self.item {
+                                item.withdrawAction()
+                            }
+                        }
+                        strongSelf.addSubnode(withdrawButtonNode)
+                        strongSelf.withdrawButtonNode = withdrawButtonNode
+                    }
+                    if cryptoValue != "0" {
+                        withdrawButtonNode.title = "Transfer \(cryptoValue) TON"
+                    }
+                    withdrawButtonNode.isEnabled = (strongSelf.textNode.attributedText?.string.count ?? 0) == walletAddressLength
+                    
+                    let buttonWidth = contentSize.width - leftInset - rightInset
+                    let _ = withdrawButtonNode.updateLayout(width: buttonWidth, transition: .immediate)
+                    withdrawButtonNode.frame = CGRect(x: leftInset, y: fieldFrame.maxY + fieldSpacing, width: buttonWidth, height: buttonHeight)
+                }
+            })
+        }
+    }
+    
+    public func editableTextNode(_ editableTextNode: ASEditableTextNode, shouldChangeTextIn range: NSRange, replacementText text: String) -> Bool {
+        if let item = self.item {
+            if text.count > 1, let processPaste = item.processPaste {
+                processPaste(text)
+                return false
+            }
+            
+            if let action = item.action, text == "\n" {
+                action()
+                return false
+            }
+            
+            let newText = (editableTextNode.textView.text as NSString).replacingCharacters(in: range, with: text)
+            if !item.shouldUpdateText(newText) {
+                return false
+            }
+        }
+        return true
+    }
+    
+    public func editableTextNodeDidUpdateText(_ editableTextNode: ASEditableTextNode) {
+        if let item = self.item {
+            if let text = self.textNode.attributedText {
+                let updatedText = text.string
+                let updatedAttributedText = NSAttributedString(string: updatedText, font: Font.regular(item.presentationData.fontSize.itemListBaseFontSize), textColor: item.presentationData.theme.list.itemPrimaryTextColor)
+                if text.string != updatedAttributedText.string {
+                    self.textNode.attributedText = updatedAttributedText
+                }
+                self.withdrawButtonNode?.isEnabled = (self.textNode.attributedText?.string.count ?? 0) == walletAddressLength
+                item.textUpdated(updatedText)
+            } else {
+                item.textUpdated("")
+            }
+        }
+    }
+    
+    public func editableTextNodeShouldPaste(_ editableTextNode: ASEditableTextNode) -> Bool {
+        if let _ = self.item {
+            let text: String? = UIPasteboard.general.string
+            if let _ = text {
+                return true
+            }
+        }
+        return false
+    }
+    
+    override public func animateInsertion(_ currentTimestamp: Double, duration: Double, short: Bool) {
+        self.layer.animateAlpha(from: 0.0, to: 1.0, duration: 0.4)
+    }
+    
+    override public func animateAdded(_ currentTimestamp: Double, duration: Double) {
+        self.layer.animateAlpha(from: 0.0, to: 1.0, duration: 0.2)
+    }
+    
+    override public func animateRemoved(_ currentTimestamp: Double, duration: Double) {
+        self.layer.animateAlpha(from: 1.0, to: 0.0, duration: 0.15, removeOnCompletion: false)
+    }
+}

submodules/StatisticsUI/Sources/MonetizationIntroScreen.swift

@@ -0,0 +1,591 @@
+import Foundation
+import UIKit
+import Display
+import ComponentFlow
+import SwiftSignalKit
+import TelegramCore
+import Markdown
+import TextFormat
+import TelegramPresentationData
+import ViewControllerComponent
+import SheetComponent
+import BundleIconComponent
+import BalancedTextComponent
+import MultilineTextComponent
+import MultilineTextWithEntitiesComponent
+import SolidRoundedButtonComponent
+import LottieComponent
+import AccountContext
+
+private final class SheetContent: CombinedComponent {
+    typealias EnvironmentType = ViewControllerComponentContainer.Environment
+    
+    let context: AccountContext
+    let animatedEmojis: [String: TelegramMediaFile]
+    let openMore: () -> Void
+    let dismiss: () -> Void
+    
+    init(
+        context: AccountContext,
+        animatedEmojis: [String: TelegramMediaFile],
+        openMore: @escaping () -> Void,
+        dismiss: @escaping () -> Void
+    ) {
+        self.context = context
+        self.animatedEmojis = animatedEmojis
+        self.openMore = openMore
+        self.dismiss = dismiss
+    }
+    
+    static func ==(lhs: SheetContent, rhs: SheetContent) -> Bool {
+        if lhs.context !== rhs.context {
+            return false
+        }
+        return true
+    }
+    
+    final class State: ComponentState {
+        var cachedIconImage: (UIImage, PresentationTheme)?
+        var cachedChevronImage: (UIImage, PresentationTheme)?
+        
+        let playOnce =  ActionSlot<Void>()
+        private var didPlayAnimation = false
+                
+        func playAnimationIfNeeded() {
+            guard !self.didPlayAnimation else {
+                return
+            }
+            self.didPlayAnimation = true
+            self.playOnce.invoke(Void())
+        }
+    }
+    
+    func makeState() -> State {
+        return State()
+    }
+    
+    static var body: Body {
+        let iconBackground = Child(Image.self)
+        let icon = Child(BundleIconComponent.self)
+        
+        let title = Child(BalancedTextComponent.self)
+        let list = Child(List<Empty>.self)
+        let actionButton = Child(SolidRoundedButtonComponent.self)
+        
+        let infoBackground = Child(RoundedRectangle.self)
+        let infoTitle = Child(MultilineTextWithEntitiesComponent.self)
+        let infoText = Child(MultilineTextComponent.self)
+        
+        return { context in
+            let environment = context.environment[EnvironmentType.self]
+            let component = context.component
+            let state = context.state
+            
+            let theme = environment.theme
+//            let strings = environment.strings
+            
+            let sideInset: CGFloat = 16.0 + environment.safeInsets.left
+            let textSideInset: CGFloat = 30.0 + environment.safeInsets.left
+            
+            let titleFont = Font.semibold(20.0)
+            let textFont = Font.regular(15.0)
+            
+            let textColor = theme.actionSheet.primaryTextColor
+            let secondaryTextColor = theme.actionSheet.secondaryTextColor
+            let linkColor = theme.actionSheet.controlAccentColor
+            
+            let markdownAttributes = MarkdownAttributes(body: MarkdownAttributeSet(font: textFont, textColor: textColor), bold: MarkdownAttributeSet(font: textFont, textColor: textColor), link: MarkdownAttributeSet(font: textFont, textColor: linkColor), linkAttribute: { contents in
+                return (TelegramTextAttributes.URL, contents)
+            })
+            
+            //TODO:localize
+            
+            let spacing: CGFloat = 16.0
+            var contentSize = CGSize(width: context.availableSize.width, height: 32.0)
+                                    
+            let iconSize = CGSize(width: 90.0, height: 90.0)
+            let gradientImage: UIImage
+                            
+            if let (current, currentTheme) = state.cachedIconImage, currentTheme === theme {
+                gradientImage = current
+            } else {
+                gradientImage = generateGradientFilledCircleImage(diameter: iconSize.width, colors: [
+                    UIColor(rgb: 0x4bbb45).cgColor,
+                    UIColor(rgb: 0x9ad164).cgColor
+                ])!
+                context.state.cachedIconImage = (gradientImage, theme)
+            }
+            
+            let iconBackground = iconBackground.update(
+                component: Image(image: gradientImage),
+                availableSize: iconSize,
+                transition: .immediate
+            )
+            context.add(iconBackground
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + iconBackground.size.height / 2.0))
+            )
+            
+            let icon = icon.update(
+                component: BundleIconComponent(name: "Chart/Monetization", tintColor: theme.list.itemCheckColors.foregroundColor),
+                availableSize: CGSize(width: 90, height: 90),
+                transition: .immediate
+            )
+            
+            context.add(icon
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + iconBackground.size.height / 2.0))
+            )
+            contentSize.height += iconSize.height
+            contentSize.height += spacing + 5.0
+            
+            let title = title.update(
+                component: BalancedTextComponent(
+                    text: .plain(NSAttributedString(string: "Earn From Your Channel", font: titleFont, textColor: textColor)),
+                    horizontalAlignment: .center,
+                    maximumNumberOfLines: 0,
+                    lineSpacing: 0.1
+                ),
+                availableSize: CGSize(width: context.availableSize.width - textSideInset * 2.0, height: context.availableSize.height),
+                transition: .immediate
+            )
+            context.add(title
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + title.size.height / 2.0))
+            )
+            contentSize.height += title.size.height
+            contentSize.height += spacing
+            
+            
+            var items: [AnyComponentWithIdentity<Empty>] = []
+            items.append(
+                AnyComponentWithIdentity(
+                    id: "ads",
+                    component: AnyComponent(ParagraphComponent(
+                        title: "Telegram Ads",
+                        titleColor: textColor,
+                        text: "Telegram can display ads in your channel.",
+                        textColor: secondaryTextColor,
+                        iconName: "Chart/Ads",
+                        iconColor: linkColor
+                    ))
+                )
+            )
+            items.append(
+                AnyComponentWithIdentity(
+                    id: "split",
+                    component: AnyComponent(ParagraphComponent(
+                        title: "50:50 Revenue Split",
+                        titleColor: textColor,
+                        text: "You receive 50% of the ad revenue in TON.",
+                        textColor: secondaryTextColor,
+                        iconName: "Chart/Split",
+                        iconColor: linkColor
+                    ))
+                )
+            )
+            items.append(
+                AnyComponentWithIdentity(
+                    id: "withdrawal",
+                    component: AnyComponent(ParagraphComponent(
+                        title: "Flexible Withdrawals",
+                        titleColor: textColor,
+                        text: "You can withdraw your TON any time.",
+                        textColor: secondaryTextColor,
+                        iconName: "Chart/Withdrawal",
+                        iconColor: linkColor
+                    ))
+                )
+            )
+            
+            let list = list.update(
+                component: List(items),
+                availableSize: CGSize(width: context.availableSize.width - sideInset, height: 10000.0),
+                transition: context.transition
+            )
+            context.add(list
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + list.size.height / 2.0))
+            )
+            contentSize.height += list.size.height
+            contentSize.height += spacing - 9.0
+            
+            let infoTitleString = "What's #TON?"//.replacingOccurrences(of: "#", with: "# ")
+            let infoTitleAttributedString = NSMutableAttributedString(string: infoTitleString, font: titleFont, textColor: textColor)
+            let range = (infoTitleAttributedString.string as NSString).range(of: "#")
+            if range.location != NSNotFound, let emojiFile = component.animatedEmojis["💎"] {
+                infoTitleAttributedString.addAttribute(ChatTextInputAttributes.customEmoji, value: ChatTextInputTextCustomEmojiAttribute(interactivelySelectedFromPackId: nil, fileId: emojiFile.fileId.id, file: emojiFile), range: range)
+            }
+            let infoTitle = infoTitle.update(
+                component: MultilineTextWithEntitiesComponent(
+                    context: component.context,
+                    animationCache: component.context.animationCache,
+                    animationRenderer: component.context.animationRenderer,
+                    placeholderColor: environment.theme.list.mediaPlaceholderColor,
+                    text: .plain(infoTitleAttributedString),
+                    horizontalAlignment: .center
+                ),
+                availableSize: CGSize(width: context.availableSize.width - textSideInset * 2.0, height: context.availableSize.height),
+                transition: .immediate
+            )
+            
+            if state.cachedChevronImage == nil || state.cachedChevronImage?.1 !== environment.theme {
+                state.cachedChevronImage = (generateTintedImage(image: UIImage(bundleImageName: "Settings/TextArrowRight"), color: linkColor)!, theme)
+            }
+            
+            let infoString = "TON is a blockchain platform and cryptocurrency that Telegram uses for its record scalability and ultra low commissions on transactions.\n[Learn More >]()"
+            let infoAttributedString = parseMarkdownIntoAttributedString(infoString, attributes: markdownAttributes).mutableCopy() as! NSMutableAttributedString
+            if let range = infoAttributedString.string.range(of: ">"), let chevronImage = state.cachedChevronImage?.0 {
+                infoAttributedString.addAttribute(.attachment, value: chevronImage, range: NSRange(range, in: infoAttributedString.string))
+            }
+            let infoText = infoText.update(
+                component: MultilineTextComponent(
+                    text: .plain(infoAttributedString),
+                    horizontalAlignment: .center,
+                    maximumNumberOfLines: 0,
+                    lineSpacing: 0.2
+                ),
+                availableSize: CGSize(width: context.availableSize.width - (textSideInset + sideInset - 2.0) * 2.0, height: context.availableSize.height),
+                transition: .immediate
+            )
+            
+            let infoPadding: CGFloat = 17.0
+            let infoSpacing: CGFloat = 12.0
+            let totalInfoHeight = infoPadding + infoTitle.size.height + infoSpacing + infoText.size.height + infoPadding
+            
+            let infoBackground = infoBackground.update(
+                component: RoundedRectangle(
+                    color: theme.list.blocksBackgroundColor,
+                    cornerRadius: 10.0
+                ),
+                availableSize: CGSize(width: context.availableSize.width - sideInset * 2.0, height: totalInfoHeight),
+                transition: .immediate
+            )
+            context.add(infoBackground
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + infoBackground.size.height / 2.0))
+            )
+            contentSize.height += infoPadding
+            
+            context.add(infoTitle
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + infoTitle.size.height / 2.0))
+            )
+            contentSize.height += infoTitle.size.height
+            contentSize.height += infoSpacing
+            
+            context.add(infoText
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + infoText.size.height / 2.0))
+            )
+            contentSize.height += infoText.size.height
+            contentSize.height += infoPadding
+            contentSize.height += spacing
+            
+            let actionButton = actionButton.update(
+                component: SolidRoundedButtonComponent(
+                    title: "Understood",
+                    theme: SolidRoundedButtonComponent.Theme(
+                        backgroundColor: theme.list.itemCheckColors.fillColor,
+                        backgroundColors: [],
+                        foregroundColor: theme.list.itemCheckColors.foregroundColor
+                    ),
+                    font: .bold,
+                    fontSize: 17.0,
+                    height: 50.0,
+                    cornerRadius: 10.0,
+                    gloss: false,
+                    iconName: nil,
+                    animationName: nil,
+                    iconPosition: .left,
+                    action: {
+                        component.dismiss()
+                    }
+                ),
+                availableSize: CGSize(width: context.availableSize.width - sideInset * 2.0, height: 50.0),
+                transition: context.transition
+            )
+            context.add(actionButton
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + actionButton.size.height / 2.0))
+            )
+            contentSize.height += actionButton.size.height
+            contentSize.height += 22.0
+                        
+            contentSize.height += environment.safeInsets.bottom
+            
+            state.playAnimationIfNeeded()
+            
+            return contentSize
+        }
+    }
+}
+
+private final class SheetContainerComponent: CombinedComponent {
+    typealias EnvironmentType = ViewControllerComponentContainer.Environment
+    
+    let context: AccountContext
+    let animatedEmojis: [String: TelegramMediaFile]
+    let openMore: () -> Void
+    
+    init(
+        context: AccountContext,
+        animatedEmojis: [String: TelegramMediaFile],
+        openMore: @escaping () -> Void
+    ) {
+        self.context = context
+        self.animatedEmojis = animatedEmojis
+        self.openMore = openMore
+    }
+    
+    static func ==(lhs: SheetContainerComponent, rhs: SheetContainerComponent) -> Bool {
+        if lhs.context !== rhs.context {
+            return false
+        }
+        return true
+    }
+    
+    static var body: Body {
+        let sheet = Child(SheetComponent<EnvironmentType>.self)
+        let animateOut = StoredActionSlot(Action<Void>.self)
+        
+        let sheetExternalState = SheetComponent<EnvironmentType>.ExternalState()
+        
+        return { context in
+            let environment = context.environment[EnvironmentType.self]
+            
+            let controller = environment.controller
+            
+            let sheet = sheet.update(
+                component: SheetComponent<EnvironmentType>(
+                    content: AnyComponent<EnvironmentType>(SheetContent(
+                        context: context.component.context,
+                        animatedEmojis: context.component.animatedEmojis,
+                        openMore: context.component.openMore,
+                        dismiss: {
+                            animateOut.invoke(Action { _ in
+                                if let controller = controller() {
+                                    controller.dismiss(completion: nil)
+                                }
+                            })
+                        }
+                    )),
+                    backgroundColor: .color(environment.theme.actionSheet.opaqueItemBackgroundColor),
+                    followContentSizeChanges: true,
+                    externalState: sheetExternalState,
+                    animateOut: animateOut
+                ),
+                environment: {
+                    environment
+                    SheetComponentEnvironment(
+                        isDisplaying: environment.value.isVisible,
+                        isCentered: environment.metrics.widthClass == .regular,
+                        hasInputHeight: !environment.inputHeight.isZero,
+                        regularMetricsSize: CGSize(width: 430.0, height: 900.0),
+                        dismiss: { animated in
+                            if animated {
+                                animateOut.invoke(Action { _ in
+                                    if let controller = controller() {
+                                        controller.dismiss(completion: nil)
+                                    }
+                                })
+                            } else {
+                                if let controller = controller() {
+                                    controller.dismiss(completion: nil)
+                                }
+                            }
+                        }
+                    )
+                },
+                availableSize: context.availableSize,
+                transition: context.transition
+            )
+            
+            context.add(sheet
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: context.availableSize.height / 2.0))
+            )
+            
+            if let controller = controller(), !controller.automaticallyControlPresentationContextLayout {
+                let layout = ContainerViewLayout(
+                    size: context.availableSize,
+                    metrics: environment.metrics,
+                    deviceMetrics: environment.deviceMetrics,
+                    intrinsicInsets: UIEdgeInsets(top: 0.0, left: 0.0, bottom: max(environment.safeInsets.bottom, sheetExternalState.contentHeight), right: 0.0),
+                    safeInsets: UIEdgeInsets(top: 0.0, left: environment.safeInsets.left, bottom: 0.0, right: environment.safeInsets.right),
+                    additionalInsets: .zero,
+                    statusBarHeight: environment.statusBarHeight,
+                    inputHeight: nil,
+                    inputHeightIsInteractivellyChanging: false,
+                    inVoiceOver: false
+                )
+                controller.presentationContext.containerLayoutUpdated(layout, transition: context.transition.containedViewLayoutTransition)
+            }
+            
+            return context.availableSize
+        }
+    }
+}
+
+
+final class MonetizationIntroScreen: ViewControllerComponentContainer {
+    private let context: AccountContext
+    private let animatedEmojis: [String: TelegramMediaFile]
+    private var openMore: (() -> Void)?
+        
+    init(
+        context: AccountContext,
+        animatedEmojis: [String: TelegramMediaFile],
+        openMore: @escaping () -> Void
+    ) {
+        self.context = context
+        self.animatedEmojis = animatedEmojis
+        self.openMore = openMore
+                
+        super.init(
+            context: context,
+            component: SheetContainerComponent(
+                context: context,
+                animatedEmojis: animatedEmojis,
+                openMore: openMore
+            ),
+            navigationBarAppearance: .none,
+            statusBarStyle: .ignore,
+            theme: .default
+        )
+        
+        self.navigationPresentation = .flatModal
+    }
+    
+    required public init(coder aDecoder: NSCoder) {
+        fatalError("init(coder:) has not been implemented")
+    }
+    
+    override func viewDidLoad() {
+        super.viewDidLoad()
+        
+        self.view.disablesInteractiveModalDismiss = true
+    }
+    
+    func dismissAnimated() {
+        if let view = self.node.hostView.findTaggedView(tag: SheetComponent<ViewControllerComponentContainer.Environment>.View.Tag()) as? SheetComponent<ViewControllerComponentContainer.Environment>.View {
+            view.dismissAnimated()
+        }
+    }
+}
+
+private final class ParagraphComponent: CombinedComponent {
+    let title: String
+    let titleColor: UIColor
+    let text: String
+    let textColor: UIColor
+    let iconName: String
+    let iconColor: UIColor
+    
+    public init(
+        title: String,
+        titleColor: UIColor,
+        text: String,
+        textColor: UIColor,
+        iconName: String,
+        iconColor: UIColor
+    ) {
+        self.title = title
+        self.titleColor = titleColor
+        self.text = text
+        self.textColor = textColor
+        self.iconName = iconName
+        self.iconColor = iconColor
+    }
+    
+    static func ==(lhs: ParagraphComponent, rhs: ParagraphComponent) -> Bool {
+        if lhs.title != rhs.title {
+            return false
+        }
+        if lhs.titleColor != rhs.titleColor {
+            return false
+        }
+        if lhs.text != rhs.text {
+            return false
+        }
+        if lhs.textColor != rhs.textColor {
+            return false
+        }
+        if lhs.iconName != rhs.iconName {
+            return false
+        }
+        if lhs.iconColor != rhs.iconColor {
+            return false
+        }
+        return true
+    }
+    
+    static var body: Body {
+        let title = Child(MultilineTextComponent.self)
+        let text = Child(MultilineTextComponent.self)
+        let icon = Child(BundleIconComponent.self)
+        
+        return { context in
+            let component = context.component
+            
+            let leftInset: CGFloat = 64.0
+            let rightInset: CGFloat = 32.0
+            let textSideInset: CGFloat = leftInset + 8.0
+            let spacing: CGFloat = 5.0
+            
+            let textTopInset: CGFloat = 9.0
+            
+            let title = title.update(
+                component: MultilineTextComponent(
+                    text: .plain(NSAttributedString(
+                        string: component.title,
+                        font: Font.semibold(15.0),
+                        textColor: component.titleColor,
+                        paragraphAlignment: .natural
+                    )),
+                    horizontalAlignment: .center,
+                    maximumNumberOfLines: 1
+                ),
+                availableSize: CGSize(width: context.availableSize.width - leftInset - rightInset, height: CGFloat.greatestFiniteMagnitude),
+                transition: .immediate
+            )
+            
+            let textFont = Font.regular(15.0)
+            let boldTextFont = Font.semibold(15.0)
+            let textColor = component.textColor
+            let markdownAttributes = MarkdownAttributes(
+                body: MarkdownAttributeSet(font: textFont, textColor: textColor),
+                bold: MarkdownAttributeSet(font: boldTextFont, textColor: textColor),
+                link: MarkdownAttributeSet(font: textFont, textColor: textColor),
+                linkAttribute: { _ in
+                    return nil
+                }
+            )
+                        
+            let text = text.update(
+                component: MultilineTextComponent(
+                    text: .markdown(text: component.text, attributes: markdownAttributes),
+                    horizontalAlignment: .natural,
+                    maximumNumberOfLines: 0,
+                    lineSpacing: 0.2
+                ),
+                availableSize: CGSize(width: context.availableSize.width - leftInset - rightInset, height: context.availableSize.height),
+                transition: .immediate
+            )
+            
+            let icon = icon.update(
+                component: BundleIconComponent(
+                    name: component.iconName,
+                    tintColor: component.iconColor
+                ),
+                availableSize: CGSize(width: context.availableSize.width, height: context.availableSize.height),
+                transition: .immediate
+            )
+         
+            context.add(title
+                .position(CGPoint(x: textSideInset + title.size.width / 2.0, y: textTopInset + title.size.height / 2.0))
+            )
+            
+            context.add(text
+                .position(CGPoint(x: textSideInset + text.size.width / 2.0, y: textTopInset + title.size.height + spacing + text.size.height / 2.0))
+            )
+            
+            context.add(icon
+                .position(CGPoint(x: 47.0, y: textTopInset + 18.0))
+            )
+        
+            return CGSize(width: context.availableSize.width, height: textTopInset + title.size.height + text.size.height + 20.0)
+        }
+    }
+}

submodules/StatisticsUI/Sources/MonetizationUtils.swift

@@ -0,0 +1,62 @@
+import Foundation
+import UIKit
+
+let walletAddressLength: Int = 48
+
+func formatAddress(_ address: String) -> String {
+    var address = address
+    address.insert("\n", at: address.index(address.startIndex, offsetBy: address.count / 2))
+    return address
+}
+
+func formatBalanceText(_ value: Int64, decimalSeparator: String, showPlus: Bool = false) -> String {
+    var balanceText = "\(abs(value))"
+    while balanceText.count < 10 {
+        balanceText.insert("0", at: balanceText.startIndex)
+    }
+    balanceText.insert(contentsOf: decimalSeparator, at: balanceText.index(balanceText.endIndex, offsetBy: -9))
+    while true {
+        if balanceText.hasSuffix("0") {
+            if balanceText.hasSuffix("\(decimalSeparator)0") {
+                balanceText.removeLast()
+                balanceText.removeLast()
+                break
+            } else {
+                balanceText.removeLast()
+            }
+        } else {
+            break
+        }
+    }
+    if value < 0 {
+        balanceText.insert("-", at: balanceText.startIndex)
+    } else if showPlus {
+        balanceText.insert("+", at: balanceText.startIndex)
+    }
+    return balanceText
+}
+
+private let invalidAddressCharacters = CharacterSet(charactersIn: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_=").inverted
+func isValidAddress(_ address: String, exactLength: Bool = false) -> Bool {
+    if address.count > walletAddressLength || address.rangeOfCharacter(from: invalidAddressCharacters) != nil {
+        return false
+    }
+    if exactLength && address.count != walletAddressLength {
+        return false
+    }
+    return true
+}
+
+private let amountDelimeterCharacters = CharacterSet(charactersIn: "0123456789-+").inverted
+func amountAttributedString(_ string: String, integralFont: UIFont, fractionalFont: UIFont, color: UIColor) -> NSAttributedString {
+    let result = NSMutableAttributedString()
+    if let range = string.rangeOfCharacter(from: amountDelimeterCharacters) {
+        let integralPart = String(string[..<range.lowerBound])
+        let fractionalPart = String(string[range.lowerBound...])
+        result.append(NSAttributedString(string: integralPart, font: integralFont, textColor: color))
+        result.append(NSAttributedString(string: fractionalPart, font: fractionalFont, textColor: color))
+    } else {
+        result.append(NSAttributedString(string: string, font: integralFont, textColor: color))
+    }
+    return result
+}

submodules/StatisticsUI/Sources/StatsOverviewItem.swift

@@ -7,6 +7,9 @@ import TelegramCore
 import TelegramPresentationData
 import ItemListUI
 import PresentationDataUtils
+import EmojiTextAttachmentView
+import TextFormat
+import AccountContext
 
 protocol Stats {
     
@@ -32,21 +35,29 @@ extension StoryStats: Stats {
     
 }
 
+extension MonetizationStats: Stats {
+    
+}
+
 class StatsOverviewItem: ListViewItem, ItemListItem {
+    let context: AccountContext
     let presentationData: ItemListPresentationData
     let isGroup: Bool
     let stats: Stats
     let storyViews: EngineStoryItem.Views?
     let publicShares: Int32?
+    let animatedEmoji: TelegramMediaFile?
     let sectionId: ItemListSectionId
     let style: ItemListStyle
     
-    init(presentationData: ItemListPresentationData, isGroup: Bool, stats: Stats, storyViews: EngineStoryItem.Views? = nil, publicShares: Int32? = nil, sectionId: ItemListSectionId, style: ItemListStyle) {
+    init(context: AccountContext, presentationData: ItemListPresentationData, isGroup: Bool, stats: Stats, storyViews: EngineStoryItem.Views? = nil, publicShares: Int32? = nil, animatedEmoji: TelegramMediaFile? = nil, sectionId: ItemListSectionId, style: ItemListStyle) {
+        self.context = context
         self.presentationData = presentationData
         self.isGroup = isGroup
         self.stats = stats
         self.storyViews = storyViews
         self.publicShares = publicShares
+        self.animatedEmoji = animatedEmoji
         self.sectionId = sectionId
         self.style = style
     }
@@ -97,6 +108,7 @@ private final class ValueItemNode: ASDisplayNode {
     private let valueNode: TextNode
     private let titleNode: TextNode
     private let deltaNode: TextNode
+    private var animatedEmojiLayer: InlineStickerItemLayer?
     
     var currentBackgroundColor: UIColor?
     var pressed: (() -> Void)?
@@ -115,13 +127,13 @@ private final class ValueItemNode: ASDisplayNode {
         self.addSubnode(self.deltaNode)
     }
             
-    static func asyncLayout(_ current: ValueItemNode?) -> (_ width: CGFloat, _ presentationData: ItemListPresentationData, _ value: String, _ title: String, _ delta: (String, DeltaColor)?) -> (CGSize, () -> ValueItemNode) {
+    static func asyncLayout(_ current: ValueItemNode?) -> (_ context: AccountContext, _ width: CGFloat, _ presentationData: ItemListPresentationData, _ value: String, _ title: String, _ delta: (String, DeltaColor)?, _ animatedEmoji: TelegramMediaFile?) -> (CGSize, () -> ValueItemNode) {
         
         let maybeMakeValueLayout = (current?.valueNode).flatMap(TextNode.asyncLayout)
         let maybeMakeTitleLayout = (current?.titleNode).flatMap(TextNode.asyncLayout)
         let maybeMakeDeltaLayout = (current?.deltaNode).flatMap(TextNode.asyncLayout)
         
-        return { width, presentationData, value, title, delta in
+        return { context, width, presentationData, value, title, delta, animatedEmoji in
             let targetNode: ValueItemNode
             if let current = current {
                 targetNode = current
@@ -150,7 +162,8 @@ private final class ValueItemNode: ASDisplayNode {
                 makeDeltaLayout = TextNode.asyncLayout(targetNode.deltaNode)
             }
                         
-            let valueFont = Font.semibold(presentationData.fontSize.itemListBaseFontSize)
+            let fontSize = presentationData.fontSize.itemListBaseFontSize
+            let valueFont = Font.semibold(fontSize)
             let titleFont = Font.regular(presentationData.fontSize.itemListBaseHeaderFontSize)
             let deltaFont = Font.regular(presentationData.fontSize.itemListBaseHeaderFontSize)
         
@@ -170,6 +183,7 @@ private final class ValueItemNode: ASDisplayNode {
             } else {
                 deltaColor = presentationData.theme.list.freeTextErrorColor
             }
+            let placeholderColor = presentationData.theme.list.mediaPlaceholderColor
             
             let constrainedSize = CGSize(width: width, height: CGFloat.greatestFiniteMagnitude)
             let (valueLayout, valueApply) = makeValueLayout(TextNodeLayoutArguments(attributedString: NSAttributedString(string: value, font: valueFont, textColor: valueColor), backgroundColor: nil, maximumNumberOfLines: 1, truncationType: .end, constrainedSize: constrainedSize, alignment: .natural, cutout: nil, insets: UIEdgeInsets()))
@@ -185,9 +199,33 @@ private final class ValueItemNode: ASDisplayNode {
                 let _ = titleApply()
                 let _ = deltaApply()
                 
-                let valueFrame = CGRect(origin: .zero, size: valueLayout.size)
+                var valueOffset: CGFloat = 0.0
+                if let animatedEmoji {
+                    let itemSize = floorToScreenPixels(fontSize * 20.0 / 17.0)
+                    
+                    var itemFrame = CGRect(origin: CGPoint(x: itemSize / 2.0 - 1.0, y: itemSize / 2.0), size: CGSize()).insetBy(dx: -itemSize / 2.0, dy: -itemSize / 2.0)
+                    itemFrame.origin.x = floorToScreenPixels(itemFrame.origin.x)
+                    itemFrame.origin.y = floorToScreenPixels(itemFrame.origin.y)
+                    
+                    let itemLayer: InlineStickerItemLayer
+                    if let current = targetNode.animatedEmojiLayer {
+                        itemLayer = current
+                    } else {
+                        let pointSize = floor(itemSize * 1.3)
+                        itemLayer = InlineStickerItemLayer(context: context, userLocation: .other, attemptSynchronousLoad: true, emoji: ChatTextInputTextCustomEmojiAttribute(interactivelySelectedFromPackId: nil, fileId: animatedEmoji.fileId.id, file: animatedEmoji, custom: nil), file: animatedEmoji, cache: context.animationCache, renderer: context.animationRenderer, placeholderColor: placeholderColor, pointSize: CGSize(width: pointSize, height: pointSize), dynamicColor: nil)
+                        targetNode.animatedEmojiLayer = itemLayer
+                        targetNode.layer.addSublayer(itemLayer)
+                        
+                        itemLayer.isVisibleForAnimations = true
+                    }
+                    valueOffset += 22.0
+                    
+                    itemLayer.frame = itemFrame
+                }
+                
+                let valueFrame = CGRect(origin: CGPoint(x: valueOffset, y: 0.0), size: valueLayout.size)
                 let titleFrame = CGRect(origin: CGPoint(x: 0.0, y: valueFrame.maxY), size: titleLayout.size)
-                let deltaFrame = CGRect(origin: CGPoint(x: valueFrame.maxX + horizontalSpacing, y: valueFrame.maxY - deltaLayout.size.height - 2.0), size: deltaLayout.size)
+                let deltaFrame = CGRect(origin: CGPoint(x: valueFrame.maxX + horizontalSpacing, y: valueFrame.maxY - deltaLayout.size.height - 2.0 - UIScreenPixel), size: deltaLayout.size)
                 
                 targetNode.valueNode.frame = valueFrame
                 targetNode.titleNode.frame = titleFrame
@@ -296,7 +334,7 @@ class StatsOverviewItemNode: ListViewItemNode {
                     insets = itemListNeighborsGroupedInsets(neighbors, params)
             }
             
-            let twoColumnLayout = "".isEmpty
+            var twoColumnLayout = true
             
             var topLeftItemLayoutAndApply: (CGSize, () -> ValueItemNode)?
             var topRightItemLayoutAndApply: (CGSize, () -> ValueItemNode)?
@@ -321,78 +359,96 @@ class StatsOverviewItemNode: ListViewItemNode {
             
             if let stats = item.stats as? MessageStats {
                 topLeftItemLayoutAndApply = makeTopLeftItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     compactNumericCountString(stats.views),
                     item.presentationData.strings.Stats_Message_Views,
+                    nil,
                     nil
                 )
                 
                 topRightItemLayoutAndApply = makeTopRightItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     item.publicShares.flatMap { compactNumericCountString(Int($0)) } ?? "–",
                     item.presentationData.strings.Stats_Message_PublicShares,
+                    nil,
                     nil
                 )
                 
                 middle1LeftItemLayoutAndApply = makeMiddle1LeftItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     compactNumericCountString(stats.reactions),
                     item.presentationData.strings.Stats_Message_Reactions,
+                    nil,
                     nil
                 )
                 
                 middle1RightItemLayoutAndApply = makeMiddle1RightItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     item.publicShares.flatMap { "≈\( compactNumericCountString(max(0, stats.forwards - Int($0))))" } ?? "–",
                     item.presentationData.strings.Stats_Message_PrivateShares,
+                    nil,
                     nil
                 )
                 
                 height += topRightItemLayoutAndApply!.0.height * 2.0 + verticalSpacing
             } else if let _ = item.stats as? StoryStats, let views = item.storyViews {
                 topLeftItemLayoutAndApply = makeTopLeftItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     compactNumericCountString(views.seenCount),
                     item.presentationData.strings.Stats_Message_Views,
+                    nil,
                     nil
                 )
                 
                 topRightItemLayoutAndApply = makeTopRightItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     item.publicShares.flatMap { compactNumericCountString(Int($0)) } ?? "–",
                     item.presentationData.strings.Stats_Message_PublicShares,
+                    nil,
                     nil
                 )
                 
                 middle1LeftItemLayoutAndApply = makeMiddle1LeftItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     compactNumericCountString(views.reactedCount),
                     item.presentationData.strings.Stats_Message_Reactions,
+                    nil,
                     nil
                 )
                 
                 middle1RightItemLayoutAndApply = makeMiddle1RightItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     item.publicShares.flatMap { "≈\( compactNumericCountString(max(0, views.forwardCount - Int($0))))" } ?? "–",
                     item.presentationData.strings.Stats_Message_PrivateShares,
+                    nil,
                     nil
                 )
                 
                 height += topRightItemLayoutAndApply!.0.height * 2.0 + verticalSpacing
             } else if let stats = item.stats as? ChannelBoostStatus {
                 topLeftItemLayoutAndApply = makeTopLeftItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     "\(stats.level)",
                     item.presentationData.strings.Stats_Boosts_Level,
+                    nil,
                     nil
                 )
                 
@@ -402,18 +458,22 @@ class StatsOverviewItemNode: ListViewItemNode {
                 }
                 
                 topRightItemLayoutAndApply = makeTopRightItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     "≈\(Int(stats.premiumAudience?.value ?? 0))",
                     item.isGroup ? item.presentationData.strings.Stats_Boosts_PremiumMembers : item.presentationData.strings.Stats_Boosts_PremiumSubscribers,
-                    (String(format: "%.02f%%", premiumSubscribers * 100.0), .generic)
+                    (String(format: "%.02f%%", premiumSubscribers * 100.0), .generic),
+                    nil
                 )
                 
                 middle1LeftItemLayoutAndApply = makeMiddle1LeftItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     "\(stats.boosts)",
                     item.presentationData.strings.Stats_Boosts_ExistingBoosts,
+                    nil,
                     nil
                 )
                 
@@ -424,10 +484,12 @@ class StatsOverviewItemNode: ListViewItemNode {
                     boostsLeft = 0
                 }
                 middle1RightItemLayoutAndApply = makeMiddle1RightItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     "\(boostsLeft)",
                     item.presentationData.strings.Stats_Boosts_BoostsToLevelUp,
+                    nil,
                     nil
                 )
                 
@@ -447,11 +509,13 @@ class StatsOverviewItemNode: ListViewItemNode {
                 
                 let followersDelta = deltaText(stats.followers)
                 topLeftItemLayoutAndApply = makeTopLeftItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     compactNumericCountString(Int(stats.followers.current)),
                     item.presentationData.strings.Stats_Followers,
-                    (followersDelta.text, followersDelta.positive ? .positive : .negative)
+                    (followersDelta.text, followersDelta.positive ? .positive : .negative),
+                    nil
                 )
                 
                 var enabledNotifications: Double = 0.0
@@ -459,10 +523,12 @@ class StatsOverviewItemNode: ListViewItemNode {
                     enabledNotifications = stats.enabledNotifications.value / stats.enabledNotifications.total
                 }
                 topRightItemLayoutAndApply = makeTopRightItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     String(format: "%.02f%%", enabledNotifications * 100.0),
                     item.presentationData.strings.Stats_EnabledNotifications,
+                    nil,
                     nil
                 )
                 
@@ -516,56 +582,68 @@ class StatsOverviewItemNode: ListViewItemNode {
                 
                 if let (value, title, delta) = items[0] {
                     middle1LeftItemLayoutAndApply = makeMiddle1LeftItemLayout(
+                        item.context,
                         params.width,
                         item.presentationData,
                         value,
                         title,
-                        delta
+                        delta,
+                        nil
                     )
                 }
                 if let (value, title, delta) = items[1] {
                     middle1RightItemLayoutAndApply = makeMiddle1RightItemLayout(
+                        item.context,
                         params.width,
                         item.presentationData,
                         value,
                         title,
-                        delta
+                        delta,
+                        nil
                     )
                 }
                 if let (value, title, delta) = items[2] {
                     middle2LeftItemLayoutAndApply = makeMiddle2LeftItemLayout(
+                        item.context,
                         params.width,
                         item.presentationData,
                         value,
                         title,
-                        delta
+                        delta,
+                        nil
                     )
                 }
                 if let (value, title, delta) = items[3] {
                     middle2RightItemLayoutAndApply = makeMiddle2RightItemLayout(
+                        item.context,
                         params.width,
                         item.presentationData,
                         value,
                         title,
-                        delta
+                        delta,
+                        nil
                     )
                 }
                 if let (value, title, delta) = items[4] {
                     bottomLeftItemLayoutAndApply = makeBottomLeftItemLayout(
+                        item.context,
                         params.width,
                         item.presentationData,
                         value,
                         title,
-                        delta
+                        delta,
+                        nil
                     )
                 }
                 if let (value, title, delta) = items[5] {
                     bottomRightItemLayoutAndApply = makeBottomRightItemLayout(
+                        item.context,
                         params.width,
                         item.presentationData,
                         value,
                         title,
-                        delta
+                        delta,
+                        nil
                     )
                 }
 
@@ -583,37 +661,45 @@ class StatsOverviewItemNode: ListViewItemNode {
 
                 let membersDelta = deltaText(stats.members)
                 topLeftItemLayoutAndApply = makeTopLeftItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     compactNumericCountString(Int(stats.members.current)),
                     item.presentationData.strings.Stats_GroupMembers,
-                    (membersDelta.text, membersDelta.positive ? .positive : .negative)
+                    (membersDelta.text, membersDelta.positive ? .positive : .negative),
+                    nil
                 )
                 
                 let messagesDelta = deltaText(stats.messages)
                 topRightItemLayoutAndApply = makeTopRightItemLayout(
+                    item.context,
                     params.width,
                     item.presentationData,
                     compactNumericCountString(Int(stats.messages.current)),
                     item.presentationData.strings.Stats_GroupMessages,
-                    (messagesDelta.text, messagesDelta.positive ? .positive : .negative)
+                    (messagesDelta.text, messagesDelta.positive ? .positive : .negative),
+                    nil
                 )
                 
                 if displayBottomRow {
                     middle1LeftItemLayoutAndApply = makeMiddle1LeftItemLayout(
+                        item.context,
                         params.width,
                         item.presentationData,
                         compactNumericCountString(Int(stats.viewers.current)),
                         item.presentationData.strings.Stats_GroupViewers,
-                        (viewersDelta.text, viewersDelta.positive ? .positive : .negative)
+                        (viewersDelta.text, viewersDelta.positive ? .positive : .negative),
+                        nil
                     )
                     
                     middle1RightItemLayoutAndApply = makeMiddle1RightItemLayout(
+                        item.context,
                         params.width,
                         item.presentationData,
                         compactNumericCountString(Int(stats.posters.current)),
                         item.presentationData.strings.Stats_GroupPosters,
-                        (postersDelta.text, postersDelta.positive ? .positive : .negative)
+                        (postersDelta.text, postersDelta.positive ? .positive : .negative),
+                        nil
                     )
                 }
                 
@@ -622,6 +708,40 @@ class StatsOverviewItemNode: ListViewItemNode {
                 } else {
                     height += topLeftItemLayoutAndApply!.0.height * 4.0 + verticalSpacing * 3.0
                 }
+            } else if let _ = item.stats as? MonetizationStats {
+                twoColumnLayout = false
+                
+                topLeftItemLayoutAndApply = makeTopLeftItemLayout(
+                    item.context,
+                    params.width,
+                    item.presentationData,
+                    "54.12",
+                    "Balance Available to Withdraw",
+                    ("≈$123", .generic),
+                    item.animatedEmoji
+                )
+                
+                topRightItemLayoutAndApply = makeTopRightItemLayout(
+                    item.context,
+                    params.width,
+                    item.presentationData,
+                    "84.52",
+                    "Proceeds Since Last Withdrawal",
+                    ("≈$226", .generic),
+                    item.animatedEmoji
+                )
+                
+                middle1LeftItemLayoutAndApply = makeMiddle1LeftItemLayout(
+                    item.context,
+                    params.width,
+                    item.presentationData,
+                    "692.52",
+                    "Total Lifetime Proceeds",
+                    ("≈$1858", .generic),
+                    item.animatedEmoji
+                )
+                
+                height += topLeftItemLayoutAndApply!.0.height * 3.0 + verticalSpacing * 2.0
             }
         
             let contentSize = CGSize(width: params.width, height: height)

submodules/StatisticsUI/Sources/TransactionInfoScreen.swift

@@ -0,0 +1,475 @@
+import Foundation
+import UIKit
+import Display
+import ComponentFlow
+import SwiftSignalKit
+import TelegramCore
+import Markdown
+import TextFormat
+import TelegramPresentationData
+import ViewControllerComponent
+import SheetComponent
+import BundleIconComponent
+import BalancedTextComponent
+import MultilineTextComponent
+import SolidRoundedButtonComponent
+import LottieComponent
+import AccountContext
+import TelegramStringFormatting
+import PremiumPeerShortcutComponent
+
+enum MonetizationTransaction: Equatable {
+    case incoming(amount: Int64, fromTimestamp: Int32, toTimestamp: Int32)
+    case outgoing(amount: Int64, timestamp: Int32, address: String, explorerUrl: String)
+    
+    var amount: Int64 {
+        switch self {
+        case let .incoming(amount, _, _), let .outgoing(amount, _, _, _):
+            return amount
+        }
+    }
+}
+
+private final class SheetContent: CombinedComponent {
+    typealias EnvironmentType = ViewControllerComponentContainer.Environment
+    
+    let context: AccountContext
+    let peer: EnginePeer
+    let transaction: MonetizationTransaction
+    let openExplorer: (String) -> Void
+    let dismiss: () -> Void
+    
+    init(
+        context: AccountContext,
+        peer: EnginePeer,
+        transaction: MonetizationTransaction,
+        openExplorer: @escaping (String) -> Void,
+        dismiss: @escaping () -> Void
+    ) {
+        self.context = context
+        self.peer = peer
+        self.transaction = transaction
+        self.openExplorer = openExplorer
+        self.dismiss = dismiss
+    }
+    
+    static func ==(lhs: SheetContent, rhs: SheetContent) -> Bool {
+        if lhs.context !== rhs.context {
+            return false
+        }
+        if lhs.peer != rhs.peer {
+            return false
+        }
+        if lhs.transaction != rhs.transaction {
+            return false
+        }
+        return true
+    }
+    
+    final class State: ComponentState {
+        var cachedCloseImage: (UIImage, PresentationTheme)?
+        
+        let playOnce =  ActionSlot<Void>()
+        private var didPlayAnimation = false
+                
+        func playAnimationIfNeeded() {
+            guard !self.didPlayAnimation else {
+                return
+            }
+            self.didPlayAnimation = true
+            self.playOnce.invoke(Void())
+        }
+    }
+    
+    func makeState() -> State {
+        return State()
+    }
+    
+    static var body: Body {
+        let closeButton = Child(Button.self)
+                
+        let amount = Child(MultilineTextComponent.self)
+        let title = Child(MultilineTextComponent.self)
+        let date = Child(MultilineTextComponent.self)
+        let address = Child(MultilineTextComponent.self)
+        let peerShortcut = Child(PremiumPeerShortcutComponent.self)
+        
+        let actionButton = Child(SolidRoundedButtonComponent.self)
+
+        return { context in
+            let environment = context.environment[EnvironmentType.self]
+            let component = context.component
+            let state = context.state
+            
+            let theme = environment.theme
+            let strings = environment.strings
+            let dateTimeFormat = component.context.sharedContext.currentPresentationData.with { $0 }.dateTimeFormat
+            
+            let sideInset: CGFloat = 16.0 + environment.safeInsets.left
+            let textSideInset: CGFloat = 32.0 + environment.safeInsets.left
+            
+            let titleFont = Font.semibold(17.0)
+            let textFont = Font.regular(17.0)
+            let fixedFont = Font.monospace(17.0)
+            
+            let textColor = theme.actionSheet.primaryTextColor
+            let secondaryTextColor = theme.actionSheet.secondaryTextColor
+            
+            var contentSize = CGSize(width: context.availableSize.width, height: 45.0)
+            
+            let closeImage: UIImage
+            if let (image, theme) = state.cachedCloseImage, theme === environment.theme {
+                closeImage = image
+            } else {
+                closeImage = generateCloseButtonImage(backgroundColor: UIColor(rgb: 0x808084, alpha: 0.1), foregroundColor: theme.actionSheet.inputClearButtonColor)!
+                state.cachedCloseImage = (closeImage, theme)
+            }
+            
+            let closeButton = closeButton.update(
+                component: Button(
+                    content: AnyComponent(Image(image: closeImage)),
+                    action: { [weak component] in
+                        component?.dismiss()
+                    }
+                ),
+                availableSize: CGSize(width: 30.0, height: 30.0),
+                transition: .immediate
+            )
+            context.add(closeButton
+                .position(CGPoint(x: context.availableSize.width - environment.safeInsets.left - closeButton.size.width, y: 28.0))
+            )
+            
+            let amountString: NSMutableAttributedString
+            let dateString: String
+            let titleString: String
+            let subtitleString: String
+            let buttonTitle: String
+            let explorerUrl: String?
+            
+            let integralFont = Font.with(size: 48.0, design: .round, weight: .semibold)
+            let fractionalFont = Font.with(size: 24.0, design: .round, weight: .semibold)
+            
+            //TODO:localize
+            switch component.transaction {
+            case let .incoming(amount, fromTimestamp, toTimestamp):
+                amountString = amountAttributedString(formatBalanceText(amount, decimalSeparator: dateTimeFormat.decimalSeparator, showPlus: true), integralFont: integralFont, fractionalFont: fractionalFont, color: theme.list.itemDisclosureActions.constructive.fillColor).mutableCopy() as! NSMutableAttributedString
+                amountString.append(NSAttributedString(string: " TON", font: fractionalFont, textColor: theme.list.itemDisclosureActions.constructive.fillColor))
+                dateString = "\(stringForFullDate(timestamp: fromTimestamp, strings: strings, dateTimeFormat: dateTimeFormat)) – \(stringForFullDate(timestamp: toTimestamp, strings: strings, dateTimeFormat: dateTimeFormat))"
+                titleString = "Proceeds from Ads displayed in"
+                subtitleString = ""
+                buttonTitle = strings.Common_OK
+                explorerUrl = nil
+            case let .outgoing(amount, timestamp, address, explorerUrlValue):
+                amountString = amountAttributedString(formatBalanceText(amount, decimalSeparator: dateTimeFormat.decimalSeparator), integralFont: integralFont, fractionalFont: fractionalFont, color: theme.list.itemDestructiveColor).mutableCopy() as! NSMutableAttributedString
+                amountString.append(NSAttributedString(string: " TON", font: fractionalFont, textColor: theme.list.itemDestructiveColor))
+                dateString = stringForFullDate(timestamp: timestamp, strings: strings, dateTimeFormat: dateTimeFormat)
+                titleString = "Balance Withdrawal to"
+                subtitleString = formatAddress(address)
+                buttonTitle = "View in Blockchain Explorer"
+                explorerUrl = explorerUrlValue
+            }
+            
+            let amount = amount.update(
+                component: MultilineTextComponent(
+                    text: .plain(amountString),
+                    horizontalAlignment: .center,
+                    maximumNumberOfLines: 1,
+                    lineSpacing: 0.1
+                ),
+                availableSize: CGSize(width: context.availableSize.width - textSideInset * 2.0, height: context.availableSize.height),
+                transition: .immediate
+            )
+            context.add(amount
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + amount.size.height / 2.0))
+            )
+            contentSize.height += amount.size.height
+            contentSize.height += -5.0
+            
+            let date = date.update(
+                component: MultilineTextComponent(
+                    text: .plain(NSAttributedString(string: dateString, font: textFont, textColor: secondaryTextColor)),
+                    horizontalAlignment: .center,
+                    maximumNumberOfLines: 0,
+                    lineSpacing: 0.1
+                ),
+                availableSize: CGSize(width: context.availableSize.width - textSideInset * 2.0, height: context.availableSize.height),
+                transition: .immediate
+            )
+            context.add(date
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + date.size.height / 2.0))
+            )
+            contentSize.height += date.size.height
+            contentSize.height += 32.0
+            
+            let title = title.update(
+                component: MultilineTextComponent(
+                    text: .plain(NSAttributedString(string: titleString, font: titleFont, textColor: textColor)),
+                    horizontalAlignment: .center,
+                    maximumNumberOfLines: 0,
+                    lineSpacing: 0.1
+                ),
+                availableSize: CGSize(width: context.availableSize.width - textSideInset * 2.0, height: context.availableSize.height),
+                transition: .immediate
+            )
+            context.add(title
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + title.size.height / 2.0))
+            )
+            contentSize.height += title.size.height
+            contentSize.height += 3.0
+            
+            if !subtitleString.isEmpty {
+                let address = address.update(
+                    component: MultilineTextComponent(
+                        text: .plain(NSAttributedString(string: subtitleString, font: fixedFont, textColor: textColor)),
+                        horizontalAlignment: .center,
+                        maximumNumberOfLines: 0,
+                        lineSpacing: 0.1
+                    ),
+                    availableSize: CGSize(width: context.availableSize.width - textSideInset * 2.0, height: context.availableSize.height),
+                    transition: .immediate
+                )
+                context.add(address
+                    .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + address.size.height / 2.0))
+                )
+                contentSize.height += address.size.height
+                contentSize.height += 50.0
+            } else {
+                contentSize.height += 5.0
+                let peerShortcut = peerShortcut.update(
+                    component: PremiumPeerShortcutComponent(
+                        context: component.context,
+                        theme: theme,
+                        peer: component.peer
+                        
+                    ),
+                    availableSize: CGSize(width: context.availableSize.width - 32.0, height: context.availableSize.height),
+                    transition: .immediate
+                )
+                context.add(peerShortcut
+                    .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + peerShortcut.size.height / 2.0))
+                )
+                contentSize.height += peerShortcut.size.height
+                contentSize.height += 50.0
+            }
+           
+            let actionButton = actionButton.update(
+                component: SolidRoundedButtonComponent(
+                    title: buttonTitle,
+                    theme: SolidRoundedButtonComponent.Theme(
+                        backgroundColor: theme.list.itemCheckColors.fillColor,
+                        backgroundColors: [],
+                        foregroundColor: theme.list.itemCheckColors.foregroundColor
+                    ),
+                    font: .bold,
+                    fontSize: 17.0,
+                    height: 50.0,
+                    cornerRadius: 10.0,
+                    gloss: false,
+                    iconName: nil,
+                    animationName: nil,
+                    iconPosition: .left,
+                    action: {
+                        component.dismiss()
+                        if let explorerUrl {
+                            component.openExplorer(explorerUrl)
+                        }
+                    }
+                ),
+                availableSize: CGSize(width: context.availableSize.width - sideInset * 2.0, height: 50.0),
+                transition: context.transition
+            )
+            context.add(actionButton
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: contentSize.height + actionButton.size.height / 2.0))
+            )
+            contentSize.height += actionButton.size.height
+            contentSize.height += 22.0
+                        
+            contentSize.height += environment.safeInsets.bottom
+            
+            state.playAnimationIfNeeded()
+            
+            return contentSize
+        }
+    }
+}
+
+private final class SheetContainerComponent: CombinedComponent {
+    typealias EnvironmentType = ViewControllerComponentContainer.Environment
+    
+    let context: AccountContext
+    let peer: EnginePeer
+    let transaction: MonetizationTransaction
+    let openExplorer: (String) -> Void
+    
+    init(
+        context: AccountContext,
+        peer: EnginePeer,
+        transaction: MonetizationTransaction,
+        openExplorer: @escaping (String) -> Void
+    ) {
+        self.context = context
+        self.peer = peer
+        self.transaction = transaction
+        self.openExplorer = openExplorer
+    }
+    
+    static func ==(lhs: SheetContainerComponent, rhs: SheetContainerComponent) -> Bool {
+        if lhs.context !== rhs.context {
+            return false
+        }
+        if lhs.peer != rhs.peer {
+            return false
+        }
+        if lhs.transaction != rhs.transaction {
+            return false
+        }
+        return true
+    }
+    
+    static var body: Body {
+        let sheet = Child(SheetComponent<EnvironmentType>.self)
+        let animateOut = StoredActionSlot(Action<Void>.self)
+        
+        let sheetExternalState = SheetComponent<EnvironmentType>.ExternalState()
+        
+        return { context in
+            let environment = context.environment[EnvironmentType.self]
+            
+            let controller = environment.controller
+            
+            let sheet = sheet.update(
+                component: SheetComponent<EnvironmentType>(
+                    content: AnyComponent<EnvironmentType>(SheetContent(
+                        context: context.component.context,
+                        peer: context.component.peer,
+                        transaction: context.component.transaction,
+                        openExplorer: context.component.openExplorer,
+                        dismiss: {
+                            animateOut.invoke(Action { _ in
+                                if let controller = controller() {
+                                    controller.dismiss(completion: nil)
+                                }
+                            })
+                        }
+                    )),
+                    backgroundColor: .color(environment.theme.actionSheet.opaqueItemBackgroundColor),
+                    followContentSizeChanges: true,
+                    externalState: sheetExternalState,
+                    animateOut: animateOut
+                ),
+                environment: {
+                    environment
+                    SheetComponentEnvironment(
+                        isDisplaying: environment.value.isVisible,
+                        isCentered: environment.metrics.widthClass == .regular,
+                        hasInputHeight: !environment.inputHeight.isZero,
+                        regularMetricsSize: CGSize(width: 430.0, height: 900.0),
+                        dismiss: { animated in
+                            if animated {
+                                animateOut.invoke(Action { _ in
+                                    if let controller = controller() {
+                                        controller.dismiss(completion: nil)
+                                    }
+                                })
+                            } else {
+                                if let controller = controller() {
+                                    controller.dismiss(completion: nil)
+                                }
+                            }
+                        }
+                    )
+                },
+                availableSize: context.availableSize,
+                transition: context.transition
+            )
+            
+            context.add(sheet
+                .position(CGPoint(x: context.availableSize.width / 2.0, y: context.availableSize.height / 2.0))
+            )
+            
+            if let controller = controller(), !controller.automaticallyControlPresentationContextLayout {
+                let layout = ContainerViewLayout(
+                    size: context.availableSize,
+                    metrics: environment.metrics,
+                    deviceMetrics: environment.deviceMetrics,
+                    intrinsicInsets: UIEdgeInsets(top: 0.0, left: 0.0, bottom: max(environment.safeInsets.bottom, sheetExternalState.contentHeight), right: 0.0),
+                    safeInsets: UIEdgeInsets(top: 0.0, left: environment.safeInsets.left, bottom: 0.0, right: environment.safeInsets.right),
+                    additionalInsets: .zero,
+                    statusBarHeight: environment.statusBarHeight,
+                    inputHeight: nil,
+                    inputHeightIsInteractivellyChanging: false,
+                    inVoiceOver: false
+                )
+                controller.presentationContext.containerLayoutUpdated(layout, transition: context.transition.containedViewLayoutTransition)
+            }
+            
+            return context.availableSize
+        }
+    }
+}
+
+
+final class TransactionInfoScreen: ViewControllerComponentContainer {
+    private let context: AccountContext
+        
+    init(
+        context: AccountContext,
+        peer: EnginePeer,
+        transaction: MonetizationTransaction,
+        openExplorer: @escaping (String) -> Void
+    ) {
+        self.context = context
+                
+        super.init(
+            context: context,
+            component: SheetContainerComponent(
+                context: context,
+                peer: peer,
+                transaction: transaction,
+                openExplorer: openExplorer
+            ),
+            navigationBarAppearance: .none,
+            statusBarStyle: .ignore,
+            theme: .default
+        )
+        
+        self.navigationPresentation = .flatModal
+    }
+    
+    required public init(coder aDecoder: NSCoder) {
+        fatalError("init(coder:) has not been implemented")
+    }
+    
+    override func viewDidLoad() {
+        super.viewDidLoad()
+        
+        self.view.disablesInteractiveModalDismiss = true
+    }
+    
+    func dismissAnimated() {
+        if let view = self.node.hostView.findTaggedView(tag: SheetComponent<ViewControllerComponentContainer.Environment>.View.Tag()) as? SheetComponent<ViewControllerComponentContainer.Environment>.View {
+            view.dismissAnimated()
+        }
+    }
+}
+
+func generateCloseButtonImage(backgroundColor: UIColor, foregroundColor: UIColor) -> UIImage? {
+    return generateImage(CGSize(width: 30.0, height: 30.0), contextGenerator: { size, context in
+        context.clear(CGRect(origin: CGPoint(), size: size))
+        
+        context.setFillColor(backgroundColor.cgColor)
+        context.fillEllipse(in: CGRect(origin: CGPoint(), size: size))
+        
+        context.setLineWidth(2.0)
+        context.setLineCap(.round)
+        context.setStrokeColor(foregroundColor.cgColor)
+        
+        context.move(to: CGPoint(x: 10.0, y: 10.0))
+        context.addLine(to: CGPoint(x: 20.0, y: 20.0))
+        context.strokePath()
+        
+        context.move(to: CGPoint(x: 20.0, y: 10.0))
+        context.addLine(to: CGPoint(x: 10.0, y: 20.0))
+        context.strokePath()
+    })
+}