Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

user management frontend #89

Merged
merged 1 commit into from
Jul 10, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
38 changes: 29 additions & 9 deletions app/accounts/forms.py
Original file line number Diff line number Diff line change
@@ -1,22 +1,42 @@
from django import forms
from django.contrib.auth.forms import UserCreationForm
from django.contrib.auth.forms import AuthenticationForm, UserCreationForm
from django.utils.translation import gettext_lazy as _

from users.models import CustomUser


class CustomUserCreationForm(UserCreationForm):
email = forms.EmailField(required=True, help_text="Required. Add a valid email address.")
username = forms.CharField(required=True, help_text="Required. Add a valid username.")
first_name = forms.CharField(required=True, help_text="Required. Add a valid first name.")
last_name = forms.CharField(required=True, help_text="Required. Add a valid last name.")
email = forms.EmailField(
required=True,
help_text=_("Required. Add a valid email address."),
)
username = forms.CharField(
required=True,
help_text=_("Required. Add a valid username."),
)
first_name = forms.CharField(
required=True,
help_text=_("Required. Add a valid first name."),
)
last_name = forms.CharField(
required=True,
)

class Meta:
model = CustomUser
fields = ("username", "email", "first_name", "last_name")

def __init__(self, *args, **kwargs):
super(CustomUserCreationForm, self).__init__(*args, **kwargs)
self.fields["email"].required = True
self.fields["username"].required = True
self.fields["first_name"].required = True
self.fields["last_name"].required = True
for field_name, field in self.fields.items():
field.widget.attrs["class"] = "form-control"


class CustomAuthenticationForm(AuthenticationForm):
username = forms.CharField(label=_("Username"), help_text=_("Required. Enter your username."))
password = forms.CharField(label=_("Password"), help_text=_("Required. Enter your password."))

def __init__(self, *args, **kwargs):
super(CustomAuthenticationForm, self).__init__(*args, **kwargs)
for field in self.fields.values():
field.widget.attrs.update({"class": "form-control"})
20 changes: 17 additions & 3 deletions app/accounts/views.py
Original file line number Diff line number Diff line change
@@ -1,7 +1,8 @@
from django.contrib.auth import login
from django.contrib.auth import authenticate
from django.contrib.auth import login as auth_login
from django.shortcuts import redirect, render

from .forms import CustomUserCreationForm
from .forms import CustomAuthenticationForm, CustomUserCreationForm


def register(request):
Expand All @@ -11,8 +12,21 @@ def register(request):
user = form.save(commit=False)
user.is_staff = True
user.save()
login(request, user)
auth_login(request, user)
return redirect("home")
else:
form = CustomUserCreationForm()
return render(request, "accounts/register.html", {"form": form})


def user_login(request):
if request.method == "POST":
form = CustomAuthenticationForm(request, data=request.POST)
if form.is_valid():
user = form.get_user()
auth_login(request, user)
return redirect("home")
else:
form = CustomAuthenticationForm()

return render(request, "accounts/login.html", {"form": form})
12 changes: 10 additions & 2 deletions app/static/css/styles.css
Original file line number Diff line number Diff line change
Expand Up @@ -344,12 +344,20 @@ html {
font-size: 0.875rem;
}

/*Accounts*/
.user-account-body {
margin: 30px;
}

.login-form-group .form-control {
width: 100%;
max-width: 500px;
}

/*Error pages*/
.error-card {
.body-card {
border-color: var(--primary-red);
margin: 0 10px 0 10px;
margin: 10px;
width: 100%;
}

Expand Down
86 changes: 70 additions & 16 deletions app/templates/accounts/login.html
Original file line number Diff line number Diff line change
@@ -1,22 +1,76 @@
{% extends "base.html" %}
{% load static %}
{% load i18n %}

{% block title %}Log In{% endblock %}
{% block title %}{% trans "Log In" %}{% endblock %}

{% block content %}
<div class="container">
<h2>Log In</h2>
<form method="post">
{% csrf_token %}
{{ form }}
<button type="submit">Log In</button>
</form>

<br>
<hr>
<form method="post" action="{% url 'logout' %}">
{% csrf_token %}
<button type="submit">logout</button>
</form>
</div>
<div class="container">
<div class="section mt-3 mb-3">
<div class="card body-card">
<div class="user-account-body">
<h2>{% trans "Log In" %}</h2>
<br/>
<form method="post" class="text-left">
{% csrf_token %}

<!-- Username Field -->
<div class="form-group login-form-group mb-4">
<label for="id_username">{% trans "Username:" %}</label>
<input type="text" name="username" id="id_username" class="form-control" placeholder="{% trans 'Username' %}" value="{{ form.username.value|default:'' }}">
{% if form.username.help_text %}
<small class="form-text text-muted">{{ form.username.help_text }}</small>
{% endif %}
{% if form.username.errors %}
<div class="invalid-feedback d-block">
{% for error in form.username.errors %}
<p>{{ error }}</p>
{% endfor %}
</div>
{% endif %}
</div>

<!-- Password Field -->
<div class="form-group login-form-group mb-1">
<label for="id_password">{% trans "Password:" %}</label>
<input type="password" name="password" id="id_password" class="form-control" placeholder="{% trans 'Password' %}" value="{{ form.password.value|default:'' }}">
{% if form.password.help_text %}
<small class="form-text text-muted">{{ form.password.help_text }}</small>
{% endif %}
{% if form.password.errors %}
<div class="invalid-feedback d-block">
{% for error in form.password.errors %}
<p>{{ error }}</p>
{% endfor %}
</div>
{% endif %}
</div>

<!-- Log In Button and Forgot Password -->
<div class="form-group">
<a href="{% url 'password_reset' %}" class="d-block mb-2">{% trans "Forgot Password?" %}</a>

{% if form.non_field_errors %}
<div class="invalid-feedback d-block">
{% for error in form.non_field_errors %}
<p>{{ error }}</p>
{% endfor %}
</div>
{% endif %}

<button type="submit" class="btn btn-primary">{% trans "Log In" %}</button>
</div>
</form>

<br>
<hr>
<div class="form-group row">
<div class="col-sm-10">
<p>{% trans "Don't have an account?" %} <a href="{% url 'accounts_register' %}">{% trans "Create one" %}</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
20 changes: 15 additions & 5 deletions app/templates/accounts/password_reset_complete.html
Original file line number Diff line number Diff line change
@@ -1,11 +1,21 @@
{% extends 'base.html' %}
{% load static %}
{% load i18n %}

{% block title %}Password reset complete{% endblock %}
{% block title %}{% trans "Password reset complete" %}{% endblock %}

{% block content %}
<div class="container">
<p>Your password has been set. You may go ahead and log in now.</p>
<br>
<p><a href="{{ login_url }}">Log in</a></p>
<div class="section mt-3 mb-3">
<div class="card text-center body-card">
<div class="user-account-body">
<p>{% trans "Your password has been set. You may go ahead and log in now." %}</p>
<br>
<p>
<a href="{{ login_url }}" class="btn btn-primary">
{% trans "Log in" %}
</a>
</p>
</div>
</div>
</div>
{% endblock %}
63 changes: 35 additions & 28 deletions app/templates/accounts/password_reset_confirm.html
Original file line number Diff line number Diff line change
@@ -1,43 +1,50 @@
{% extends "base.html" %}
{% load static %}
{% load i18n %}

{% block title %}Enter new password{% endblock %}
{% block title %}{% trans "Enter new password" %}{% endblock %}

{% block content %}

{% if validlink %}

<div class="container">
<p>Please enter your new password twice so we can verify you typed it in correctly.</p>

<form method="post">{% csrf_token %}
<fieldset class="module aligned">
<div class="form-row field-password1">
{{ form.new_password1.errors }}
<div class="flex-container">
<label for="id_new_password1">New password:</label>
{{ form.new_password1 }}
<div class="section mt-3 mb-3">
<div class="card text-center body-card">
<div class="user-account-body">
<p>{% trans "Please enter your new password twice so we can verify you typed it in correctly." %}</p>

<form method="post">{% csrf_token %}
<fieldset class="module aligned">
<div class="form-row field-password1">
{{ form.new_password1.errors }}
<div class="flex-container">
<label for="id_new_password1">{% trans "New password:" %}</label>
{{ form.new_password1 }}
</div>
</div>
</div>
<div class="form-row field-password2">
{{ form.new_password2.errors }}
<div class="flex-container">
<label for="id_new_password2">Confirm password:</label>
{{ form.new_password2 }}
<div class="form-row field-password2">
{{ form.new_password2.errors }}
<div class="flex-container">
<label for="id_new_password2">{% trans "Confirm password:" %}</label>
{{ form.new_password2 }}
</div>
</div>
</fieldset>
<br>
<br>
<div class="submit-row">
<input type="submit" class="btn btn-primary" value="{% trans 'Change my password' %}">
</div>
</fieldset>
<br>
<br>
<div class="submit-row">
<input type="submit" value="Change my password">
</div>
</form>
</form>

{% else %}
{% else %}

<p>"The password reset link was invalid, possibly because it has already been used. Please request a new
password reset.</p>
<p>{% blocktrans %}The password reset link was invalid, possibly because it has already been used. Please request a new
password reset.{% endblocktrans %}</p>

{% endif %}
{% endif %}
</div>
</div>
</div>
</div>
{% endblock %}
16 changes: 11 additions & 5 deletions app/templates/accounts/password_reset_done.html
Original file line number Diff line number Diff line change
@@ -1,13 +1,19 @@
{% extends "base.html" %}
{% load static %}
{% load i18n %}

{% block title %}Email Sent{% endblock %}

{% block content %}
<div class="container">
<p>We’ve emailed you instructions for setting your password, if an account exists with the email you entered.
You should receive them shortly.</p>
<div class="section mt-3 mb-3">
<div class="card text-center body-card">
<div class="user-account-body">
<p>{% blocktrans %}We’ve emailed you instructions for setting your password, if an account exists with the email you entered.
You should receive them shortly.{% endblocktrans %}</p>

<p>If you don’t receive an email, please make sure you’ve entered the address you registered with, and check
your spam folder.</p>
<p>{% blocktrans %}If you don’t receive an email, please make sure you’ve entered the address you registered with, and check
your spam folder.{% endblocktrans %}</p>
</div>
</div>
</div>
{% endblock %}
44 changes: 25 additions & 19 deletions app/templates/accounts/password_reset_form.html
Original file line number Diff line number Diff line change
@@ -1,28 +1,34 @@
{% extends 'base.html' %}
{% load static %}
{% load i18n %}

{% block title %}Forgot Your Password?{% endblock %}
{% block title %}{% trans "Forgot Your Password?" %}{% endblock %}

{% block content %}
<div class="container">
<p>Forgotten your password? Enter your email address below, and we’ll email instructions for setting a new
one.</p>
<div class="section mt-3 mb-3">
<div class="card body-card">
<div class="user-account-body">
<p>{% blocktrans %}Forgotten your password? Enter your email address below, and we’ll email instructions for setting a new
one.{% endblocktrans %}</p>

<form method="post">
{% csrf_token %}
<fieldset class="module aligned">
<div class="form-row field-email">
{{ form.email.errors }}
<div class="flex-container">
<label for="id_email">Email address:</label>
{{ form.email }}
<form method="post">
{% csrf_token %}
<fieldset class="module aligned">
<div class="form-row field-email">
{{ form.email.errors }}
<div class="flex-container">
<label for="id_email">{% trans "Email address:" %}</label>
{{ form.email }}
</div>
</div>
</fieldset>
<div class="submit-row">
<br>
<br>
<input type="submit" class="btn btn-primary" value="{% trans 'Reset my password' %}">
</div>
</fieldset>
<div class="submit-row">
<br>
<br>
<input type="submit" value="Reset my password">
</div>
</form>
</form>
</div>
</div>
</div>
{% endblock %}
Loading
Loading