Erant-OldApp/src/App.svelte

<script lang="ts">
	import './main.scss'
	import { i18n, isLoading as localeLoading } from '$lib/locales'
	import client, { isLoading as authLoading, databases, user } from '$lib/appwrite'
	import { onMount } from 'svelte'

	import Routes from './__routes.svelte'
	/** import CookiesPopUp from '$lib/components/Cookies/CookiesPopUp.svelte' */
	import { navigate } from '$lib/router'
	import LocationRequest from '$lib/components/Map/LocationRequest.svelte'
	import { Models } from 'appwrite'
	import { UsersAnswersDocument } from '$lib/TStypes/experiences'

	let isMounted = false
	$: isReady = $localeLoading === false && $authLoading === false && isMounted

	$: if (isReady && !$user?.emailVerification) {
		if (!location.pathname.startsWith('/login') && !location.pathname.startsWith('/register')) {
			navigate('/login')
		}
	}

	onMount(() => {
		/** init i18n */
		i18n()

		/** register service worker */
		if ('serviceWorker' in window.navigator) {
			window.navigator.serviceWorker.register('/serviceworker.js', {
				scope: '/',
			})
		}

		isMounted = true
	})
</script>

<main>
	<LocationRequest />

	<!-- <CookiesPopUp /> -->

	<!-- you can display loading while app is not ready (waiting for user and i18n) -->
	{#if isReady}
		<Routes />
	{/if}
</main>

<style lang="scss">
	main {
		height: 100%;
		display: flex;
		justify-content: center;
		justify-self: center;
		width: 100%;
		position: relative;
		max-width: var(--max-viewport-width);
	}
</style>