Fix broken password change feature

Closes #300 Actually I had to refactor the whole profile page's layout and split it into 3 pages
WoTTsecurity · Jul 8, 2019 · 95c49fd · 95c49fd
1 parent 3c6605e
commit 95c49fd
Show file tree

Hide file tree

Showing 13 changed files with 291 additions and 174 deletions.
diff --git a/backend/backend/settings/base.py b/backend/backend/settings/base.py
@@ -66,6 +66,7 @@ def check_ip_range(ipr):
     'tagulous',
     'device_registry.apps.DeviceRegistryConfig',
     'profile_page.apps.ProfilePageConfig',
+    'bootstrap4'
 ]
 
 MIDDLEWARE = [

diff --git a/backend/profile_page/forms.py b/backend/profile_page/forms.py
@@ -2,7 +2,8 @@
 
 
 class ProfileForm(forms.Form):
-    email = forms.CharField()
-    first_name = forms.CharField(required=False)
-    last_name = forms.CharField(required=False)
-    company = forms.CharField(required=False)
+    username = forms.CharField(disabled=True)
+    email = forms.EmailField()
+    first_name = forms.CharField(max_length=30, required=False)
+    last_name = forms.CharField(max_length=150, required=False)
+    company = forms.CharField(max_length=128, required=False)
diff --git a/backend/profile_page/migrations/0003_auto_20190705_1446.py b/backend/profile_page/migrations/0003_auto_20190705_1446.py
@@ -0,0 +1,19 @@
+# Generated by Django 2.1.10 on 2019-07-05 14:46
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('profile_page', '0002_auto_20190605_1012'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='profile',
+            name='company_name',
+            field=models.CharField(blank=True, default='', max_length=128),
+            preserve_default=False,
+        ),
+    ]
diff --git a/backend/profile_page/migrations/0004_merge_20190708_0744.py b/backend/profile_page/migrations/0004_merge_20190708_0744.py
@@ -0,0 +1,14 @@
+# Generated by Django 2.1.10 on 2019-07-08 07:44
+
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('profile_page', '0003_auto_20190705_1446'),
+        ('profile_page', '0003_profile_last_active'),
+    ]
+
+    operations = [
+    ]
diff --git a/backend/profile_page/models.py b/backend/profile_page/models.py
@@ -11,5 +11,5 @@ def user_save_lower(sender, instance, *args, **kwargs):
 
 class Profile(models.Model):
     user = models.OneToOneField(User, on_delete=models.CASCADE)
-    company_name = models.CharField(blank=True, null=True, max_length=128)
     last_active = models.DateField(null=True, blank=True)
+    company_name = models.CharField(blank=True, max_length=128)
diff --git a/backend/profile_page/templates/profile.html b/backend/profile_page/templates/profile.html
diff --git a/backend/profile_page/templates/profile_account.html b/backend/profile_page/templates/profile_account.html
@@ -0,0 +1,61 @@
+{% extends "admin_base.html" %}
+
+{% load bootstrap4 %}
+
+{% block title %}WoTT - Dashboard{% endblock title %}
+
+{% block dashboard_title %}
+  <h1 style="margin-bottom: 0">Dashboard</h1>
+{% endblock dashboard_title %}
+
+{% block admin_content %}
+  <div class="container-fluid p-0">
+
+    <h1 class="h3 mb-3">Settings</h1>
+
+    <div class="row">
+      <div class="col-md-3 col-xl-2">
+
+        <div class="card">
+          <div class="card-header">
+            <h5 class="card-title mb-0">Profile Settings</h5>
+          </div>
+
+          <div class="list-group list-group-flush" role="tablist">
+            <a class="list-group-item list-group-item-action active" href="{% url 'profile' %}" role="tab">
+              Account
+            </a>
+            <a class="list-group-item list-group-item-action" href="{% url 'profile_password' %}" role="tab">
+              Password
+            </a>
+            <a class="list-group-item list-group-item-action" href="{% url 'profile_token' %}" role="tab">
+              API token
+            </a>
+          </div>
+        </div>
+      </div>
+
+      <div class="col-md-9 col-xl-10">
+        <div class="tab-content">
+          <div class="tab-pane fade show active" id="account" role="tabpanel">
+
+            <div class="card">
+              <div class="card-header">
+                <h5 class="card-title mb-0">Public info</h5>
+              </div>
+              <div class="card-body">
+                <form method="POST" action="">
+                  {% csrf_token %}
+                  {% bootstrap_form form %}
+                  {% buttons %}
+                    <button type="submit" class="btn btn-primary">Save changes</button>
+                  {% endbuttons %}
+                </form>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+{% endblock %}
diff --git a/backend/profile_page/templates/profile_password.html b/backend/profile_page/templates/profile_password.html
@@ -0,0 +1,61 @@
+{% extends "admin_base.html" %}
+
+{% load bootstrap4 %}
+
+{% block title %}WoTT - Dashboard{% endblock title %}
+
+{% block dashboard_title %}
+  <h1 style="margin-bottom: 0">Dashboard</h1>
+{% endblock dashboard_title %}
+
+{% block admin_content %}
+  <div class="container-fluid p-0">
+
+    <h1 class="h3 mb-3">Settings</h1>
+
+    <div class="row">
+      <div class="col-md-3 col-xl-2">
+
+        <div class="card">
+          <div class="card-header">
+            <h5 class="card-title mb-0">Profile Settings</h5>
+          </div>
+
+          <div class="list-group list-group-flush" role="tablist">
+            <a class="list-group-item list-group-item-action" href="{% url 'profile' %}" role="tab">
+              Account
+            </a>
+            <a class="list-group-item list-group-item-action active" href="{% url 'profile_password' %}" role="tab">
+              Password
+            </a>
+            <a class="list-group-item list-group-item-action" href="{% url 'profile_token' %}" role="tab">
+              API token
+            </a>
+          </div>
+        </div>
+      </div>
+
+      <div class="col-md-9 col-xl-10">
+        <div class="tab-content">
+          <div class="tab-pane fade show active" id="account" role="tabpanel">
+
+            <div class="card">
+              <div class="card-header">
+                <h5 class="card-title mb-0">Password</h5>
+              </div>
+              <div class="card-body">
+                <form method="POST" action="">
+                  {% csrf_token %}
+                  {% bootstrap_form form %}
+                  {% buttons %}
+                    <button type="submit" class="btn btn-primary">Save changes</button>
+                  {% endbuttons %}
+                </form>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+{% endblock %}
diff --git a/backend/profile_page/templates/profile_token.html b/backend/profile_page/templates/profile_token.html
@@ -0,0 +1,59 @@
+{% extends "admin_base.html" %}
+
+{% load bootstrap4 %}
+
+{% block title %}WoTT - Dashboard{% endblock title %}
+
+{% block dashboard_title %}
+  <h1 style="margin-bottom: 0">Dashboard</h1>
+{% endblock dashboard_title %}
+
+{% block admin_content %}
+  <div class="container-fluid p-0">
+
+    <h1 class="h3 mb-3">Settings</h1>
+
+    <div class="row">
+      <div class="col-md-3 col-xl-2">
+
+        <div class="card">
+          <div class="card-header">
+            <h5 class="card-title mb-0">Profile Settings</h5>
+          </div>
+
+          <div class="list-group list-group-flush" role="tablist">
+            <a class="list-group-item list-group-item-action" href="{% url 'profile' %}" role="tab">
+              Account
+            </a>
+            <a class="list-group-item list-group-item-action" href="{% url 'profile_password' %}" role="tab">
+              Password
+            </a>
+            <a class="list-group-item list-group-item-action active" href="{% url 'profile_token' %}" role="tab">
+              API token
+            </a>
+          </div>
+        </div>
+      </div>
+
+      <div class="col-md-9 col-xl-10">
+        <div class="tab-content">
+          <div class="tab-pane fade show active" role="tabpanel">
+            <div class="card">
+              <div class="card-header">
+                <h5 class="card-title mb-0">API token</h5>
+              </div>
+              <div class="card-body">
+                {% if user.auth_token %}
+                  <div class="form-group"><b><samp id="token-code">{{ user.auth_token }}</samp></b></div>
+                  <a href="{% url 'revoke_api_token' %}" class="btn btn-danger">Revoke token</a>
+                {% else %}
+                  <a href="{% url 'generate_api_token' %}" class="btn btn-primary">Generate token</a>
+                {% endif %}
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+{% endblock %}