From c040a5077a1a363297e4db1f295b74e413ce43fd Mon Sep 17 00:00:00 2001
From: Robert <rw@roko.li>
Date: Wed, 14 Apr 2021 10:30:52 +0200
Subject: [PATCH] Register account with email and password

---
 .eslintrc.js                                  |  1 +
 package-lock.json                             | 11 +++
 package.json                                  |  2 +
 src/api.ts                                    | 68 +++++++++++++
 src/components/LoginForm.vue                  | 15 ++-
 .../migrations/0003_auto_20210414_0827.py     | 31 ++++++
 userausfall/models.py                         | 98 ++++++++++++++++++-
 userausfall/rest_api/urls.py                  |  2 +-
 userausfall/settings.py                       |  1 +
 userausfall/urls.py                           |  3 +-
 vue.config.js                                 | 13 +++
 11 files changed, 236 insertions(+), 9 deletions(-)
 create mode 100644 src/api.ts
 create mode 100644 userausfall/migrations/0003_auto_20210414_0827.py
 create mode 100644 vue.config.js

diff --git a/.eslintrc.js b/.eslintrc.js
index 95800e3..7324f13 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -16,5 +16,6 @@ module.exports = {
   rules: {
     "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
     "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
+    "@typescript-eslint/no-explicit-any": "off",
   },
 };
diff --git a/package-lock.json b/package-lock.json
index 1c69979..fa5fc60 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1300,6 +1300,12 @@
         "@types/node": "*"
       }
     },
+    "@types/js-cookie": {
+      "version": "2.2.6",
+      "resolved": "https://registry.npmjs.org/@types/js-cookie/-/js-cookie-2.2.6.tgz",
+      "integrity": "sha512-+oY0FDTO2GYKEV0YPvSshGq9t7YozVkgvXLty7zogQNuCxBhT9/3INX9Q7H1aRZ4SUDRXAKlJuA4EA5nTt7SNw==",
+      "dev": true
+    },
     "@types/json-schema": {
       "version": "7.0.7",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.7.tgz",
@@ -7622,6 +7628,11 @@
         }
       }
     },
+    "js-cookie": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-2.2.1.tgz",
+      "integrity": "sha512-HvdH2LzI/EAZcUwA8+0nKNtWHqS+ZmijLA30RwZA0bo7ToCckjK5MkGhjED9KoRcXO6BaGI3I9UIzSA1FKFPOQ=="
+    },
     "js-message": {
       "version": "1.0.7",
       "resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.7.tgz",
diff --git a/package.json b/package.json
index 79a7c10..fc6f90b 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,7 @@
   "dependencies": {
     "buefy": "^0.9.6",
     "core-js": "^3.6.5",
+    "js-cookie": "^2.2.1",
     "register-service-worker": "^1.7.1",
     "vue": "^2.6.11",
     "vue-class-component": "^7.2.3",
@@ -17,6 +18,7 @@
     "vue-router": "^3.2.0"
   },
   "devDependencies": {
+    "@types/js-cookie": "^2.2.6",
     "@typescript-eslint/eslint-plugin": "^4.18.0",
     "@typescript-eslint/parser": "^4.18.0",
     "@vue/cli-plugin-babel": "~4.5.0",
diff --git a/src/api.ts b/src/api.ts
new file mode 100644
index 0000000..e23d953
--- /dev/null
+++ b/src/api.ts
@@ -0,0 +1,68 @@
+import Cookies from "js-cookie";
+
+class APIError extends Error {
+  constructor(message: string, public readonly errors: unknown) {
+    super(message);
+  }
+}
+
+class Model {
+  static async fetch(
+    method: "get" | "post",
+    endpoint: string,
+    item_callback: (item: any) => any
+  ) {
+    const init = {
+      headers: new Headers(),
+      method: method,
+      //body: JSON.stringify({})
+    };
+    const csrfToken = Cookies.get("csrftoken");
+    if (csrfToken != undefined) {
+      init.headers.set("X-CSRFToken", csrfToken);
+    }
+    init.headers.set("Accept", "application/json");
+    init.headers.set("Content-Type", "application/json");
+    const response = await fetch(`/api/${endpoint}`, init);
+    const dataOrErrors: Array<any> = await response.json();
+    if (response.status === 200) {
+      return dataOrErrors.map(item_callback);
+    } else {
+      throw new APIError(response.statusText, dataOrErrors);
+    }
+  }
+
+  protected async create(endpoint: string, data: any) {
+    const init = {
+      headers: new Headers(),
+      method: "post",
+      body: JSON.stringify(data),
+    };
+    const csrfToken = Cookies.get("csrftoken");
+    if (csrfToken != undefined) {
+      init.headers.set("X-CSRFToken", csrfToken);
+    }
+    init.headers.set("Accept", "application/json");
+    init.headers.set("Content-Type", "application/json");
+    const response = await fetch(`/api/${endpoint}/`, init);
+    const dataOrErrors: Array<any> = await response.json();
+    if (response.status !== 201) {
+      throw new APIError(response.statusText, dataOrErrors);
+    }
+  }
+}
+
+interface UserData {
+  email: string;
+  password: string;
+}
+
+export class User extends Model implements UserData {
+  constructor(public email: string, public password: string) {
+    super();
+  }
+
+  async signup(): Promise<void> {
+    await super.create("users", { email: this.email, password: this.password });
+  }
+}
diff --git a/src/components/LoginForm.vue b/src/components/LoginForm.vue
index b750f6d..d1d2d3d 100644
--- a/src/components/LoginForm.vue
+++ b/src/components/LoginForm.vue
@@ -1,10 +1,10 @@
 <template>
-  <form class="box" @submit.prevent="">
+  <form class="box" @submit.prevent="doSignup">
     <b-field label="E-Mail-Adresse">
-      <b-input type="email" icon="user" ref="email" />
+      <b-input type="email" v-model="user.email" />
     </b-field>
     <b-field label="Kennwort">
-      <b-input type="password" icon="key" />
+      <b-input type="password" v-model="user.password" />
     </b-field>
 
     <div v-if="false" class="notification is-danger">
@@ -25,7 +25,14 @@
 
 <script lang="ts">
 import { Component, Vue } from "vue-property-decorator";
+import { User } from "@/api";
 
 @Component
-export default class LoginForm extends Vue {}
+export default class LoginForm extends Vue {
+  private user = new User("", "");
+
+  private async doSignup() {
+    await this.user.signup();
+  }
+}
 </script>
diff --git a/userausfall/migrations/0003_auto_20210414_0827.py b/userausfall/migrations/0003_auto_20210414_0827.py
new file mode 100644
index 0000000..6a126ae
--- /dev/null
+++ b/userausfall/migrations/0003_auto_20210414_0827.py
@@ -0,0 +1,31 @@
+# Generated by Django 2.2.13 on 2021-04-14 08:27
+
+import django.contrib.auth.validators
+from django.db import migrations, models
+import userausfall.models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('userausfall', '0002_accountrequest'),
+    ]
+
+    operations = [
+        migrations.AlterModelManagers(
+            name='user',
+            managers=[
+                ('objects', userausfall.models.UserManager()),
+            ],
+        ),
+        migrations.AlterField(
+            model_name='user',
+            name='email',
+            field=models.EmailField(blank=True, max_length=254, unique=True, verbose_name='email address'),
+        ),
+        migrations.AlterField(
+            model_name='user',
+            name='username',
+            field=models.CharField(blank=True, error_messages={'unique': 'A user with that username already exists.'}, help_text='Required. 150 characters or fewer. Letters, digits and @/./+/-/_ only.', max_length=150, validators=[django.contrib.auth.validators.UnicodeUsernameValidator()], verbose_name='username'),
+        ),
+    ]
diff --git a/userausfall/models.py b/userausfall/models.py
index 4a6bf46..ec4ed30 100644
--- a/userausfall/models.py
+++ b/userausfall/models.py
@@ -1,9 +1,101 @@
-from django.contrib.auth.models import AbstractUser
+from django.contrib.auth.base_user import AbstractBaseUser, BaseUserManager
+from django.contrib.auth.models import PermissionsMixin
+from django.contrib.auth.validators import UnicodeUsernameValidator
 from django.db import models
+from django.utils import timezone
+from django.utils.translation import gettext_lazy as _
 
 
-class User(AbstractUser):
-    pass
+class UserManager(BaseUserManager):
+    use_in_migrations = True
+
+    def _create_user(self, email, password, **extra_fields):
+        """
+        Create and save a user with the given username, email, and password.
+        """
+        email = self.normalize_email(email)
+        # TODO: username = self.model.normalize_username(username)
+        user = self.model(email=email, **extra_fields)
+        user.set_password(password)
+        user.save(using=self._db)
+        return user
+
+    def create_user(self, email, password=None, **extra_fields):
+        extra_fields.setdefault('is_staff', False)
+        extra_fields.setdefault('is_superuser', False)
+        return self._create_user(email, password, **extra_fields)
+
+    def create_superuser(self, username, email, password, **extra_fields):
+        extra_fields.setdefault('is_staff', True)
+        extra_fields.setdefault('is_superuser', True)
+
+        if extra_fields.get('is_staff') is not True:
+            raise ValueError('Superuser must have is_staff=True.')
+        if extra_fields.get('is_superuser') is not True:
+            raise ValueError('Superuser must have is_superuser=True.')
+
+        return self._create_user(username, email, password, **extra_fields)
+
+
+class User(AbstractBaseUser, PermissionsMixin):
+    username_validator = UnicodeUsernameValidator()
+
+    username = models.CharField(
+        _('username'),
+        max_length=150,
+        help_text=_('Required. 150 characters or fewer. Letters, digits and @/./+/-/_ only.'),
+        validators=[username_validator],
+        error_messages={
+            'unique': _("A user with that username already exists."),
+        },
+        blank=True,
+    )
+    first_name = models.CharField(_('first name'), max_length=30, blank=True)
+    last_name = models.CharField(_('last name'), max_length=150, blank=True)
+    email = models.EmailField(_('email address'), unique=True, blank=True)
+    is_staff = models.BooleanField(
+        _('staff status'),
+        default=False,
+        help_text=_('Designates whether the user can log into this admin site.'),
+    )
+    is_active = models.BooleanField(
+        _('active'),
+        default=True,
+        help_text=_(
+            'Designates whether this user should be treated as active. '
+            'Unselect this instead of deleting accounts.'
+        ),
+    )
+    date_joined = models.DateTimeField(_('date joined'), default=timezone.now)
+
+    objects = UserManager()
+
+    EMAIL_FIELD = 'email'
+    USERNAME_FIELD = 'email'
+    REQUIRED_FIELDS = []
+
+    class Meta:
+        verbose_name = _('user')
+        verbose_name_plural = _('users')
+
+    def clean(self):
+        super().clean()
+        self.email = self.__class__.objects.normalize_email(self.email)
+
+    def get_full_name(self):
+        """
+        Return the first_name plus the last_name, with a space in between.
+        """
+        full_name = '%s %s' % (self.first_name, self.last_name)
+        return full_name.strip()
+
+    def get_short_name(self):
+        """Return the short name for the user."""
+        return self.first_name
+
+    def email_user(self, subject, message, from_email=None, **kwargs):
+        """Send an email to this user."""
+        send_mail(subject, message, from_email, [self.email], **kwargs)
 
 
 class AccountRequest(models.Model):
diff --git a/userausfall/rest_api/urls.py b/userausfall/rest_api/urls.py
index 6ebc0df..4c9629f 100644
--- a/userausfall/rest_api/urls.py
+++ b/userausfall/rest_api/urls.py
@@ -2,5 +2,5 @@ from rest_framework import routers
 
 from userausfall.rest_api.views import AccountRequestViewSet
 
-router = routers.DefaultRouter(trailing_slash=False)
+router = routers.DefaultRouter(trailing_slash=True)
 router.register(r'account_requests', AccountRequestViewSet)
diff --git a/userausfall/settings.py b/userausfall/settings.py
index e933f75..7dd20ce 100644
--- a/userausfall/settings.py
+++ b/userausfall/settings.py
@@ -38,6 +38,7 @@ INSTALLED_APPS = [
     'django.contrib.staticfiles',
     'userausfall',
     'rest_framework',
+    'djoser',
 ]
 
 MIDDLEWARE = [
diff --git a/userausfall/urls.py b/userausfall/urls.py
index f442c90..d2525fe 100644
--- a/userausfall/urls.py
+++ b/userausfall/urls.py
@@ -5,5 +5,6 @@ from userausfall.rest_api import urls as rest_api_urls
 
 urlpatterns = [
     path('admin/', admin.site.urls),
-    path('api/', include(rest_api_urls.router.urls))
+    path('api/', include(rest_api_urls.router.urls)),
+    path('api/', include('djoser.urls')),
 ]
diff --git a/vue.config.js b/vue.config.js
new file mode 100644
index 0000000..8d24cc8
--- /dev/null
+++ b/vue.config.js
@@ -0,0 +1,13 @@
+/**
+ * @type {import('@vue/cli-service').ProjectOptions}
+ */
+module.exports = {
+  outputDir: "build/webapp",
+  devServer: {
+    proxy: {
+      "/api": {
+        target: "http://localhost:8000",
+      },
+    },
+  },
+};