Password resets

cmd/web/handlers.go

@@ -318,3 +318,9 @@ func (app *application) Logout(w http.ResponseWriter, r *http.Request) {
 
 	http.Redirect(w, r, "/login", http.StatusSeeOther)
 }
+
+func (app *application) ForgotPassword(w http.ResponseWriter, r *http.Request) {
+	if err := app.renderTemplate(w, r, "forgot-password", &templateData{}); err != nil {
+		app.errorLog.Println(err)
+	}
+}

cmd/web/routes.go

@@ -31,6 +31,7 @@ func (app *application) routes() http.Handler {
 	mux.Get("/login", app.LoginPage)
 	mux.Post("/login", app.PostLoginPage)
 	mux.Get("/logout", app.Logout)
+	mux.Get("/forgot-password", app.ForgotPassword)
 
 	fileServer := http.FileServer(http.Dir("./static"))
 	mux.Handle("/static/*", http.StripPrefix("/static", fileServer))

cmd/web/templates/forgot-password.page.gohtml

@@ -0,0 +1,41 @@
+{{template "base" .}}
+{{define "title"}}
+Forgot Password
+{{end}}
+
+{{define "content"}}
+<div class="row">
+    <div class="col-md-6 offset-md-3">
+        <div class="alert alert-danger text-center d-none" id="forgot-messages"></div>
+        <form action=""
+              method="post"
+              name="forgot-form"
+              id="forgot-form"
+              class="d-blick needs-validation"
+              autocomplete="off"
+              novalidate="">
+            <h2 class="mt-2 mb-3 text-center">Forgot Password</h2>
+            <hr>
+            <div class="mb-3">
+                <label for="-email" class="form-label">Email</label>
+                <input type="text"
+                       id="email"
+                       name="email"
+                       autocomplete="email-new"
+                       required=""
+                       class="form-control">
+            </div>
+            <hr>
+            <a href="javascript:void(0)" id="reset-btn" class="btn btn-primary">Reset Password</a>
+        </form>
+    </div>
+</div>
+{{end}}
+{{define "js"}}
+<script type="module">
+    import {forgot} from "/static/js/login.js"
+    document.getElementById("reset-btn").addEventListener("click", () => {
+        forgot({{.API}});
+    })
+</script>
+{{end}}

cmd/web/templates/login.page.gohtml

@@ -35,6 +35,9 @@ Login
             </div>
             <hr>
             <a href="javascript:void(0)" id="login-btn" class="btn btn-primary">Login</a>
+            <p class="mt-2">
+                <small><a href="/forgot-password">Forgot password</a></small>
+            </p>
         </form>
     </div>
 </div>

static/js/login.js

@@ -45,3 +45,38 @@ export function val(api) {
 }
 
 
+export function forgot(api) {
+    let form = document.getElementById("forgot-form");
+
+    if (form.checkValidity() === false) {
+        // this.event.preventDefault();
+        // this.event.stopPropagation();
+        form.classList.add("was-validated");
+        return;
+    }
+    form.classList.add("was-validated");
+
+    let payload = {
+        email: document.getElementById("email").value,
+    };
+
+    const requestOptions = {
+        method: 'post',
+        headers: {
+            'Accept': 'application/json',
+            'Content-Type': 'application/json',
+        },
+        body: JSON.stringify(payload),
+    };
+
+    fetch(api + "/api/forgot-password", requestOptions)
+        .then(response => response.json())
+        .then(response => {
+            console.log(response)
+            if (response.error === false) {
+                showSuccess("forgot-messages", "Password reset email sent")
+            } else {
+                showError("forgot-messages", response.message)
+            }
+        });
+}