Implement signin as guest

frontend/src/app/[locale]/account/authControl.ts

@@ -1,5 +1,6 @@
 import { UserType } from '@/types/user';
 import Config from '@/config/config';
+import { roles } from '@/config/selection';
 const apiServer = Config.apiServer;
 
 async function signUp(newUser: UserType) {
@@ -50,9 +51,35 @@ async function signIn(signInUser: UserType) {
   }
 }
 
+async function signInAsGuest() {
+  const guestUser = {
+    id: null,
+    email: generateRandomEmail(),
+    password: 'guestpassword',
+    username: 'Guest',
+    role: roles.findIndex((entry) => entry.uid === 'user'),
+    avatarPath: '',
+  };
+  const token = await signUp(guestUser);
+  return token;
+}
+
+function generateRandomEmail() {
+  const randomStringLength = 10;
+  const characters = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789';
+  let randomString = '';
+  const charactersLength = characters.length;
+
+  for (let i = 0; i < randomStringLength; i++) {
+    randomString += characters.charAt(Math.floor(Math.random() * charactersLength));
+  }
+
+  return `${randomString}@example.com`;
+}
+
 function getRandomAvatarPath() {
   const randomIndex = Math.floor(Math.random() * avatars.length);
   return avatars[randomIndex];
 }
 
-export { signUp, signIn, getRandomAvatarPath };
+export { signUp, signIn, signInAsGuest, getRandomAvatarPath };

frontend/src/app/[locale]/account/authPage.tsx

@@ -6,7 +6,7 @@ import { Link } from '@/src/navigation';
 import { ChevronRight, Eye, EyeOff } from 'lucide-react';
 import { UserType, AuthMessages } from '@/types/user';
 import { roles } from '@/config/selection';
-import { signUp, signIn } from './authControl';
+import { signUp, signIn, signInAsGuest } from './authControl';
 import { isValidEmail, isValidPassword } from './validate';
 import { TokenContext } from '../TokenProvider';
 import { useRouter } from '@/src/navigation';
@@ -83,6 +83,13 @@ export default function AuthPage({ isSignup, messages, locale }: Props) {
     router.push('/account', { locale: locale });
   };
 
+  const handleSignInAsGuest = async () => {
+    const token = await signInAsGuest();
+    context.setToken(token);
+    context.storeTokenToLocalStorage(token);
+    router.push('/account', { locale: locale });
+  };
+
   return (
     <Card className="w-[480px] mt-16">
       <CardHeader className="px-4 pt-4 pb-0 flex justify-between">
@@ -159,10 +166,18 @@ export default function AuthPage({ isSignup, messages, locale }: Props) {
               }}
             />
           )}
-          <div className="flex justify-end">
-            <Button color="primary" className="mt-3" onPress={validate}>
+          <div className="flex justify-end items-center mt-3">
+            <Button color="primary" onPress={validate}>
               {messages.submitTitle}
             </Button>
+            {!isSignup && (
+              <Button
+                className="ms-3 bg-gradient-to-tr from-pink-500 to-yellow-500 text-white shadow-lg"
+                onPress={handleSignInAsGuest}
+              >
+                {messages.signInAsGuest}
+              </Button>
+            )}
           </div>
         </form>
       </CardBody>

frontend/src/app/[locale]/account/signin/page.tsx

@@ -7,6 +7,7 @@ export default function Page(params: { locale: string }) {
     title: t('signin'),
     linkTitle: t('or_signup'),
     submitTitle: t('signin'),
+    signInAsGuest: t('signin_as_guest'),
     email: t('email'),
     username: t('username'),
     password: t('password'),