chaos/VaultUI
1
0
Fork 0
Code Issues Activity

Move makeTile to Tile.ts

Browse source
This commit is contained in:
Kitteh 2021-05-09 14:21:40 +01:00
parent 66217ccadf
commit ba3df3af78
2 changed files with 69 additions and 63 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

44
src/elements/Tile.ts Normal file
View file

@ -0,0 +1,44 @@
import { makeElement } from "../htmlUtils";
type TileParams = {
condition: Boolean;
title: string;
description: string;
icon: string;
iconText: string;
onclick: () => void;
}
export function Tile(params: TileParams): HTMLElement {
if (!params.condition) return;
return makeElement({
tag: "a",
class: "uk-link-heading",
onclick: params.onclick,
children: makeElement({
tag: "div",
class: ["uk-padding-small", "uk-background-primary"],
children: [
makeElement({
tag: "p",
class: "uk-h4",
text: params.title,
children: makeElement({
tag: "span",
class: ["uk-icon", "uk-margin-small-left"],
attributes: {
"uk-icon": `icon: ${params.icon}`,
"role": "img",
"aria-label": params.iconText
}
})
}),
makeElement({
tag: "span",
class: "uk-text-muted",
text: params.description
})
]
})
});
}

88
src/pages/Transit/TransitViewSecret.ts
View file

@ -4,6 +4,7 @@ import { makeElement } from "../../htmlUtils";
import { pageState } from "../../globalPageState";
import i18next from 'i18next';
import { getTransitKey } from "../../api/transit/getTransitKey";
import { Tile } from "../../elements/Tile";
type TileParams = {
condition: Boolean;
@ -23,40 +24,6 @@ export class TransitViewSecretPage extends Page {
changePage("TRANSIT_VIEW");
}
makeTile(params: TileParams): HTMLElement {
if (!params.condition) return;
return makeElement({
tag: "a",
class: "uk-link-heading",
onclick: params.onclick,
children: makeElement({
tag: "div",
class: ["uk-padding-small", "uk-background-primary"],
children: [
makeElement({
tag: "p",
class: "uk-h4",
text: params.title,
children: makeElement({
tag: "span",
class: ["uk-icon", "uk-margin-small-left"],
attributes: {
"uk-icon": `icon: ${params.icon}`,
"role": "img",
"aria-label": params.iconText
}
})
}),
makeElement({
tag: "span",
class: "uk-text-muted",
text: params.description
})
]
})
});
}
async render(): Promise<void> {
setTitleElement(pageState);
@ -64,36 +31,31 @@ export class TransitViewSecretPage extends Page {
setPageContent(makeElement({
tag: "div",
class: ["uk-grid", "uk-child-width-expand@s"],
class: ["uk-list", "uk-width-1-1@s"],
attributes: { "uk-grid": "" },
children: makeElement({
tag: "div",
class: ["uk-list", "uk-width-2-3@s"],
attributes: { "uk-grid": "" },
children: [
makeElement({
tag: "div",
children: [
this.makeTile({
condition: transitKey.supports_encryption,
title: i18next.t("transit_view_encrypt_text"),
description: i18next.t("transit_view_encrypt_description"),
icon: "lock",
iconText: i18next.t("transit_view_encrypt_icon_text"),
onclick: () => { changePage("TRANSIT_ENCRYPT"); }
}),
this.makeTile({
condition: transitKey.supports_decryption,
title: i18next.t("transit_view_decrypt_text"),
description: i18next.t("transit_view_decrypt_description"),
icon: "mail",
iconText: i18next.t("transit_view_decrypt_icon_text"),
onclick: () => { changePage("TRANSIT_DECRYPT"); }
}),
]
}),
]
})
children: [
makeElement({
tag: "div",
children: [
Tile({
condition: transitKey.supports_encryption,
title: i18next.t("transit_view_encrypt_text"),
description: i18next.t("transit_view_encrypt_description"),
icon: "lock",
iconText: i18next.t("transit_view_encrypt_icon_text"),
onclick: () => { changePage("TRANSIT_ENCRYPT"); }
}),
Tile({
condition: transitKey.supports_decryption,
title: i18next.t("transit_view_decrypt_text"),
description: i18next.t("transit_view_decrypt_description"),
icon: "mail",
iconText: i18next.t("transit_view_decrypt_icon_text"),
onclick: () => { changePage("TRANSIT_DECRYPT"); }
}),
]
}),
]
}));
}