chaos/VaultUI
1
0
Fork 0
Code Issues Activity

Add tsx syntax to UserPassUserNew.

Browse source
This commit is contained in:
Kitteh 2021-05-23 12:58:04 +01:00
parent 0041c18a61
commit bd262b53e7
2 changed files with 69 additions and 81 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

81
src/pages/Access/Auth/userpass/UserPassUserNew.ts
View file

@ -1,81 +0,0 @@
import { Form } from "../../../../elements/Form";
import { Margin } from "../../../../elements/Margin";
import { Page } from "../../../../types/Page";
import { UserType } from "../../../../api/types/userpass/user";
import { createOrUpdateUserPassUser } from "../../../../api/auth/userpass/createOrUpdateUserPassUser";
import { makeElement } from "z-makeelement";
import { setErrorText } from "../../../../pageUtils";
import i18next from "i18next";
export class UserPassUserNewPage extends Page {
constructor() {
super();
}
async goBack(): Promise<void> {
await this.router.changePage("USERPASS_USERS_LIST");
}
async render(): Promise<void> {
await this.router.setPageContent(
Form(
[
Margin(
makeElement({
tag: "input",
class: "uk-input uk-form-width-large",
attributes: {
name: "username",
placeholder: i18next.t("userpass_common_username"),
},
}),
),
Margin(
makeElement({
tag: "input",
class: "uk-input uk-form-width-large",
attributes: {
type: "password",
name: "password",
placeholder: i18next.t("userpass_common_password"),
},
}),
),
makeElement({
tag: "p",
id: "errorText",
class: "uk-text-danger",
}),
makeElement({
tag: "button",
class: ["uk-button", "uk-button-primary"],
text: i18next.t("userpass_user_new_create_btn"),
attributes: {
type: "submit",
},
}),
],
async (form: HTMLFormElement) => {
const data = new FormData(form);
const apiData: Partial<UserType> = {
password: data.get("password") as string,
};
try {
await createOrUpdateUserPassUser(
this.state.authPath,
data.get("username") as string,
apiData,
);
await this.router.changePage("USERPASS_USERS_LIST");
} catch (e: unknown) {
const error = e as Error;
setErrorText(error.message);
}
},
),
);
}
get name(): string {
return i18next.t("userpass_user_new_title");
}
}

69
src/pages/Access/Auth/userpass/UserPassUserNew.tsx Normal file
View file

@ -0,0 +1,69 @@
import { Form } from "../../../../elements/ReactForm";
import { Margin } from "../../../../elements/ReactMargin";
import { MarginInline } from "../../../../elements/ReactMarginInline";
import { Page } from "../../../../types/Page";
import { UserType } from "../../../../api/types/userpass/user";
import { createOrUpdateUserPassUser } from "../../../../api/auth/userpass/createOrUpdateUserPassUser";
import { render } from "preact";
import { setErrorText } from "../../../../pageUtils";
import i18next from "i18next";
export class UserPassUserNewPage extends Page {
constructor() {
super();
}
async goBack(): Promise<void> {
await this.router.changePage("USERPASS_USERS_LIST");
}
async render(): Promise<void> {
render(
<Form onSubmit={(data) => this.onSubmit(data)}>
<Margin>
<input
class="uk-input uk-form-width-large"
name="username"
type="text"
placeholder={i18next.t("userpass_common_username")}
/>
</Margin>
<Margin>
<input
class="uk-input uk-form-width-large"
name="password"
type="password"
placeholder={i18next.t("userpass_common_password")}
/>
</Margin>
<p class="uk-text-danger" id="errorText" />
<MarginInline>
<button class="uk-button uk-button-primary" type="submit">
{i18next.t("userpass_user_new_create_btn")}
</button>
</MarginInline>
</Form>,
this.router.pageContentElement,
);
}
async onSubmit(data: FormData): Promise<void> {
const apiData: Partial<UserType> = {
password: data.get("password") as string,
};
try {
await createOrUpdateUserPassUser(
this.state.authPath,
data.get("username") as string,
apiData,
);
await this.router.changePage("USERPASS_USERS_LIST");
} catch (e: unknown) {
const error = e as Error;
setErrorText(error.message);
}
}
get name(): string {
return i18next.t("userpass_user_new_title");
}
}