Merge lp:~deadlight/canonical-identity-provider/password-reset into lp:~deadlight/canonical-identity-provider/vanilla

Proposed by Karl Williams
Status: Merged
Approved by: Karl Williams
Approved revision: 1696
Merged at revision: 1696
Proposed branch: lp:~deadlight/canonical-identity-provider/password-reset
Merge into: lp:~deadlight/canonical-identity-provider/vanilla
Prerequisite: lp:~deadlight/canonical-identity-provider/faq
Diff against target: 264 lines (+93/-80)
4 files modified
src/webui/templates/bad_token.html (+19/-11)
src/webui/templates/registration/email_sent.html (+31/-34)
src/webui/templates/registration/forgot_password.html (+27/-21)
src/webui/templates/registration/reset_password.html (+16/-14)
To merge this branch: bzr merge lp:~deadlight/canonical-identity-provider/password-reset
Reviewer Review Type Date Requested Status
Anthony Dillon (community) Approve
Karl Williams Pending
Review via email: mp+370763@code.launchpad.net

Description of the change

Updated the password reset flow to Vanilla Framework

----

QA:

 - setup your environment as per the README
 - source ./env/bin/activate
 - make mail-debug
 [NEW TERMINAL]
 - source ./env/bin/activate
 - make start-db
 - make run
 - go to [HOST]:8000
 - Create a new user
 - Logout
 - Click "forgot password" under the login form
 - Check the page styling
 - Enter the email address for the created user and submit the form
 - Check the styling of the second step
 - Check the other terminal terminal to see the email that would be sent and copy the link provided
 - Check the styling of the form and submit
 - You can check the styling for the error where the link from the email is invalid buy visiting: [HOST]:8000/+bad-token

To post a comment you must log in.
Revision history for this message
Barry McGee (barry-mcgee) wrote :

Unfortunately cannot yet QA due to local env setup issues
Have eyeballed the code and raised some issues inline.

1696. By Karl Williams

Update spellings, fix malformed markup, hide email field correctly on password reset

Revision history for this message
Karl Williams (deadlight) wrote :

I've pushed fixes for all comments

Revision history for this message
Anthony Dillon (ya-bo-ng) wrote :

LGTM

review: Approve

Preview Diff

[H/L] Next/Prev Comment, [J/K] Next/Prev File, [N/P] Next/Prev Hunk
1=== modified file 'src/webui/templates/bad_token.html'
2--- src/webui/templates/bad_token.html 2013-02-27 12:19:30 +0000
3+++ src/webui/templates/bad_token.html 2019-08-05 13:48:06 +0000
4@@ -1,24 +1,32 @@
5-{% extends "base.html" %}
6+{% extends "vanilla/base.html" %}
7 {% load i18n %}
8 {% load static_url %}
9
10 {% comment %}
11-Copyright 2010 Canonical Ltd. This software is licensed under the
12+Copyright 2010-2019 Canonical Ltd. This software is licensed under the
13 GNU Affero General Public License version 3 (see the file LICENSE).
14 {% endcomment %}
15
16-{% block title %}{% trans "Unauthorized confirmation code" %}{% endblock %}
17+{% block title %}{% trans "Unauthorised confirmation code" %}{% endblock %}
18
19 {% block text_title %}
20- <h1 class="main">{% trans "Unauthorized confirmation code" %}</h1>
21+<h1>{% trans "Unauthorised confirmation code" %}</h1>
22 {% endblock %}
23
24 {% block content %}
25-<p>{% blocktrans %}You are not authorized to use this confirmation code.
26-If this URL was sent to you by email, please make sure you open it in the same browser where you requested it.
27-{% endblocktrans %}</p>
28-
29-<p>{% blocktrans %}You can also seek further assistance on:{% endblocktrans %}</p>
30-
31-<a href="{{ 'support_form'|static_url }}">{{ "support_form"|static_url }}</a>
32+<section class="p-strip">
33+ <div class="row">
34+ <div class="col-8">
35+ <div class="p-notification--negative">
36+ <p class="p-notification__response">
37+ <span class="p-notification__status">Error:</span>{% blocktrans %}You are not authorised to use this confirmation code.
38+ If this URL was sent to you by email, please make sure you open it in the same browser where you requested it.
39+ {% endblocktrans %}
40+ </p>
41+ </div>
42+ <p>{% blocktrans %}You can also seek further assistance on:{% endblocktrans %}</p>
43+ <p><a href="{{ 'support_form'|static_url }}">{{ "support_form"|static_url }}</a></p>
44+ </div>
45+ </div>
46+</section>
47 {% endblock %}
48
49=== modified file 'src/webui/templates/registration/email_sent.html'
50--- src/webui/templates/registration/email_sent.html 2017-02-26 13:52:43 +0000
51+++ src/webui/templates/registration/email_sent.html 2019-08-05 13:48:06 +0000
52@@ -1,4 +1,4 @@
53-{% extends "base.html" %}
54+{% extends "vanilla/base.html" %}
55 {% load i18n %}
56 {% load static_url %}
57 {% load url_with_token %}
58@@ -13,36 +13,33 @@
59 {% block title %}{{ email_heading }}{% endblock %}
60
61 {% block text_title %}
62- <h1 class="u1-h-main u1-h-pair">{{ email_heading }}</h1>
63- <h2 class="u1-h-med u1-h-pair">{% trans "Step 2 of 3: Check your email" %}</h2>
64+ <h1>{{ email_heading }}</h1>
65 {% endblock %}
66
67 {% block content %}
68-
69-{% if user.is_authenticated %}<div class="email-sent-auth">{% endif %}
70-
71-<div>
72- <div>
73- <p class="larger">{{ email_reason|safe }}</p>
74- </div>
75-
76-{% if not readonly %}
77- <p>
78+<section class="p-strip">
79+ <div class="row">
80+ <div class="col-8">
81+ <h2 class="p-heading--three">{% trans "Step 2 of 3: Check your email" %}</h2>
82+ {% if user.is_authenticated %}<div class="email-sent-auth">{% endif %}
83+ <p class="larger">{{ email_reason|safe }}</p>
84+ {% if not readonly %}
85+ <p>
86 {% url_with_token 'account-emails' as emails_url %}
87 {% if user.is_authenticated %}<a href="{{ emails_url }}" data-qa-id="return_to_email_addresses_link">{% blocktrans %}Return to email addresses{% endblocktrans %}</a>{% endif %}
88- </p>
89-{% endif %}
90-</div>
91-
92-<div class="password-reset-advice">
93- <h2 class=u1-h-small>{% trans "Haven&rsquo;t received the email within a couple of minutes?" %}</h2>
94- <ul class=u1-list>
95- <li>{% blocktrans %}Make sure you typed the right email address.{% endblocktrans %}</li>
96- <li>{% blocktrans %}Check your spam folder.{% endblocktrans %}</li>
97- <li>{% blocktrans with url='support_form'|static_url %}Still nothing? Contact <a href="{{ url }}">Ubuntu One Support</a>{% endblocktrans %}</li>
98- </ul>
99-</div>
100-
101+ </p>
102+ {% endif %}
103+ <div class="password-reset-advice">
104+ <h2 class="p-heading--three">{% trans "Haven&rsquo;t received the email within a couple of minutes?" %}</h2>
105+ <ul class="p-list">
106+ <li class="p-list__item is-ticked">{% blocktrans %}Make sure you typed the right email address.{% endblocktrans %}</li>
107+ <li class="p-list__item is-ticked">{% blocktrans %}Check your spam folder.{% endblocktrans %}</li>
108+ <li class="p-list__item is-ticked">{% blocktrans with url='support_form'|static_url %}Still nothing? Contact <a href="{{ url }}">Ubuntu One Support</a>{% endblocktrans %}</li>
109+ </ul>
110+ </div>
111+ </div>
112+ </div>
113+</section>
114 {% if user.is_authenticated %}</div>{% endif %}
115
116 {% endblock %}
117@@ -50,14 +47,14 @@
118 {% block extra_js %}
119 <script>
120 YUI().use('node', function (Y) {
121- Y.one('#confirmation_code').on(['keyup', 'focus', 'blur', 'change'], function() {
122- var code = Y.one('#confirmation_code').get('value');
123- if (code.length === 0) {
124- Y.one('#submit').setAttribute('disabled', 'true');
125- } else {
126- Y.one('#submit').removeAttribute('disabled');
127- }
128- });
129+ Y.one('#confirmation_code').on(['keyup', 'focus', 'blur', 'change'], function() {
130+ var code = Y.one('#confirmation_code').get('value');
131+ if (code.length === 0) {
132+ Y.one('#submit').setAttribute('disabled', 'true');
133+ } else {
134+ Y.one('#submit').removeAttribute('disabled');
135+ }
136+ });
137 });
138 </script>
139 {% endblock %}
140
141=== modified file 'src/webui/templates/registration/forgot_password.html'
142--- src/webui/templates/registration/forgot_password.html 2013-10-18 12:59:55 +0000
143+++ src/webui/templates/registration/forgot_password.html 2019-08-05 13:48:06 +0000
144@@ -1,8 +1,8 @@
145-{% extends "base.html" %}
146+{% extends "vanilla/base.html" %}
147 {% load i18n %}
148
149 {% comment %}
150-Copyright 2010 Canonical Ltd. This software is licensed under the
151+Copyright 2010-2019 Canonical Ltd. This software is licensed under the
152 GNU Affero General Public License version 3 (see the file LICENSE).
153 {% endcomment %}
154
155@@ -11,34 +11,40 @@
156 {% block title %}{% trans "Reset password" %}{% endblock %}
157
158 {% block text_title %}
159- <h1 class="u1-h-main u1-h-pair">{% trans "Reset password" %}</h1>
160- <h2 class="u1-h-med u1-h-pair">{% trans "Step 1 of 3: Type your email address" %}</h2>
161+<h1>{% trans "Reset password" %}</h1>
162 {% endblock %}
163
164 {% block content_id %}auth{% endblock %}
165
166 {% block content %}
167- <p>{% blocktrans %}Enter your email address, and we will send you instructions on how to reset your password.{% endblocktrans %}</p>
168- <form action="" method="post">
169+<section class="p-strip">
170+ <div class="row">
171+ <div class="col-8">
172+ <h2 class="p-heading--three">{% trans "Step 1 of 3: Type your email address" %}</h2>
173+ <p>{% blocktrans %}Enter your email address, and we will send you instructions on how to reset your password.{% endblocktrans %}</p>
174+ <form action="" method="post">
175 {% csrf_token %}
176
177 {% if form.non_field_errors %}
178- <div class="input-row haserrors">
179- <span class="error">{{ form.non_field_errors|join:"" }}</span>
180+ <div class="p-notification--negative">
181+ <p class="p-notification__response">
182+ <span class="p-notification__status">Error:</span>{{ form.non_field_errors|join:"" }}
183+ </p>
184 </div>
185 {% endif %}
186
187- <p class="input-row{% if form.email.errors %} haserrors{% endif %}">
188- <label for="id_email">{% trans "Email:" %}</label>
189- {{ form.email }}
190- {% if form.email.errors %}
191- <span class="error">{{ form.email.errors|first }}</span>
192- {% endif %}
193- </p>
194- <p class="actions">
195- <button type="submit" name="continue" class="btn cta" data-qa-id="send_password_reset_token">
196- <span><span>{% trans "Continue" %}</span></span>
197- </button>
198- </p>
199- </form>
200+ <div class="p-form-validation{% if form.email.errors %} is-error{% endif %}">
201+ <label for="id_email">{% trans "Email:" %}</label>
202+ {{ form.email }}
203+ {% if form.email.errors %}
204+ <p class="p-form-validation__message">
205+ <strong>Error:</strong> {{ form.email.errors|first }}
206+ </p>
207+ {% endif %}
208+ </div>
209+ <button type="submit" name="continue" class="p-button--positive" data-qa-id="send_password_reset_token">{% trans "Continue" %}</button>
210+ </form>
211+ </div>
212+ </div>
213+</section>
214 {% endblock %}
215
216=== modified file 'src/webui/templates/registration/reset_password.html'
217--- src/webui/templates/registration/reset_password.html 2015-11-09 16:25:17 +0000
218+++ src/webui/templates/registration/reset_password.html 2019-08-05 13:48:06 +0000
219@@ -1,4 +1,4 @@
220-{% extends "base.html" %}
221+{% extends "vanilla/base.html" %}
222 {% load i18n %}
223
224 {% comment %}
225@@ -11,24 +11,26 @@
226 {% block title %}{% trans "Reset password" %}{% endblock %}
227
228 {% block text_title %}
229- <h1 class="u1-h-main u1-h-pair">{% trans "Reset password" %}</h1>
230- <h2 class="u1-h-med u1-h-pair">{% trans "Step 3 of 3: Choose a new password" %}</h2>
231+<h1>{% trans "Reset password" %}</h1>
232 {% endblock %}
233
234 {% block content_id %}auth{% endblock %}
235
236 {% block content %}
237- <form id="login-form" class="longfields" method="post" action="{{ action }}">
238- {% csrf_token %}
239- <!-- Refer to LP: #1413665 for more information about this email field. -->
240- <input type="email" name="email" value="{{ email }}" style="display: none;" />
241- {% include "widgets/passwords.html" with edit_account_labels=1 fields=form %}
242- <p class="actions">
243- <button type="submit" name="continue" class="btn cta" data-qa-id="reset_password">
244- <span><span>{% trans "Continue" %}</span></span>
245- </button>
246- </p>
247- </form>
248+<section class="p-strip">
249+ <div class="row">
250+ <div class="col-6">
251+ <h2 class="p-heading--three">{% trans "Step 3 of 3: Choose a new password" %}</h2>
252+ <form id="login-form" method="post" action="{{ action }}">
253+ {% csrf_token %}
254+ <!-- Refer to LP: #1413665 for more information about this email field. -->
255+ <input type="hidden" name="email" value="{{ email }}" />
256+ {% include "vanilla/widgets/passwords.html" with edit_account_labels=1 fields=form %}
257+ <button type="submit" name="continue" class="p-button--positive" data-qa-id="reset_password">{% trans "Continue" %}</button>
258+ </form>
259+ </div>
260+ </div>
261+</section>
262 {% endblock %}
263
264 {% block extra_js %}

Subscribers

People subscribed via source and target branches

to all changes: