feat(webui): add password reset page

#20

pkg/webui/html/accountsIdResetPassword.html

@@ -0,0 +1,57 @@
+{{ define "main" }}
+{{ if .PasswordChanged }}
+<h2>Password Reset Successful</h2>
+<p>
+  Your password has been set successfully. You can now try to <a href="/login">log in</a>!
+</p>
+{{ else }}
+<h1>User Account</h1>
+<h2>Password Reset</h2>
+<form action="/accounts/{{ .Account.Id }}/reset/{{ .Token }}" enctype="multipart/form-data" method="post">
+  <fieldset>
+    <legend>Set Password</legend>
+    <p>
+      You have been invited to set a password for this account. Please choose a
+      strong password or passphrase that you haven't used before. Think about a
+      combination of words that would be memorable yet complex
+      like <a href="https://xkcd.com/936/">Correct-Horse-Battery-Staple</a>.
+    </p>
+    <div class="flex-row">
+      <label for="password">Password</label>
+      <input autofocus
+             class="flex-stretch{{ if .PasswordInvalid }} error{{ end }}"
+             id="password"
+             minlength="8"
+             name="password"
+             type="password"
+             required>
+      <button type="submit" value="edit">Set Password</button>
+    </div>
+    {{ if .PasswordInvalid }}
+    <span class="error">
+      <span class="tooltip">
+        Invalid password.
+        <span class="tooltip-text">
+          Passwords must be at least 8 characters long.
+        </span>
+      </span>
+    </span>
+    {{ end }}
+  </fieldset>
+</form>
+<h2>Status</h2>
+<p>
+  The account
+  <strong>{{ .Account.Username }}</strong>
+  was created on
+  <strong>{{ .Account.Created }}</strong>
+  and
+  {{ if eq .Account.Created .Account.LastLogin }}
+  <strong>never logged in</strong>.
+  {{ else }}
+  last logged in on
+  <strong>{{ .Account.LastLogin }}</strong>.
+  {{ end }}
+</p>
+{{ end }}
+{{ end }}

pkg/webui/html/base.html

@@ -19,6 +19,11 @@
           <i class="material-symbols-outlined">login</i>
           <span>Login</span>
         </a>
+        {{ else if eq .Page.Section "reset" }}
+        <a href="/login">
+          <i class="material-symbols-outlined">login</i>
+          <span>Login</span>
+        </a>
         {{ else if eq .Page.Section "error" }}
         <a href="/">
           <i class="material-symbols-outlined">mountain_flag</i>
@@ -50,5 +55,6 @@
     </div>
     <footer>
     </footer>
+    <script type="module" src="/static/main.js"></script>
   </body>
 </html>