diff options
author | Sebastian <sebasjm@gmail.com> | 2021-11-29 14:11:32 -0300 |
---|---|---|
committer | Sebastian <sebasjm@gmail.com> | 2021-11-29 14:11:32 -0300 |
commit | a51333b693a8fe0b7c2073600d344d1e0b629419 (patch) | |
tree | 61c4048b2d69ae2dbd400a6ead703342eaad961a /packages/taler-wallet-webextension/src/components | |
parent | d35f906ecb9e42c0b55d10987ff9b1f4ece2af0e (diff) | |
download | wallet-core-a51333b693a8fe0b7c2073600d344d1e0b629419.tar.xz |
show better info on transaction error
Diffstat (limited to 'packages/taler-wallet-webextension/src/components')
-rw-r--r-- | packages/taler-wallet-webextension/src/components/ErrorMessage.tsx | 2 | ||||
-rw-r--r-- | packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx | 63 |
2 files changed, 64 insertions, 1 deletions
diff --git a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx index c6b64fb6a..21f10eeef 100644 --- a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx +++ b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx @@ -24,7 +24,7 @@ export function ErrorMessage({ }: { title?: string | VNode; description?: string; -}) { +}): VNode | null { const [showErrorDetail, setShowErrorDetail] = useState(false); if (!title) return null; return ( diff --git a/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx b/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx new file mode 100644 index 000000000..4aaf4a5be --- /dev/null +++ b/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx @@ -0,0 +1,63 @@ +/* + This file is part of GNU Taler + (C) 2019 Taler Systems SA + + GNU Taler is free software; you can redistribute it and/or modify it under the + terms of the GNU General Public License as published by the Free Software + Foundation; either version 3, or (at your option) any later version. + + GNU Taler is distributed in the hope that it will be useful, but WITHOUT ANY + WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR + A PARTICULAR PURPOSE. See the GNU General Public License for more details. + + You should have received a copy of the GNU General Public License along with + GNU Taler; see the file COPYING. If not, see <http://www.gnu.org/licenses/> + */ +import { TalerErrorDetails } from "@gnu-taler/taler-util"; +import { VNode, h, Fragment } from "preact"; +import { useState } from "preact/hooks"; +import arrowDown from "../../static/img/chevron-down.svg"; +import { ErrorBox } from "./styled"; + +export function ErrorTalerOperation({ + title, + error, +}: { + title?: string; + error?: TalerErrorDetails; +}): VNode | null { + const [showErrorDetail, setShowErrorDetail] = useState(false); + const [showExtraInfo, setShowExtraInfo] = useState(false); + if (!title || !error) return null; + return ( + <ErrorBox style={{ paddingTop: 0, paddingBottom: 0 }}> + <div> + <p>{title}</p> + {error && ( + <button + onClick={() => { + setShowErrorDetail((v) => !v); + }} + > + <img style={{ height: "1.5em" }} src={arrowDown} /> + </button> + )} + </div> + {showErrorDetail && ( + <Fragment> + <div style={{ padding: 5, textAlign: "left" }}> + <div>{error.message}</div> + <a href="#" onClick={() => setShowExtraInfo((v) => !v)}> + more + </a> + </div> + {showExtraInfo && ( + <div style={{ textAlign: "left", overflowX: "auto" }}> + <pre>{JSON.stringify(error, undefined, 2)}</pre> + </div> + )} + </Fragment> + )} + </ErrorBox> + ); +} |