import React from 'react';
import {
	GyldighetsRegistrerer,
	ledetekst,
	OppsummeringBlokk,
	OppsummeringPunkt,
	OppsummeringTabell,
	useOppsummering,
	VerdiEllerInfoMangler,
} from '..';
import { validerSoknadsinformasjon } from '../validering/SoknadsinformasjonValidering';
import { TilbakemeldingForSteg } from './tilbakemelding/TilbakemeldingForSteg';
import { erUlikeStrings, hentKontakt } from './utils';

function SoknadsinformasjonOppsummering({
	visMerknadEndringsgrunnlag = false,
}: {
	visMerknadEndringsgrunnlag?: boolean;
}) {
	const {
		id: soknadId,
		kunLesbar,
		soknad,
		forrigeSoknad,
		gyldighet,
		vegarbeid = {},
	} = useOppsummering() as any; // TODO type opp;

	const redigeringsLenke = !kunLesbar && `#/${soknadId}/soknadinformasjon`;
	const valideringsfeil = !kunLesbar && validerSoknadsinformasjon(soknad);

	const plantypeTekst = plantypeTilTekst(vegarbeid.plantype);

	const markerEndretTittel =
		!!forrigeSoknad &&
		erUlikeStrings(soknad.prosjekttittel, forrigeSoknad.prosjekttittel);
	const markerEndretPlantype =
		!!forrigeSoknad &&
		erUlikeStrings(
			soknad.vegarbeid.plantype,
			forrigeSoknad.vegarbeid?.plantype
		);

	const kontaktperson =
		hentKontakt(vegarbeid.kontakter, 'KONTAKT_FOR_SOKER') || {};

	return (
		<>
			<TilbakemeldingForSteg steg="soknadsinformasjon" />
			<OppsummeringBlokk
				tittel={ledetekst.getTekst(
					'arbeidsvarsling.soknad.Soknadskomponent.kulepunkter.Soknadsinformasjon'
				)}
				redigeringsLenke={redigeringsLenke}
				valideringsfeil={valideringsfeil}
				ikon={'ikon-info'}
				merknad={
					visMerknadEndringsgrunnlag
						? ledetekst.getTekst(
								'arbeidsvarsling.soknad.Oppsummering.endringsbegrunnelse.infotekst'
						  )
						: undefined
				}
			>
				<OppsummeringPunkt
					tittel={ledetekst.getTekst(
						'arbeidsvarsling.soknad.Vegarbeidomrade.prosjekttittel.tekstfelt'
					)}
				>
					<VerdiEllerInfoMangler
						skalMaskeres
						className={
							markerEndretTittel
								? 'saksbehandling-redigert-informasjon'
								: ''
						}
					>
						{soknad.prosjekttittel}
					</VerdiEllerInfoMangler>
				</OppsummeringPunkt>

				<OppsummeringPunkt
					tittel={ledetekst.getTekst(
						'arbeidsvarsling.soknad.Oppsummering.Vegarbeidomrade.plantype'
					)}
				>
					<VerdiEllerInfoMangler
						className={
							markerEndretPlantype
								? 'saksbehandling-redigert-informasjon'
								: ''
						}
					>
						{plantypeTekst}
					</VerdiEllerInfoMangler>
				</OppsummeringPunkt>

				<KontaktForSoknadOppsummering
					kontaktperson={kontaktperson}
					markerEndring={
						forrigeSoknad &&
						erKontaktpersonEndret(kontaktperson, forrigeSoknad)
					}
				/>

				{gyldighet && (
					<GyldighetsRegistrerer
						gyldighet={gyldighet.obligatorisk()}
						erGyldig={!valideringsfeil}
					/>
				)}
			</OppsummeringBlokk>
		</>
	);
}

function erKontaktpersonEndret(kontaktperson, forrigeSoknad) {
	const kontaktpersonForrigeSoknad = hentKontakt(
		forrigeSoknad.vegarbeid?.kontakter,
		'KONTAKT_FOR_SOKER'
	);
	return (
		!!kontaktpersonForrigeSoknad &&
		(erUlikeStrings(
			kontaktperson.fornavn,
			kontaktpersonForrigeSoknad.fornavn
		) ||
			erUlikeStrings(
				kontaktperson.etternavn,
				kontaktpersonForrigeSoknad.etternavn
			) ||
			erUlikeStrings(
				kontaktperson.kontaktinformasjon?.mobiltelefonnummer,
				kontaktpersonForrigeSoknad.kontaktinformasjon
					?.mobiltelefonnummer
			) ||
			erUlikeStrings(
				kontaktperson.kontaktinformasjon?.epostadresse,
				kontaktpersonForrigeSoknad.kontaktinformasjon?.epostadresse
			))
	);
}

function KontaktForSoknadOppsummering({ kontaktperson, markerEndring }) {
	const overskrifter = [
		'arbeidsvarsling.soknad.Kontaktinformasjon.aktor.fornavn',
		'arbeidsvarsling.soknad.Kontaktinformasjon.aktor.etternavn',
		'arbeidsvarsling.soknad.Kontaktinformasjon.aktor.telefonnummer',
		'arbeidsvarsling.soknad.Kontaktinformasjon.aktor.epost',
	].map(ledetekst.getTekst);

	const kontaktinfo = kontaktperson.kontaktinformasjon || {};

	const data = [
		{
			kolonner: [
				kontaktperson.fornavn,
				kontaktperson.etternavn,
				kontaktinfo.mobiltelefonnummer,
				kontaktinfo.epostadresse,
			],
			markerEndring: markerEndring,
		},
	];

	return (
		<OppsummeringPunkt
			tittel={ledetekst.getTekst(
				'arbeidsvarsling.soknad.Oppsummering.informasjon.kontakt'
			)}
		>
			<OppsummeringTabell
				overskrifter={overskrifter}
				data={data}
				skalMaskeres
			/>
		</OppsummeringPunkt>
	);
}

function plantypeTilTekst(plantype) {
	if (plantype) {
		return ledetekst.getTekst(
			`arbeidsvarsling.soknad.Soknadsinformasjon.plantype.${plantype}`
		);
	}
	return '';
}

export { SoknadsinformasjonOppsummering };