package com.tangem.features.hotwallet.manualbackup.completed.ui

import android.content.res.Configuration
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.tangem.core.ui.components.PrimaryButton
import com.tangem.core.ui.res.TangemTheme
import com.tangem.core.ui.res.TangemThemePreview
import com.tangem.core.ui.R
import com.tangem.core.ui.extensions.resolveReference
import com.tangem.core.ui.extensions.resourceReference
import com.tangem.core.ui.extensions.stringResourceSafe
import com.tangem.features.hotwallet.manualbackup.completed.entity.ManualBackupCompletedUM

@Suppress("LongMethod")
@OptIn(ExperimentalMaterial3Api::class)
@Composable
internal fun ManualBackupCompletedContent(state: ManualBackupCompletedUM, modifier: Modifier = Modifier) {
    Column(
        modifier = modifier
            .background(TangemTheme.colors.background.primary)
            .fillMaxSize()
            .padding(16.dp),
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Spacer(modifier = Modifier.weight(1f))
        Image(
            painter = painterResource(R.drawable.ic_success_blue_76),
            contentDescription = null,
        )
        Text(
            modifier = Modifier
                .fillMaxWidth()
                .padding(
                    start = 48.dp,
                    top = 20.dp,
                    end = 48.dp,
                ),
            text = state.title.resolveReference(),
            style = TangemTheme.typography.h2,
            color = TangemTheme.colors.text.primary1,
            textAlign = TextAlign.Center,
        )
        Text(
            modifier = Modifier
                .fillMaxWidth()
                .padding(
                    start = 48.dp,
                    top = 12.dp,
                    end = 48.dp,
                ),
            text = stringResourceSafe(R.string.backup_complete_description),
            style = TangemTheme.typography.body1,
            color = TangemTheme.colors.text.secondary,
            textAlign = TextAlign.Center,
        )
        Spacer(modifier = Modifier.weight(2f))
        PrimaryButton(
            modifier = Modifier.fillMaxWidth(),
            text = state.continueButtonText.resolveReference(),
            onClick = state.onContinueClick,
        )
    }
}

@Preview(showBackground = true, widthDp = 360)
@Preview(showBackground = true, widthDp = 360, uiMode = Configuration.UI_MODE_NIGHT_YES)
@Composable
private fun PreviewManualBackupCompletedContentBackup() {
    TangemThemePreview {
        ManualBackupCompletedContent(
            state = ManualBackupCompletedUM(
                isLoading = false,
                title = resourceReference(R.string.backup_complete_title),
                continueButtonText = resourceReference(R.string.common_finish),
                description = resourceReference(R.string.backup_complete_description),
                onContinueClick = { },
            ),
        )
    }
}

@Preview(showBackground = true, widthDp = 360)
@Preview(showBackground = true, widthDp = 360, uiMode = Configuration.UI_MODE_NIGHT_YES)
@Composable
private fun PreviewManualBackupCompletedContentImport() {
    TangemThemePreview {
        ManualBackupCompletedContent(
            state = ManualBackupCompletedUM(
                isLoading = false,
                title = resourceReference(R.string.wallet_import_success_title),
                continueButtonText = resourceReference(R.string.common_continue),
                description = resourceReference(R.string.backup_complete_description),
                onContinueClick = { },
            ),
        )
    }
}