Add working userpass user edit page.

src/allPages.ts

@@ -33,10 +33,10 @@ import { TransitRewrapPage } from "./pages/Secrets/Transit/TransitRewrap";
 import { TransitViewPage } from "./pages/Secrets/Transit/TransitView";
 import { TransitViewSecretPage } from "./pages/Secrets/Transit/TransitViewSecret";
 import { UnsealPage } from "./pages/Unseal";
+import { UserPassUserEditPage } from "./pages/Access/Auth/userpass/UserPassUserEdit";
 import { UserPassUserViewPage } from "./pages/Access/Auth/userpass/UserPassUserView";
 import { UserPassUsersListPage } from "./pages/Access/Auth/userpass/UserPassUsersList";
 import { getObjectKeys } from "./utils";
-import { UserPassUserEditPage } from "./pages/Access/Auth/userpass/UserPassUserEdit";
 
 type pagesList = {
   [key: string]: Page;

src/api/auth/userpass/createOrUpdateUserPassUser.ts

@@ -0,0 +1,26 @@
+import { UserType } from "../../types/userpass/user";
+import { appendAPIURL, getHeaders } from "../../apiUtils";
+import { removeDoubleSlash } from "../../../utils";
+
+export async function createOrUpdateUserPassUser(
+  path: string,
+  username: string,
+  data: Partial<UserType>,
+): Promise<void> {
+  const request = new Request(
+    appendAPIURL(removeDoubleSlash(`/v1/auth/${path}/users/${username}`)),
+    {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        ...getHeaders(),
+      },
+      body: JSON.stringify(data, null, 0),
+    },
+  );
+  const response = await fetch(request);
+  if (!response.ok) {
+    const json = (await response.json()) as { errors: string[] };
+    throw new Error(json.errors[0]);
+  }
+}

src/api/types/userpass/user.ts

@@ -1,4 +1,5 @@
 export type UserType = {
+  password?: string;
   token_bound_cidrs: string[];
   token_explicit_max_ttl: number;
   token_max_ttl: number;

src/elements/Form.ts

@@ -1,9 +1,11 @@
-import { makeElement, ElementInfo } from "z-makeelement";
+/* eslint-disable */
+import { ElementInfo, makeElement } from "z-makeelement";
+/* eslint-enable */
 
 export function Form(
   children: Element[],
   submit: (form: HTMLFormElement) => unknown,
-  options: Partial<ElementInfo> = {}
+  options: Partial<ElementInfo> = {},
 ): HTMLFormElement {
   const form = makeElement({
     tag: "form",

src/elements/InputWithTitle.ts

@@ -1,23 +1,20 @@
-import { makeElement } from "z-makeelement";
 import { Margin } from "./Margin";
+import { makeElement } from "z-makeelement";
 
-export function InputWithTitle(
+export function InputWithTitle(title: string, children: Element | Element[]): Element {
-  title: string,
-  children: Element | Element[],
-): Element {
   return Margin([
     makeElement({
       tag: "label",
       class: "uk-form-label",
       children: makeElement({
         tag: "span",
-        text: title
+        text: title,
-      })
+      }),
     }),
     makeElement({
       tag: "div",
       class: "uk-form-controls uk-form-controls-text uk-margin-small-top",
-      children: children
+      children: children,
-    })
+    }),
   ]);
 }

src/pages/Access/Auth/userpass/UserPassUserEdit.ts

@@ -1,13 +1,15 @@
-import { HeaderAndContent } from "../../../../elements/HeaderAndContent";
-import { Page } from "../../../../types/Page";
-import { getUserPassUser } from "../../../../api/auth/userpass/getUserPassUser";
-import { makeElement } from "z-makeelement";
-import { toStr } from "../../../../utils";
-import i18next from "i18next";
-import { notImplemented } from "../../../../pageUtils";
-import { Margin } from "../../../../elements/Margin";
 import { Form } from "../../../../elements/Form";
 import { InputWithTitle } from "../../../../elements/InputWithTitle";
+import { Page } from "../../../../types/Page";
+import { UserType } from "../../../../api/types/userpass/user";
+import { createOrUpdateUserPassUser } from "../../../../api/auth/userpass/createOrUpdateUserPassUser";
+import { getUserPassUser } from "../../../../api/auth/userpass/getUserPassUser";
+import { makeElement } from "z-makeelement";
+import { setErrorText } from "../../../../pageUtils";
+import { toStr } from "../../../../utils";
+import i18next from "i18next";
+
+const removeEmptyStrings = (arr: string[]) => arr.filter((e) => e.length > 0);
 
 export class UserPassUserEditPage extends Page {
   constructor() {
@@ -29,7 +31,7 @@ export class UserPassUserEditPage extends Page {
             attributes: {
               type: "password",
               name: "password",
-              placeholder: i18next.t("userpass_common_password")
+              placeholder: i18next.t("userpass_common_password"),
             },
           }),
 
@@ -40,7 +42,7 @@ export class UserPassUserEditPage extends Page {
               class: "uk-input uk-form-width-large",
               attributes: {
                 name: "cidrs",
-                value: user.token_bound_cidrs.join()
+                value: user.token_bound_cidrs.join(),
               },
             }),
           ),
@@ -52,7 +54,7 @@ export class UserPassUserEditPage extends Page {
               attributes: {
                 name: "exp_max_ttl",
                 type: "number",
-                value: toStr(user.token_explicit_max_ttl)
+                value: toStr(user.token_explicit_max_ttl),
               },
             }),
           ),
@@ -64,10 +66,10 @@ export class UserPassUserEditPage extends Page {
               attributes: {
                 name: "max_ttl",
                 type: "number",
-                value: toStr(user.token_max_ttl)
+                value: toStr(user.token_max_ttl),
               },
             }),
-          ),     
+          ),
           InputWithTitle(
             i18next.t("userpass_common_default_policy_attached"),
             makeElement({
@@ -76,10 +78,10 @@ export class UserPassUserEditPage extends Page {
               attributes: {
                 name: "def_pol_attached",
                 type: "checkbox",
-                value: toStr(user.token_no_default_policy)
+                value: toStr(user.token_no_default_policy),
               },
             }),
-          ),   
+          ),
           InputWithTitle(
             i18next.t("userpass_common_max_token_uses"),
             makeElement({
@@ -88,7 +90,7 @@ export class UserPassUserEditPage extends Page {
               attributes: {
                 name: "max_uses",
                 type: "number",
-                value: toStr(user.token_num_uses)
+                value: toStr(user.token_num_uses),
               },
             }),
           ),
@@ -100,7 +102,7 @@ export class UserPassUserEditPage extends Page {
               attributes: {
                 name: "period",
                 type: "number",
-                value: toStr(user.token_period)
+                value: toStr(user.token_period),
               },
             }),
           ),
@@ -111,10 +113,10 @@ export class UserPassUserEditPage extends Page {
               class: "uk-input uk-form-width-large",
               attributes: {
                 name: "policies",
-                value: user.token_policies.join()
+                value: user.token_policies.join(),
               },
             }),
-          ),         
+          ),
           InputWithTitle(
             i18next.t("userpass_common_initial_ttl"),
             makeElement({
@@ -123,11 +125,10 @@ export class UserPassUserEditPage extends Page {
               attributes: {
                 name: "initial_ttl",
                 type: "number",
-                value: toStr(user.token_ttl)
+                value: toStr(user.token_ttl),
               },
             }),
-          ),   
+          ),
-          
           makeElement({
             tag: "p",
             id: "errorText",
@@ -143,12 +144,31 @@ export class UserPassUserEditPage extends Page {
           }),
         ],
         async (form: HTMLFormElement) => {
-          const formData = new FormData(form);
+          const data = new FormData(form);
-          notImplemented();
+          const apiData: Partial<UserType> = {
+            token_bound_cidrs: removeEmptyStrings(String(data.get("cidrs")).split(",")),
+            token_explicit_max_ttl: parseInt(data.get("exp_max_ttl") as string, 10),
+            token_max_ttl: parseInt(data.get("max_ttl") as string, 10),
+            token_no_default_policy: (data.get("def_pol_attached") as string) == "true",
+            token_num_uses: parseInt(data.get("max_uses") as string, 10),
+            token_period: parseInt(data.get("period") as string, 10),
+            token_policies: removeEmptyStrings(String(data.get("policies")).split(",")),
+            token_ttl: parseInt(data.get("initial_ttl") as string, 10),
+          };
+          const password = data.get("password") as string;
+          if (password.length > 0) {
+            apiData.password = password;
+          }
+          try {
+            await createOrUpdateUserPassUser(this.state.authPath, this.state.userPassUser, apiData);
+            await this.router.changePage("USERPASS_USER_VIEW");
+          } catch (e: unknown) {
+            const error = e as Error;
+            setErrorText(error.message);
+          }
         },
       ),
     );
-
   }
 
   get name(): string {

src/pages/Access/Auth/userpass/UserPassUserView.ts

@@ -4,7 +4,6 @@ import { getUserPassUser } from "../../../../api/auth/userpass/getUserPassUser";
 import { makeElement } from "z-makeelement";
 import { toStr } from "../../../../utils";
 import i18next from "i18next";
-import { notImplemented } from "../../../../pageUtils";
 
 export class UserPassUserViewPage extends Page {
   constructor() {

src/translations/en.js

@@ -259,5 +259,4 @@ module.exports = {
   // userpass user edit
   userpass_user_edit_title: "User Edit",
   userpass_user_edit_submit_btn: "Submit",
-
 };