diff --git a/ui/src/components/LoginModal.vue b/ui/src/components/LoginModal.vue
index 060760a..534fb5f 100644
--- a/ui/src/components/LoginModal.vue
+++ b/ui/src/components/LoginModal.vue
@@ -16,7 +16,7 @@
               ref="username_input"
               class="input"
               type="text"
-              v-model="creds[0]"
+              v-model="creds.username"
             />
           </div>
         </div>
@@ -24,7 +24,7 @@
         <div class="field">
           <label class="label">Passwort</label>
           <div class="control">
-            <input class="input" type="password" v-model="creds[1]" />
+            <input class="input" type="password" v-model="creds.password" />
           </div>
         </div>
       </section>
@@ -60,7 +60,10 @@ const emit = defineEmits<{
   (event: "cancel"): void;
 }>();
 
-const creds = ref<Credentials>(["", ""]);
+const creds = ref<Credentials>({
+  username: "",
+  password: "",
+});
 
 function submit(): void {
   emit("submit", creds.value);