✨ persist user information when switching tabs (#251) (#253)

* ✨ feat: persist user information when switching tabs (#251)
* ✨ feat: added nickname step information store
* 🎨 fix: use store alias

registration/src/lib/components/forms/steps/registration/CheckNickNameStep.svelte

@@ -5,7 +5,9 @@
 	import AvailableNicknames from '$components/user/AvailableNicknames.svelte';
 	import { env } from '$env/dynamic/public';
 	import { createUserFormSchema } from '$lib/schemas/zodSchema';
+	import { nickNameStepInfo } from '$store';
 	import { isNickNameTaken, suggestNickNames } from '$utils/api';
+	import { onDestroy, onMount } from 'svelte';
 	import { t } from 'svelte-i18n';
 
 	let firstName: string = '';
@@ -63,6 +65,28 @@
 
 		checkNicknameForm.requestSubmit();
 	};
+
+	onMount(() => {
+		const {
+			firstName: savedFirstName,
+			lastName: savedLastName,
+			nickName: savedNickname
+		} = $nickNameStepInfo;
+
+		firstName = savedFirstName;
+		lastName = savedLastName;
+		nickName = savedNickname;
+  
+		checkNickName();
+	});
+
+	onDestroy(() => { 
+		nickNameStepInfo.set({
+			firstName,
+			lastName,
+			nickName
+		});
+	});
 </script>
 
 <form

registration/src/store/registration.ts

@@ -1,4 +1,4 @@
-import type { RegistrationStepType } from '$types';
+import type { UserInfo, RegistrationStepType } from '$types';
 import { writable, get } from 'svelte/store';
 import type { ActionData } from '../routes/$types';
 
@@ -34,3 +34,9 @@ export const nextRegistrationStep = () => {
 
 	if (currentStep === 'password') return registrationStep.set('success');
 };
+
+export const nickNameStepInfo = writable<UserInfo>({
+	firstName: '',
+	lastName: '',
+	nickName: ''
+});

registration/src/types/index.ts

@@ -114,3 +114,9 @@ export interface lemonLDAPSessionInformation {
 	error?: number;
 	token?: string;
 }
+
+export interface UserInfo {
+	firstName: string;
+	lastName: string;
+	nickName: string;
+}