pretty and suspend/resume option

This commit is contained in:
Sebastian 2023-06-02 14:32:52 -03:00
parent 1961f4744c
commit 81dd559c77
No known key found for this signature in database
GPG Key ID: 173909D1A5F66069
9 changed files with 82 additions and 74 deletions

View File

@ -86,7 +86,9 @@ export function useComponentState({
onClick: pushAlertOnError(accept), onClick: pushAlertOnError(accept),
}, },
summary, summary,
expiration: expiration ? AbsoluteTime.fromProtocolTimestamp(expiration) : undefined, expiration: expiration
? AbsoluteTime.fromProtocolTimestamp(expiration)
: undefined,
cancel: { cancel: {
onClick: pushAlertOnError(onClose), onClick: pushAlertOnError(onClose),
}, },

View File

@ -41,7 +41,7 @@ export const codecForSettings = (): Codec<Settings> =>
.property("langSelector", codecForBoolean()) .property("langSelector", codecForBoolean())
.property("showJsonOnError", codecForBoolean()) .property("showJsonOnError", codecForBoolean())
.property("extendedAccountTypes", codecForBoolean()) .property("extendedAccountTypes", codecForBoolean())
.property("deleteActiveTransactions", codecForBoolean()) .property("suspendIndividualTransaction", codecForBoolean())
.build("Settings"); .build("Settings");
const SETTINGS_KEY = buildStorageKey("wallet-settings", codecForSettings()); const SETTINGS_KEY = buildStorageKey("wallet-settings", codecForSettings());

View File

@ -108,10 +108,7 @@ export interface Settings extends WebexWalletConfig {
langSelector: boolean; langSelector: boolean;
showJsonOnError: boolean; showJsonOnError: boolean;
extendedAccountTypes: boolean; extendedAccountTypes: boolean;
//WORKAROUND suspendIndividualTransaction: boolean;
//Able to delete tx in dev mode
//FIXME: remove this when DD37 is implemented
deleteActiveTransactions: boolean;
} }
export const defaultSettings: Settings = { export const defaultSettings: Settings = {
@ -119,7 +116,7 @@ export const defaultSettings: Settings = {
advanceMode: false, advanceMode: false,
backup: false, backup: false,
langSelector: false, langSelector: false,
deleteActiveTransactions: false, suspendIndividualTransaction: false,
showJsonOnError: false, showJsonOnError: false,
extendedAccountTypes: false, extendedAccountTypes: false,
walletAllowHttp: false, walletAllowHttp: false,

View File

@ -7,11 +7,11 @@
position: absolute; position: absolute;
top: 0px; top: 0px;
display: none; display: none;
width: 100%; width: 100%;
height: 100%; height: 100%;
background-color: rgba(0,0,0,0.5); background-color: rgba(0, 0, 0, 0.5);
color:white; color: white;
justify-content: center; justify-content: center;
} }
.overlay > iframe { .overlay > iframe {
margin: auto; margin: auto;
@ -21,21 +21,21 @@ justify-content: center;
<body> <body>
<script> <script>
function openPopup() { function openPopup() {
document.getElementById("popup-overlay").style.display = "flex" document.getElementById("popup-overlay").style.display = "flex";
window.frames["popup"].location = "popup.html"; window.frames["popup"].location = "popup.html";
window.frames["popup"] window.frames["popup"];
} }
function closePopup() { function closePopup() {
document.getElementById("popup-overlay").style.display = "none" document.getElementById("popup-overlay").style.display = "none";
} }
function redirectWallet(url) { function redirectWallet(url) {
window.frames["wallet"].location = url window.frames["wallet"].location = url;
} }
function openWallet() { function openWallet() {
redirectWallet("wallet.html") redirectWallet("wallet.html");
} }
function closeWallet() { function closeWallet() {
redirectWallet("about:blank") redirectWallet("about:blank");
} }
function openPage() { function openPage() {
window.frames["other"].location = window.frames["other"].location =
@ -46,7 +46,7 @@ justify-content: center;
<button value="asd" onclick="closeWallet();openWallet()"> <button value="asd" onclick="closeWallet();openWallet()">
reload wallet page reload wallet page
</button> </button>
<br /> <br />
<iframe <iframe
id="wallet-window" id="wallet-window"
name="wallet" name="wallet"
@ -54,7 +54,7 @@ justify-content: center;
width="1000" width="1000"
height="100%" height="100%"
> >
</iframe> </iframe>
<!-- <input id="page-url" type="text" /> <!-- <input id="page-url" type="text" />
<button onclick="openPage()">open</button> --> <button onclick="openPage()">open</button> -->
<!-- <a <!-- <a
@ -73,11 +73,11 @@ justify-content: center;
<hr /> <hr />
<div class="overlay" id="popup-overlay"> <div class="overlay" id="popup-overlay">
<iframe <iframe
id="popup-window" id="popup-window"
name="popup" name="popup"
src="about:blank" src="about:blank"
width="500" width="500"
height="325" height="325"
> >
</iframe> </iframe>
</div> </div>
@ -85,25 +85,24 @@ justify-content: center;
<iframe src="tests.html" name="wallet" width="800" height="100%"> </iframe> --> <iframe src="tests.html" name="wallet" width="800" height="100%"> </iframe> -->
<!-- <hr /> <!-- <hr />
<iframe src="stories.html" name="wallet" width="800" height="100%"> --> <iframe src="stories.html" name="wallet" width="800" height="100%"> -->
<script type="module" src="background.dev.js"></script> <script type="module" src="background.dev.js"></script>
<script type="module"> <script type="module">
if ("serviceWorker" in navigator) { if ("serviceWorker" in navigator) {
try { try {
const registration = await navigator.serviceWorker.register("sw.js", { const registration = await navigator.serviceWorker.register("sw.js", {
scope: "/app/", scope: "/app/",
}); });
if (registration.installing) { if (registration.installing) {
console.log("Service worker installing"); console.log("Service worker installing");
} else if (registration.waiting) { } else if (registration.waiting) {
console.log("Service worker installed"); console.log("Service worker installed");
} else if (registration.active) { } else if (registration.active) {
console.log("Service worker active"); console.log("Service worker active");
}
} catch (error) {
console.error(`Registration failed with ${error}`);
}
} }
} catch (error) {
</script> console.error(`Registration failed with ${error}`);
</body> }
}
</script>
</body>
</html> </html>

View File

@ -9,19 +9,23 @@
"start_url": "./", "start_url": "./",
"manifest_version": 3, "manifest_version": 3,
"minimum_chrome_version": "88", "minimum_chrome_version": "88",
"icons": [{ "icons": [
"src": "./static/img/taler-logo-48.png", {
"type": "image/png", "src": "./static/img/taler-logo-48.png",
"sizes": "48x48" "type": "image/png",
},{ "sizes": "48x48"
"src": "./static/img/taler-logo-128.png", },
"type": "image/png", {
"sizes": "128x128" "src": "./static/img/taler-logo-128.png",
},{ "type": "image/png",
"src": "./static/img/taler-logo-512.png", "sizes": "128x128"
"type": "image/png", },
"sizes": "512x512" {
}], "src": "./static/img/taler-logo-512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"protocol_handlers": [ "protocol_handlers": [
{ {
"protocol": "web+taler", "protocol": "web+taler",

View File

@ -1,35 +1,35 @@
@font-face { @font-face {
font-family: 'Roboto'; font-family: "Roboto";
font-style: italic; font-style: italic;
font-weight: 400; font-weight: 400;
font-display: swap; font-display: swap;
src: url(/static/font/roboto-italic-400.ttf) format('truetype'); src: url(/static/font/roboto-italic-400.ttf) format("truetype");
} }
@font-face { @font-face {
font-family: 'Roboto'; font-family: "Roboto";
font-style: normal; font-style: normal;
font-weight: 300; font-weight: 300;
font-display: swap; font-display: swap;
src: url(/static/font/roboto-normal-300.ttf) format('truetype'); src: url(/static/font/roboto-normal-300.ttf) format("truetype");
} }
@font-face { @font-face {
font-family: 'Roboto'; font-family: "Roboto";
font-style: normal; font-style: normal;
font-weight: 400; font-weight: 400;
font-display: swap; font-display: swap;
src: url(/static/font/roboto-normal-400.ttf) format('truetype'); src: url(/static/font/roboto-normal-400.ttf) format("truetype");
} }
@font-face { @font-face {
font-family: 'Roboto'; font-family: "Roboto";
font-style: normal; font-style: normal;
font-weight: 500; font-weight: 500;
font-display: swap; font-display: swap;
src: url(/static/font/roboto-normal-500.ttf) format('truetype'); src: url(/static/font/roboto-normal-500.ttf) format("truetype");
} }
@font-face { @font-face {
font-family: 'Roboto'; font-family: "Roboto";
font-style: normal; font-style: normal;
font-weight: 700; font-weight: 700;
font-display: swap; font-display: swap;
src: url(/static/font/roboto-normal-700.ttf) format('truetype'); src: url(/static/font/roboto-normal-700.ttf) format("truetype");
} }

View File

@ -19,7 +19,11 @@
* @author Sebastian Javier Marchano (sebasjm) * @author Sebastian Javier Marchano (sebasjm)
*/ */
import { AbsoluteTime, TalerPreciseTimestamp, TalerProtocolTimestamp } from "@gnu-taler/taler-util"; import {
AbsoluteTime,
TalerPreciseTimestamp,
TalerProtocolTimestamp,
} from "@gnu-taler/taler-util";
import { ProviderPaymentType } from "@gnu-taler/taler-wallet-core"; import { ProviderPaymentType } from "@gnu-taler/taler-wallet-core";
import * as tests from "@gnu-taler/web-util/testing"; import * as tests from "@gnu-taler/web-util/testing";
import { ProviderView as TestedComponent } from "./ProviderDetailPage.js"; import { ProviderView as TestedComponent } from "./ProviderDetailPage.js";

View File

@ -320,9 +320,9 @@ function AdvanceSettings(): VNode {
label: i18n.str`Show backup feature`, label: i18n.str`Show backup feature`,
description: i18n.str`Backup integration still in beta.`, description: i18n.str`Backup integration still in beta.`,
}, },
deleteActiveTransactions: { suspendIndividualTransaction: {
label: i18n.str`Show delete active transaction`, label: i18n.str`Show suspend/resume transaction`,
description: i18n.str`Deleting active transaction is not safe and you may loose your coins.`, description: i18n.str`Prevent transaction from doing network request.`,
}, },
extendedAccountTypes: { extendedAccountTypes: {
label: i18n.str`Show more account types on deposit`, label: i18n.str`Show more account types on deposit`,

View File

@ -71,6 +71,7 @@ import { SafeHandler } from "../mui/handlers.js";
import { Pages } from "../NavigationBar.js"; import { Pages } from "../NavigationBar.js";
import { assertUnreachable } from "../utils/index.js"; import { assertUnreachable } from "../utils/index.js";
import { EnabledBySettings } from "../components/EnabledBySettings.js"; import { EnabledBySettings } from "../components/EnabledBySettings.js";
import { useSettings } from "../hooks/useSettings.js";
interface Props { interface Props {
tid: string; tid: string;
@ -203,6 +204,7 @@ function TransactionTemplate({
const [confirmBeforeForget, setConfirmBeforeForget] = useState(false); const [confirmBeforeForget, setConfirmBeforeForget] = useState(false);
const [confirmBeforeCancel, setConfirmBeforeCancel] = useState(false); const [confirmBeforeCancel, setConfirmBeforeCancel] = useState(false);
const { safely } = useAlertContext(); const { safely } = useAlertContext();
const [settings] = useSettings();
async function doCheckBeforeForget(): Promise<void> { async function doCheckBeforeForget(): Promise<void> {
if ( if (
@ -393,7 +395,7 @@ function TransactionTemplate({
<i18n.Translate>Abort</i18n.Translate> <i18n.Translate>Abort</i18n.Translate>
</Button> </Button>
)} )}
{showResume && ( {showResume && settings.suspendIndividualTransaction && (
<Button <Button
variant="contained" variant="contained"
onClick={safely("resume transaction", onResume)} onClick={safely("resume transaction", onResume)}
@ -401,7 +403,7 @@ function TransactionTemplate({
<i18n.Translate>Resume</i18n.Translate> <i18n.Translate>Resume</i18n.Translate>
</Button> </Button>
)} )}
{showSuspend && ( {showSuspend && settings.suspendIndividualTransaction && (
<Button <Button
variant="contained" variant="contained"
onClick={safely("suspend transaction", onSuspend)} onClick={safely("suspend transaction", onSuspend)}