Work on login form stuff

frontend-reactive/app/components/auth/login.hbs

@@ -0,0 +1,12 @@
+<div class="login-wrapper">
+  <label>
+    <Input
+      @type="text"
+      @value={{this.username}}
+      @placeholder="Username"
+    />
+  </label>
+  <div type="button" class="login-start-button" {{on "click" this.onLoginStart}}>
+    Login
+  </div>
+</div>

frontend-reactive/app/components/auth/login.ts

@@ -0,0 +1,24 @@
+import { action } from '@ember/object'
+import Component from '@glimmer/component'
+import { tracked } from '@glimmer/tracking'
+
+export interface AuthLoginSignature {
+  // The arguments accepted by the component
+  Args: {}
+  // Any blocks yielded by the component
+  Blocks: {
+    default: []
+  }
+  // The element to which `...attributes` is applied in the component template
+  Element: null
+}
+
+export default class AuthLogin extends Component<AuthLoginSignature> {
+  @tracked username = ''
+
+  @action onLoginStart() {
+    console.log('Starting login for username ' + this.username)
+    // Check if username is approved for login
+    // If it is, continue with login
+  }
+}

frontend-reactive/app/components/auth/post-registration-form.hbs

@@ -1,6 +1,6 @@
 <div class="registration-form">
   <h1 class="registration-form-username">username: {{this.args.username}}</h1>
-  <div class="registration-form-displayname">
+  <div class="registration-form-displayname-wrapper">
     <label>
       Displayname
       <Input
@@ -10,7 +10,7 @@
       />
     </label>
   </div>
-  <div class="registration-form-description">
+  <div class="registration-form-description-wrapper">
     <label>
       Description
       <Input
@@ -20,13 +20,13 @@
       />
     </label>
   </div>
-  <div class="registration-form-mail">
-    <label>
-      Email
-      <Input @type="text" @value={{this.email}} placeholder="Email address" />
-    </label>
-  </div>
-  <div class="registration-form-gender">
+  {{!--<div class="registration-form-mail-wrapper">--}}
+  {{!--  <label>--}}
+  {{!--    Email--}}
+  {{!--    <Input @type="text" @value={{this.email}} placeholder="Email address" />--}}
+  {{!--  </label>--}}
+  {{!--</div>--}}
+  <div class="registration-form-gender-wrapper">
     <Util::StringArray
       @list={{this.gender}}
       @onNewElement={{this.genderAddedHandler}}
@@ -34,10 +34,10 @@
     />
   </div>
   <p>{{this.extracted}}</p>
-  <div class="register-form-being">
+  <div class="register-form-being-wrapper">
     <Util::Multiselect @elements={{this.beingTypes}} />
   </div>
-  <div class="register-form-default-post-mode">
+  <div class="register-form-default-post-mode-wrapper">
     <Util::OneOfArray
       @elements={{array "Public" "Local" "Followers" "Direct"}}
       @selected={{this.defaultpostmode}}
@@ -45,7 +45,7 @@
       @required={{true}}
     />
   </div>
-  <div class="register-form-follow-approval">
+  <div class="register-form-follow-approval-wrapper">
     <label>
       Require approval for follow requests
       <Input
@@ -55,15 +55,14 @@
       />
     </label>
   </div>
-  <div class="register-form-indexable">
+  <div class="register-form-indexable-wrapper">
     <label>
       Whether the account is indexable
       <Input @type="checkbox" name="Indexable" @checked={{this.indexable}} />
     </label>
   </div>
-  <div class="register-form-custom-fields">
+  <div class="register-form-custom-fields-wrapper">
     <Util::MapEdit @list={{this.customProperties}} />
   </div>
-  {{! TODO: Custom fields (Two string arrays, lets go. Definitely won't be a pain to sync them up) }}
   {{! TODO: Icon, Background, Banner }}
-</div>
+</div>

frontend-reactive/app/components/auth/post-registration-form.ts

@@ -1,7 +1,7 @@
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 
-export interface AuthRegistrationFormSignature {
+export interface AuthPostRegistrationFormSignature {
   // The arguments accepted by the component
   Args: {
     username: string;
@@ -14,7 +14,7 @@ export interface AuthRegistrationFormSignature {
   Element: null;
 }
 
-export default class AuthRegistrationForm extends Component<AuthRegistrationFormSignature> {
+export default class AuthPostRegistrationForm extends Component<AuthPostRegistrationFormSignature> {
   @tracked displayname: string = this.args.username;
   @tracked description: string = '';
   @tracked gender: Array<{ value: string }> = [];

frontend-reactive/app/components/auth/register-start.hbs

@@ -0,0 +1 @@
+{{yield}}

frontend-reactive/app/components/auth/register-start.ts

@@ -0,0 +1,14 @@
+import Component from '@glimmer/component';
+
+export interface AuthRegisterStartSignature {
+  // The arguments accepted by the component
+  Args: {};
+  // Any blocks yielded by the component
+  Blocks: {
+    default: [];
+  };
+  // The element to which `...attributes` is applied in the component template
+  Element: null;
+}
+
+export default class AuthRegisterStart extends Component<AuthRegisterStartSignature> {}