src/App.svelte

@@ -13,8 +13,6 @@
 	$: isReady = $localeLoading === false && $authLoading === false && isMounted
 
 	$: if (isReady && !$user?.emailVerification) {
-		console.log('change')
-
 		if (!location.pathname.startsWith('/login') && !location.pathname.startsWith('/register')) {
 			navigate('/login')
 		}

src/__routes.svelte

@@ -32,7 +32,7 @@
 		},
 		{
 			path: '/map',
-			component: () => import('$routes/map.svelte'),
+			component: () => import('$root/src/routes/map/map.svelte'),
 		},
 		{
 			path: '/explore',
@@ -55,24 +55,24 @@
 		},
 		{
 			path: '/login',
-			component: () => import('$routes/login/log_in.svelte'),
+			component: () => import('$routes/authorization/login/log_in.svelte'),
 		},
 		{
 			path: '/register',
-			component: () => import('$root/src/routes/register/register.svelte'),
+			component: () => import('$root/src/routes/authorization/register/register.svelte'),
 		},
 		{
 			path: '/register/failed',
-			component: () => import('$routes/register/registerFailed.svelte'),
+			component: () => import('$routes/authorization/register/registerFailed.svelte'),
 		},
 
 		{
 			path: '/register/emailverification/:erantId',
-			component: () => import('$routes/register/emailVerification.svelte'),
+			component: () => import('$routes/authorization/register/emailVerification.svelte'),
 		},
 		{
 			path: '/create/account/:erantId/',
-			component: () => import('$routes/register/createAccount.svelte'),
+			component: () => import('$routes/authorization/register/createAccount.svelte'),
 		},
 		{
 			path: '/:gameurl',
@@ -92,7 +92,7 @@
 		},
 		{
 			path: '/forgot-pswd',
-			component: () => import('$routes/login/forgot-pswd.svelte'),
+			component: () => import('$routes/authorization/forgottonPassword/forgot-pswd.svelte'),
 		},
 	]}
 />

src/lib/components/Buttons/Button.svelte

@@ -1,18 +1,18 @@
-<script>
+<script lang="ts">
 	import { navigate } from 'svelte-routing'
-	export let href = ''
-
 	import { createEventDispatcher } from 'svelte'
 	const dispatch = createEventDispatcher()
 
-	export let primary = false
-	export let style = ''
+	export let href: string = ''
+	export let disabled: boolean = false
+	export let primary: boolean = false
+	export let style: string = ''
 
 	let className = ''
 	export { className as class }
 </script>
 
-<button {style} on:click={() => navigate(href)} on:click={() => dispatch('submit', true)} on:click class={className} class:primary>
+<button {disabled} class:disabled {style} on:click={() => navigate(href)} on:click={() => dispatch('submit', true)} on:click class={className} class:primary>
 	<slot />
 </button>
 
@@ -49,5 +49,10 @@
 		&:hover {
 			background-color: rgb(232, 232, 232, 0.8);
 		}
+		&.disabled {
+			background: rgb(107 114 128);
+			color: white;
+			cursor: default;
+		}
 	}
 </style>

src/lib/components/Map/LocationRequest.svelte

@@ -1,40 +1,24 @@
 <script lang="ts">
 	import { Alert, Button } from 'flowbite-svelte'
-	import { createEventDispatcher, onMount } from 'svelte'
-	const dispatch = createEventDispatcher()
-	let granted = false;
-
-	
-	onMount(() => {
-	  	if ('permissions' in navigator) {
-			navigator.permissions.query({ name: 'geolocation' }).then((permissionStatus) => {
-		  	if  (permissionStatus.state === 'granted') {
-				granted = true;
-				dispatch('locationGranted'); // This is the event that is emitted when the location is granted and later used in the map.svelte file.
-			}
-			else if (permissionStatus.state !== 'granted') {
-				navigator.geolocation.getCurrentPosition(
-			  		(position) => {
-						(position);
-			  		},
-			  		(error) => {
-						console.log(error);
-			  		}
-				);
-		  	}
-		});
-	  }
-	});
+	export let granted: false | true | null = null
 
+	navigator.geolocation.getCurrentPosition(
+		() => {
+			granted = true
+		},
+		() => {
+			granted = false
+		},
+	)
 </script>
 
-{#if !granted}
-	<Alert class="absolute w-full max-w-[400px] h-24" color="green">
-		<span class="text-lg font-medium">This is an info alert</span>
+{#if granted === false}
+	<Alert class="absolute w-[95%] max-w-[400px] z-50 mt-4" color="green">
+		<span class="text-lg font-medium">This is a info alert</span>
 		<div slot="extra">
 			<div class="mt-2 mb-4 text-sm">To advance through your experience you need to enable the location access, without it the app won't work.</div>
 			<div class="flex gap-2">
-				<Button on:click={() => dispatch('ok')} size="xs">ok</Button>
+				<Button color="green" on:click={() => (granted = true)} size="xs">ok</Button>
 			</div>
 		</div>
 	</Alert>

src/routes/authorization/forgottonPassword/forgot-pswd.svelte

@@ -3,7 +3,7 @@
 	import Button from '$lib/components/Buttons/Button.svelte'
 	import Loading from '$lib/components/Common/Loading.svelte'
 	import { navigate } from 'svelte-routing'
-	import TopImage from '../../lib/svg/Top-Image.svelte'
+	import TopImage from '$lib/svg/Top-Image.svelte'
 	import { Alert, Helper } from 'flowbite-svelte'
 
 	let email = ''

src/routes/authorization/login/log_in.svelte

@@ -1,12 +1,12 @@
 <script lang="ts">
 	import { account, user } from '$lib/appwrite'
-	import Button from '$lib/components/Buttons/Button.svelte'
 	import Loading from '$lib/components/Common/Loading.svelte'
 	import { navigate } from 'svelte-routing'
-	import HiddenInput from '../../lib/components/Inputs/Hidden_Input.svelte'
-	import GoogleLogo from '../../lib/svg/GoogleLogo.svelte'
-	import TopImage from '../../lib/svg/Top-Image.svelte'
-	import { Alert, Helper } from 'flowbite-svelte'
+	import HiddenInput from '$lib/components/Inputs/Hidden_Input.svelte'
+	import GoogleLogo from '$lib/svg/GoogleLogo.svelte'
+	import TopImage from '$lib/svg/Top-Image.svelte'
+	import { Helper } from 'flowbite-svelte'
+	import { getErrorMessage } from '../utils/authorizationErrors'
 
 	export let purpose = 'login' //possible values login, register
 
@@ -24,7 +24,9 @@
 			//if (navigation.canGoBack) navigation.back()
 			navigate('/')
 		} catch (err) {
-			error = JSON.parse(JSON.stringify(err)).response.message
+			error = getErrorMessage(err.code)
+			console.log(err.code)
+
 			state = 'basic'
 		}
 	}
@@ -48,7 +50,7 @@
 	<!--2 forms from components-->
 	<div class="form">
 		{#if error}
-			<Helper color="red">{error}</Helper>
+			<Helper class="ml-4" color="red">{error}</Helper>
 		{/if}
 		<div class="inform">
 			<input bind:value={email} type="text" placeholder="E-mail" autocomplete="email" required />

src/routes/authorization/register/register.svelte

@@ -1,21 +1,20 @@
 <script lang="ts">
-	import { account, user } from '$lib/appwrite'
+	import { account } from '$lib/appwrite'
 	import Loading from '$lib/components/Common/Loading.svelte'
-	import Button from '$lib/components/erant/Button.svelte'
-	import { navigate } from '$lib/router'
-	import { getErrorMessage } from '$lib/utils/appwrite/authorizationErrors'
+	import HiddenInput from '$lib/components/Inputs/Hidden_Input.svelte'
+	import GoogleLogo from '$lib/svg/GoogleLogo.svelte'
+	import TopImage from '$lib/svg/Top-Image.svelte'
+	import { getErrorMessage } from '../utils/authorizationErrors'
 	import { getUserByErantId } from '$lib/utils/database/users'
 	import { ID } from 'appwrite'
-	import { Helper, Checkbox } from 'flowbite-svelte'
-	import HiddenInput from '../../lib/components/Inputs/Hidden_Input.svelte'
-	import GoogleLogo from '../../lib/svg/GoogleLogo.svelte'
-	import TopImage from '../../lib/svg/Top-Image.svelte'
+	import { Helper } from 'flowbite-svelte'
+	import Button from '$lib/components/Buttons/Button.svelte'
 
-	let email = ''
-	let password = ''
-	let repeatPassword = ''
-	let name = ''
-	let erantId = ''
+	let email = 'dfsafads'
+	let password = 'aaaaaaaaa'
+	let repeatPassword = 'aaaaaaaaa'
+	let name = 'fdsafsda'
+	let erantId = 'dfsafdsa'
 
 	let state: 'email-sent' | 'register' | 'loading' = 'register'
 	let error: string | null = null
@@ -74,7 +73,7 @@
 						<a href="erant.cz/cookie-policy" class="text-blue-600 dark:text-blue-500 hover:underline">Cookie Policy</a>, which this site uses.</label
 					>
 				</div>
-				<Button class="w-full text-2xl" disabled={!buttonCodition} on:click={() => register()}>
+				<Button class="w-full text-2xl" primary disabled={!buttonCodition} on:click={() => register()}>
 					{#if state === 'loading'}
 						<Loading class="text-white" />
 					{:else}

src/routes/authorization/utils/authorizationErrors.ts

@@ -1,6 +1,8 @@
 export const errors = {
 	1001: 'Nickname is already taken',
 	409: 'A user with the same email already is in Erant',
+	401: 'Invalid credentials.',
+	400: 'Password must be at least 8 characters.',
 }
 
 export const getErrorMessage = (code: number) => {