chaos/VaultUI
1
0
Fork 0
Code Issues Activity

Add tsx syntax in UserPassUserView.

Browse source
This commit is contained in:
Kitteh 2021-05-23 13:20:56 +01:00
parent c2d8be3f09
commit 9db9630187
3 changed files with 107 additions and 97 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
src/elements/ReactHeaderAndContent.tsx Normal file
View file

@ -0,0 +1,19 @@
import { JSX } from "preact";
export type HeaderAndContentProps = {
title: string;
content: string;
};
export function HeaderAndContent(props: HeaderAndContentProps): JSX.Element {
return (
<tr>
<td>
<h5>{props.title}</h5>
</td>
<td>
<p>{props.content}</p>
</td>
</tr>
);
}

97
src/pages/Access/Auth/userpass/UserPassUserView.ts
View file

@ -1,97 +0,0 @@
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";
export class UserPassUserViewPage extends Page {
constructor() {
super();
}
async goBack(): Promise<void> {
await this.router.changePage("USERPASS_USERS_LIST");
}
async render(): Promise<void> {
const pageContent = makeElement({
tag: "div",
});
await this.router.setPageContent(pageContent);
const buttonBoxElement = makeElement({
tag: "p",
children: [
makeElement({
tag: "button",
class: ["uk-button", "uk-button-danger"],
onclick: async () => {
await this.router.changePage("USERPASS_USER_DELETE");
},
text: i18next.t("userpass_user_view_delete_btn"),
}),
makeElement({
tag: "button",
class: ["uk-button", "uk-button-primary"],
onclick: async () => {
await this.router.changePage("USERPASS_USER_EDIT");
},
text: i18next.t("userpass_user_view_edit_btn"),
}),
],
});
pageContent.appendChild(buttonBoxElement);
const contentElement = makeElement({
tag: "div",
});
pageContent.appendChild(contentElement);
const tableElement = makeElement({
tag: "table",
class: "uk-table",
});
contentElement.appendChild(tableElement);
const tableBody = makeElement({ tag: "tbody" });
tableElement.appendChild(tableBody);
const user = await getUserPassUser(this.state.authPath, this.state.userPassUser);
tableBody.appendChild(
HeaderAndContent(i18next.t("userpass_common_cidrs"), user.token_bound_cidrs.join()),
);
tableBody.appendChild(
HeaderAndContent(
i18next.t("userpass_common_exp_max_ttl"),
toStr(user.token_explicit_max_ttl),
),
);
tableBody.appendChild(
HeaderAndContent(i18next.t("userpass_common_max_ttl"), toStr(user.token_max_ttl)),
);
tableBody.appendChild(
HeaderAndContent(
i18next.t("userpass_common_default_policy_attached"),
toStr(user.token_no_default_policy),
),
);
tableBody.appendChild(
HeaderAndContent(i18next.t("userpass_common_max_token_uses"), toStr(user.token_num_uses)),
);
tableBody.appendChild(
HeaderAndContent(i18next.t("userpass_common_token_peroid"), toStr(user.token_period)),
);
tableBody.appendChild(
HeaderAndContent(i18next.t("userpass_common_policies"), user.token_policies.join()),
);
tableBody.appendChild(
HeaderAndContent(i18next.t("userpass_common_initial_ttl"), toStr(user.token_ttl)),
);
tableBody.appendChild(HeaderAndContent(i18next.t("userpass_common_type"), user.token_type));
}
get name(): string {
return i18next.t("userpass_user_view_title");
}
}

88
src/pages/Access/Auth/userpass/UserPassUserView.tsx Normal file
View file

@ -0,0 +1,88 @@
import { HeaderAndContent } from "../../../../elements/ReactHeaderAndContent";
import { Page } from "../../../../types/Page";
import { getUserPassUser } from "../../../../api/auth/userpass/getUserPassUser";
import { render } from "preact";
import { toStr } from "../../../../utils";
import i18next from "i18next";
export class UserPassUserViewPage extends Page {
constructor() {
super();
}
async goBack(): Promise<void> {
await this.router.changePage("USERPASS_USERS_LIST");
}
async render(): Promise<void> {
const user = await getUserPassUser(this.state.authPath, this.state.userPassUser);
render(
<div>
<p>
<button
class="uk-button uk-button-danger"
onClick={async () => {
await this.router.changePage("USERPASS_USER_DELETE");
}}
>
{i18next.t("userpass_user_view_delete_btn")}
</button>
<button
class="uk-button uk-button-primary"
onClick={async () => {
await this.router.changePage("USERPASS_USER_EDIT");
}}
>
{i18next.t("userpass_user_view_edit_btn")}
</button>
</p>
<table class="uk-table">
<tbody>
<HeaderAndContent
title={i18next.t("userpass_common_cidrs")}
content={user.token_bound_cidrs.join()}
/>
<HeaderAndContent
title={i18next.t("userpass_common_exp_max_ttl")}
content={toStr(user.token_explicit_max_ttl)}
/>
<HeaderAndContent
title={i18next.t("userpass_common_max_ttl")}
content={toStr(user.token_max_ttl)}
/>
<HeaderAndContent
title={i18next.t("userpass_common_default_policy_attached")}
content={toStr(user.token_no_default_policy)}
/>
<HeaderAndContent
title={i18next.t("userpass_common_max_token_uses")}
content={toStr(user.token_num_uses)}
/>
<HeaderAndContent
title={i18next.t("userpass_common_token_peroid")}
content={toStr(user.token_period)}
/>
<HeaderAndContent
title={i18next.t("userpass_common_policies")}
content={user.token_policies.join()}
/>
<HeaderAndContent
title={i18next.t("userpass_common_initial_ttl")}
content={toStr(user.token_ttl)}
/>
<HeaderAndContent
title={i18next.t("userpass_common_type")}
content={toStr(user.token_type)}
/>
</tbody>
</table>
</div>,
this.router.pageContentElement,
);
}
get name(): string {
return i18next.t("userpass_user_view_title");
}
}
1;