import SwiftUI

import Kingfisher

struct PushNotificationListItemView: View {
    let item: PushNotificationListItem

    var body: some View {
        HStack(alignment: .center, spacing: 13.3) {
            KFImage(URL(string: item.senderProfileImage ?? ""))
                .cancelOnDisappear(true)
                .resizable()
                .scaledToFill()
                .frame(width: 60, height: 60)
                .background(
                    Circle()
                        .foregroundColor(Color(hex: "555555"))
                )
                .cornerRadius(30)
                .clipped()

            VStack(alignment: .leading, spacing: 5.3) {
                HStack(spacing: 0) {
                    Text(item.senderNickname)
                        .appFont(size: 13.3, weight: .medium)
                        .foregroundColor(Color(hex: "bbbbbb"))

                    Text(" · \(item.relativeSentAtText())")
                        .appFont(size: 10, weight: .medium)
                        .foregroundColor(Color(hex: "909090"))
                }

                Text(item.message)
                    .appFont(size: 13.3, weight: .medium)
                    .foregroundColor(Color(hex: "eeeeee"))
                    .lineLimit(2)
                    .multilineTextAlignment(.leading)
            }

            Spacer(minLength: 0)
        }
        .padding(.horizontal, 13.3)
        .padding(.vertical, 13.3)
        .overlay(alignment: .bottom) {
            Rectangle()
                .frame(height: 1)
                .foregroundColor(Color(hex: "555555"))
        }
    }
}