Card-on-file

import SwiftUI
import PXPCheckoutSDK

let pxpCheckout = try PxpCheckout.initialize(config: CheckoutConfig(
    environment: .test,
    session: SessionData(
        sessionId: "your-session-id",
        hmacKey: "your-hmac-key",
        encryptionKey: "your-encryption-key"
    ),
    transactionData: TransactionData(
        amount: Decimal(10),
        currency: "USD",
        entryType: .ecom,
        intent: TransactionIntentData(card: .authorisation),
        merchantTransactionId: "unique-transaction-id",
        merchantTransactionDate: { Date() }
    ),
    merchantShopperId: "shopper-id",
    ownerType: "MerchantGroup",
    ownerId: "your-owner-id"
))

// Create card-on-file component
let cardOnFileComponent = try pxpCheckout.create(.cardOnFile, componentConfig: CardOnFileComponentConfig()) as! CardOnFileComponent

// Render component in SwiftUI
cardOnFileComponent.buildContent()

// Create additional components for card-on-file
var cvcConfig = CardCvcComponentConfig(label: "Security code")
cvcConfig.isRequired = true

var expiryConfig = CardExpiryDateComponentConfig(label: "Expiry date")

// Create card-on-file with advanced configuration
var config = CardOnFileComponentConfig()

// Filtering options
config.limitTokens = 5
config.filterBy = FilterByConfig(
    excludeExpiredTokens: true,
    schemes: [.visa, .mastercard],
    fundingSource: "Credit",
    issuerCountryCode: "USA",
    ownerType: "Consumer"
)

// Sorting options
config.orderBy = OrderByConfig(
    expiryDate: OrderByDirectionConfig(
        direction: "asc",
        priority: 1
    ),
    scheme: OrderByValueConfig(
        valuesOrder: [.visa, .mastercard, .americanExpress],
        priority: 2
    ),
    fundingSource: OrderByValueConfig(
        valuesOrder: ["Credit", "Debit"],
        priority: 3
    ),
    lastUsageDate: OrderByLastUsageDateConfig(
        direction: "desc",
        orderByField: "lastSuccessfulPurchaseDate",
        priority: 4
    )
)

// UI configuration
config.isExpiryDateEditable = true
config.isCvcRequired = true
config.allowDeleteToken = true

// Nested components
config.cvcComponentConfig = cvcConfig
config.expiryDateComponentConfig = expiryConfig

let cardOnFileComponent = try pxpCheckout.create(.cardOnFile, componentConfig: config) as! CardOnFileComponent

// Custom text labels
config.expiredText = "Card expired"
config.validThruText = "Valid until"
config.deleteErrorMessage = "Unable to delete card. Please try again."
config.deleteSuccessMessage = "Card has been removed successfully."
config.updateErrorMessage = "Unable to update card information. Please try again."
config.updateSuccessMessage = "Card information updated successfully."

// Custom styling
config.styles = CardOnFileStyles(
    backgroundColor: Color(.systemGray6),
    borderColor: Color(.systemGray3),
    borderRadius: 8,
    padding: 20
)

config.inputStyles = FieldInputStyle(
    cornerRadius: 5,
    backgroundColor: Color(.secondarySystemBackground)
)

// Custom icons
config.iconDeleteSrc = Image(systemName: "trash")
config.iconSaveSrc = Image(systemName: "checkmark")
config.iconCancelSrc = Image(systemName: "xmark")
config.iconEditSrc = Image(systemName: "pencil")

// Custom card brand images
config.cardBrandImages = CardBrandImages(
    visaSrc: Image("BrandVisa"),
    mastercardSrc: Image("BrandMastercard"),
    amexSrc: Image("BrandAmex")
)

config.useTransparentCardBrandImage = true

// Accessibility labels
config.editCardInformationAccessibilityLabel = "Edit card information button"
config.saveCardInformationAccessibilityLabel = "Save card information button"
config.cancelEditCardInformationAccessibilityLabel = "Cancel edit card information button"
config.deleteCardButtonAccessibilityLabel = "Delete card button"
config.cardNumberAccessibilityLabel = "Card number"
config.cardExpiryDateAccessibilityLabel = "Card expiry date"

// Delete modal configuration
config.deleteModal = DeleteModalConfig(
    dialogAccessibilityLabel: "Delete card dialog",
    bodyText: "Are you sure you want to delete this payment method?",
    cancelButtonText: "No, keep it",
    deleteButtonText: "Yes, delete it"
)

config.onPreRenderTokens = { response in
    response.gatewayTokens.map {
        CardTokenMapping(id: $0.gatewayTokenId, isCvcRequired: true)
    }
    + response.schemeTokens.map {
        CardTokenMapping(id: $0.schemeTokenId, isCvcRequired: true)
    }
}

config.onRetrieveTokensSuccess = { response in
    // Optional: analytics or UI state
}

config.onRetrieveTokensFailed = { failure in
    // Show error UI
}

config.onSelectToken = { token in
    // token.maskedPrimaryAccountNumber, token.cardScheme, etc.
}

config.onPreDeleteToken = { token in
    // Return true to proceed (after your own confirmation if needed)
    true
}

config.onDeleteTokenSuccess = { _ in }
config.onDeleteTokenFailed = { _ in }

config.onUpdateTokenSuccess = { _ in }
config.onUpdateTokenFailed = { _ in }

config.onValidationError = { error in
    // e.g. invalid expiry while editing
}

config.tokenLabelBuilder = { token in
    "\(token.cardScheme.displayName) \(token.maskedPrimaryAccountNumber)"
}

config.tokenItemBuilder = { elements in
    AnyView(
        HStack {
            elements.tokenImageView
            VStack(alignment: .leading) {
                elements.tokenLabelView
                elements.expiryDateView
            }
            Spacer()
            elements.editButtonView
            elements.deleteButtonView
        }
    )
}

cardOnFileComponent.buildContent()

PxpCheckout.unmount()

var config = CardOnFileComponentConfig()
config.limitTokens = 5
config.filterBy = FilterByConfig(excludeExpiredTokens: true)

config.onSelectToken = { token in
    print("Selected:", token.maskedPrimaryAccountNumber)
}

config.onRetrieveTokensFailed = { _ in
    // Show error
}

let cardOnFile = try pxpCheckout.create(.cardOnFile, componentConfig: config) as! CardOnFileComponent

var config = CardOnFileComponentConfig()
config.filterBy = FilterByConfig(
    excludeExpiredTokens: true,
    schemes: [.visa, .mastercard],
    fundingSource: "Credit",
    issuerCountryCode: "USA"
)
config.orderBy = OrderByConfig(
    lastUsageDate: OrderByLastUsageDateConfig(
        orderByField: "lastSuccessfulPurchaseDate",
        direction: "desc",
        priority: 1
    ),
    scheme: OrderByValueConfig(valuesOrder: [.visa, .mastercard], priority: 2)
)
config.limitTokens = 3

var config = CardOnFileComponentConfig()
config.isExpiryDateEditable = true
config.isCvcRequired = true
config.allowDeleteToken = true

var cvcConfig = CardCvcComponentConfig(label: "Security code")
cvcConfig.applyMask = true
cvcConfig.showMaskToggle = true
config.cvcComponentConfig = cvcConfig

config.expiryDateComponentConfig = CardExpiryDateComponentConfig(label: "Expiry date")

config.onPreDeleteToken = { token in
    // Present UIAlertController or SwiftUI confirmation; return whether to delete
    true
}

config.deleteModal = DeleteModalConfig(
    dialogAccessibilityLabel: "Confirm deletion",
    bodyText: "Remove this payment method?",
    cancelButtonText: "Cancel",
    deleteButtonText: "Delete",
    modalStyle: CardOnFileModalStyle(
        backgroundColor: .white,
        borderRadius: 12,
        bodyPadding: 16,
        shadowRadius: 16
    ),
    deleteButtonStyle: CardOnFileDeleteButtonStyle(
        backgroundColor: .red,
        textColor: .white,
        height: 44,
        borderRadius: 8
    ),
    cancelButtonStyle: CardOnFileCancelButtonStyle(
        backgroundColor: .white,
        textColor: .primary,
        height: 44,
        borderRadius: 8,
        borderColor: .gray,
        borderWidth: 1
    )
)

config.tokenItemBuilder = { elements in
    AnyView(
        VStack(alignment: .leading, spacing: 8) {
            HStack {
                elements.tokenImageView
                elements.tokenLabelView
                Spacer()
                elements.editButtonView
                elements.deleteButtonView
            }
            elements.expiryDateView
        }
        .padding()
        .background(RoundedRectangle(cornerRadius: 10).stroke(Color.gray.opacity(0.3)))
    )
}

let cofConfig = CardOnFileComponentConfig()
cofConfig.isCvcRequired = true
let cof = try pxpCheckout.create(.cardOnFile, componentConfig: cofConfig) as! CardOnFileComponent

var submitConfig = CardSubmitComponentConfig()
submitConfig.cardOnFileComponent = cof
submitConfig.useCardOnFile = true
submitConfig.submitText = "Pay with saved card"
submitConfig.onPreAuthorisation = { _ async in TransactionInitiationData() }
submitConfig.onPostAuthorisation = { _ in }

let submit = try pxpCheckout.create(.cardSubmit, componentConfig: submitConfig) as! CardSubmitComponent

VStack {
    cof.buildContent()
    submit.buildContent()
}

let transactionData = TransactionData(
    amount: Decimal(string: "250.00")!,
    currency: "USD",
    entryType: .ecom,
    intent: TransactionIntentData(card: .payout),  // Set to payout for disbursements
    merchantTransactionId: "payout-\(UUID().uuidString)",
    merchantTransactionDate: { Date() }
)

let checkoutConfig = CheckoutConfig(
    environment: .test,
    session: sessionData,
    transactionData: transactionData,
    merchantShopperId: "recipient-shopper-id",
    ownerType: "MerchantGroup",
    ownerId: "your-owner-id",
    onGetShopper: { async in TransactionShopper(id: "recipient-shopper-id") }
)

let pxpCheckout = try PxpCheckout.initialize(config: checkoutConfig)

var config = CardOnFileComponentConfig()
config.limitTokens = 5

// Filter and sort for payout flows
config.filterBy = FilterByConfig(excludeExpiredTokens: true)

// Prioritise cards used for recent payouts
config.orderBy = OrderByConfig(
    lastUsageDate: OrderByLastUsageDateConfig(
        orderByField: "lastSuccessfulPayoutDate",  // Sort by payout activity
        direction: "desc",
        priority: 1
    )
)

config.isExpiryDateEditable = true
config.isCvcRequired = true

config.onSelectToken = { token in
    print("Payout card selected:", token.maskedPrimaryAccountNumber)
    print("Last payout:", token.lastSuccessfulPayoutDate.isEmpty ? "None" : token.lastSuccessfulPayoutDate)
}

config.onRetrieveTokensFailed = { error in
    print("Failed to load payout cards:", error.message)
    // Show error message to user
}

let cardOnFileComponent = try pxpCheckout.create(.cardOnFile, componentConfig: config) as! CardOnFileComponent

// Continue with card submit component for payout execution...