fix: Fix multiple bugs with new authentication flow

toju-app/src/app/domains/server-directory/feature/create-server/create-server.component.html

@@ -17,7 +17,10 @@
   </header>
 
   <div class="min-h-0 flex-1 overflow-y-auto">
-    <div class="mx-auto w-full max-w-lg space-y-6 p-4 sm:p-6">
+    <form
+      class="mx-auto w-full max-w-lg space-y-6 p-4 sm:p-6"
+      (ngSubmit)="createServer()"
+    >
       <div>
         <span class="mb-2 block text-sm font-medium text-foreground">{{ 'servers.create.pickCategory' | translate }}</span>
         <div class="flex flex-wrap gap-2">
@@ -48,6 +51,9 @@
         <input
           id="create-server-name"
           type="text"
+          name="serverName"
+          appAutoFocus
+          appSelectOnFocus
           [ngModel]="name()"
           (ngModelChange)="name.set($event)"
           [placeholder]="'servers.create.namePlaceholder' | translate"
@@ -63,6 +69,7 @@
         >
         <textarea
           id="create-server-description"
+          name="serverDescription"
           [ngModel]="description()"
           (ngModelChange)="description.set($event)"
           [placeholder]="'servers.create.descriptionPlaceholder' | translate"
@@ -96,6 +103,8 @@
               <input
                 id="create-server-topic"
                 type="text"
+                name="serverTopic"
+                appSelectOnFocus
                 [ngModel]="topic()"
                 (ngModelChange)="topic.set($event)"
                 [placeholder]="'servers.create.topicPlaceholder' | translate"
@@ -111,6 +120,7 @@
               >
               <select
                 id="create-server-signal-endpoint"
+                name="sourceId"
                 [(ngModel)]="sourceId"
                 class="w-full rounded-lg border border-border bg-secondary px-3 py-2 text-foreground focus:outline-none focus:ring-2 focus:ring-primary"
               >
@@ -125,6 +135,7 @@
               <input
                 id="create-server-private"
                 type="checkbox"
+                name="isPrivate"
                 [ngModel]="isPrivate()"
                 (ngModelChange)="isPrivate.set($event)"
                 class="h-4 w-4 rounded border-border bg-secondary"
@@ -145,6 +156,7 @@
               <input
                 id="create-server-password"
                 type="password"
+                name="serverPassword"
                 [ngModel]="password()"
                 (ngModelChange)="password.set($event)"
                 [placeholder]="'servers.create.passwordPlaceholder' | translate"
@@ -167,14 +179,13 @@
         </button>
         <button
           id="create-server-submit"
-          type="button"
+          type="submit"
           class="flex-1 rounded-lg bg-primary px-4 py-2 font-semibold text-primary-foreground transition-colors hover:bg-primary/90 disabled:cursor-not-allowed disabled:opacity-50"
           [disabled]="!canCreate"
-          (click)="createServer()"
         >
           {{ 'servers.create.submit' | translate }}
         </button>
       </div>
-    </div>
+    </form>
   </div>
 </div>