fix: /authorize endpoint crashes when list of scopes is empty (#1575)

frontend/src/lib/components/scope-list.svelte

@@ -5,26 +5,28 @@
 	import { LucideKeyRound, LucideMail, LucideUser, LucideUsers } from '@lucide/svelte';
 	import ScopeItem from './scope-item.svelte';
 
-	let { scopes, scopeInfo = [] }: { scopes: string[]; scopeInfo?: InteractionScopeInfo[] } =
-		$props();
+	let {
+		scopes,
+		scopeInfo = []
+	}: { scopes?: string[] | null; scopeInfo?: InteractionScopeInfo[] | null } = $props();
 
 	const standardScopes = ['openid', 'profile', 'email', 'groups', 'offline_access'];
-	const infoByKey = $derived(new Map(scopeInfo.map((info) => [info.key, info])));
-	const customScopes = $derived(scopes.filter((scope) => !standardScopes.includes(scope)));
+	const infoByKey = $derived(new Map((scopeInfo || []).map((info) => [info.key, info])));
+	const customScopes = $derived((scopes || []).filter((scope) => !standardScopes.includes(scope)));
 </script>
 
 <Item.Group data-testid="scopes" class="gap-1">
-	{#if scopes.includes('email')}
+	{#if (scopes || []).includes('email')}
 		<ScopeItem icon={LucideMail} name={m.email()} description={m.view_your_email_address()} />
 	{/if}
-	{#if scopes.includes('profile')}
+	{#if (scopes || []).includes('profile')}
 		<ScopeItem
 			icon={LucideUser}
 			name={m.profile()}
 			description={m.view_your_profile_information()}
 		/>
 	{/if}
-	{#if scopes.includes('groups')}
+	{#if (scopes || []).includes('groups')}
 		<ScopeItem
 			icon={LucideUsers}
 			name={m.groups()}

frontend/src/routes/device/+page.svelte

@@ -132,7 +132,10 @@
 					</p>
 				</Card.Header>
 				<Card.Content data-testid="scopes">
-					<ScopeList scopes={deviceInfo!.scope} scopeInfo={deviceInfo!.scopeInfo} />
+					<ScopeList
+						scopes={deviceInfo!.scope || []}
+						scopeInfo={deviceInfo!.scopeInfo || []}
+					/>
 				</Card.Content>
 			</Card.Root>
 		</div>

frontend/src/routes/interaction/+page.svelte

@@ -181,7 +181,10 @@
 					</p>
 				</Card.Header>
 				<Card.Content>
-					<ScopeList scopes={interactionSession.scopes} scopeInfo={interactionSession.scopeInfo} />
+					<ScopeList
+						scopes={(interactionSession.scopes || [])}
+						scopeInfo={interactionSession.scopeInfo ?? []}
+					/>
 				</Card.Content>
 			</Card.Root>
 		</div>