<script lang="ts">
	import { BenutzerClient, GebaeudeAufnahmeClient, GebaeudeClient, UploadedGebaeudeBild, VerbrauchsausweisWohnenClient } from "#components/Ausweis/types.js";
	import { addNotification, updateNotification } from "@ibcornelsen/ui";
	import { validateAccessTokenClient } from "../../client/lib/validateAccessToken.js";
	import { client } from "src/trpc.js";
	import EmbeddedAuthFlowModule from "#modules/EmbeddedAuthFlowModule.svelte";
	import Overlay from "#components/Overlay.svelte";
	import { verbrauchsausweisWohnenSpeichern } from "#client/lib/verbrauchsausweisWohnenSpeichern.js";

	export let gebaeude: GebaeudeClient;
	export let images: UploadedGebaeudeBild[];
	export let ausweis: VerbrauchsausweisWohnenClient;
	export let user: BenutzerClient;
	export let gebaeude_aufnahme_allgemein: GebaeudeAufnahmeClient;

	async function bilderHochladen() {
		// Alle Bilder hochladen
		const notification = addNotification({
			dismissable: false,
			message: "Bilder hochladen.",
			subtext: `${images.length} Bilder werden hochgeladen, bitte haben sie Geduld.`,
			timeout: 0,
			type: "info"
		})
		for (let i = 0; i < images.length; i++) {
			const image = images[i];
			if (image.uid) {
				// Bild wurde bereits hochgeladen, wir müssen es also nicht nochmal hochladen.
				continue
			}

			try {
				const response = await client.v1.bilder.upload.mutate({
					base64: image.base64,
					kategorie: image.kategorie,
					gebaeude_uid: gebaeude.uid
				})

				image.uid = response.uid

				updateNotification(notification, {
					dismissable: true,
					message: "Bild hochgeladen.",
					subtext: `${i + 1}/${images.length} Bildern wurden erfolgreich hochgeladen, bitte haben sie Geduld.`,
					timeout: 4000
				})
			} catch (e) {
				updateNotification(notification, {
					dismissable: true,
					message: "Bild konnte nicht hochgeladen werden.",
					subtext: `Bild ${i + 1}/${images.length} konnte nicht hochgeladen werden, wir haben bereits ein Ticket erstellt und melden uns so schnell wie möglich bei ihnen.`,
					timeout: 150000,
					type: "error"
				})
			}
		}
	}

	async function ausweisSpeichern() {
		// Um einen Ausweis zu speichern müssen wir eingeloggt sein, andernfalls wird die API den call ablehnen.
		// Wir prüfen also ob wir eingeloggt sind und leiten den Nutzer ggf. auf die Login Seite weiter.
		if (!await validateAccessTokenClient()) {
			loginOverlayHidden = false;
			return
		}

		

		loginOverlayHidden = true;

		if (ausweis.uid) {
			// Anscheinend wurde der Ausweis bereits erstellt und hat eine UID.
			// Jetzt müssen wir ihn nun nur noch abspeichern.
			try {
				await client.v1.verbrauchsausweisWohnen[2016].speichern.mutate({
					ausweis,
					gebaeude
				})

				await bilderHochladen();

				return true;
			} catch (e) {
				// TODO: Ticket mit Fehldermeldung abschicken.
			}
		} else {
			// Wir speichern den Ausweis ab und leiten auf die "ausweis-gespeichert" Seite weiter.
			try {
				const response = await verbrauchsausweisWohnenSpeichern(ausweis,
				gebaeude,
				gebaeude_aufnahme_allgemein,
				images,
				user)

				if (response !== null) {
					await bilderHochladen();
					// Falls der Nutzer zurück navigiert, sollte er wieder auf seinen Vorgang kommen.
					// Sonst müsste er alles neu eingeben...
					ausweis.uid = response.uid;
					gebaeude.uid = response.gebaeude_uid;
					gebaeude_aufnahme_allgemein.uid = response.gebaeude_aufnahme_uid;
					
					return true
				}

				return false;
			} catch (e: any) {
				await client.v1.tickets.erstellen.mutate({
					titel: "Ausweis konnte nicht gespeichert werden",
					beschreibung: e.stack,
					email: user.email ?? "",
					metadata: JSON.stringify({
						ausweis,
						gebaeude
					})
				})
				// TODO: Ticket mit Fehldermeldung abschicken.
			}
		}

		addNotification({
			dismissable: false,
			message: "Ausweis konnte nicht gespeichert werden, bitte versuchen sie es erneut.",
			subtext: "Sollte das Problem weiterhin bestehen, kontaktieren sie bitte den Support.",
			timeout: 6000,
			type: "error"
		})
		return false
	}

	async function ausweisAbschicken() {
		const result = await ausweisSpeichern();

		if (result === true) {
			window.history.pushState(
				{},
				"",
				`${location.pathname}?uid=${ausweis.uid}`
			);
			window.location.href = `/kundendaten?uid=${ausweis.uid}`;
		}
	}

	let loginOverlayHidden = true;
</script>

<Overlay bind:hidden={loginOverlayHidden}>
	<div class="bg-white w-full max-w-screen-sm py-8">
		<EmbeddedAuthFlowModule onLogin={ausweisAbschicken}></EmbeddedAuthFlowModule>
	</div>
</Overlay>

<button on:click={ausweisAbschicken} type="button" class="button">Weiter</button>