1 files changed, 21 insertions, 30 deletions

diff --git a/packages/taler-wallet-webextension/src/renderHtml.tsx b/packages/taler-wallet-webextension/src/renderHtml.tsx
index bbe8e465c..15986d5d1 100644
--- a/packages/taler-wallet-webextension/src/renderHtml.tsx
+++ b/packages/taler-wallet-webextension/src/renderHtml.tsx
@@ -28,13 +28,13 @@ import {
   Amounts,
   amountFractionalBase,
 } from "@gnu-taler/taler-util";
-import { Component, ComponentChildren, JSX, h } from "preact";
+import { Component, ComponentChildren, h, VNode } from "preact";
 
 /**
  * Render amount as HTML, which non-breaking space between
  * decimal value and currency.
  */
-export function renderAmount(amount: AmountJson | string): JSX.Element {
+export function renderAmount(amount: AmountJson | string): VNode {
   let a;
   if (typeof amount === "string") {
     a = Amounts.parse(amount);
@@ -56,13 +56,13 @@ export const AmountView = ({
   amount,
 }: {
   amount: AmountJson | string;
-}): JSX.Element => renderAmount(amount);
+}): VNode => renderAmount(amount);
 
 /**
  * Abbreviate a string to a given length, and show the full
  * string on hover as a tooltip.
  */
-export function abbrev(s: string, n = 5): JSX.Element {
+export function abbrev(s: string, n = 5): VNode {
   let sAbbrev = s;
   if (s.length > n) {
     sAbbrev = s.slice(0, n) + "..";
@@ -87,15 +87,12 @@ interface CollapsibleProps {
  * Component that shows/hides its children when clicking
  * a heading.
  */
-export class Collapsible extends Component<
-  CollapsibleProps,
-  CollapsibleState
-> {
+export class Collapsible extends Component<CollapsibleProps, CollapsibleState> {
   constructor(props: CollapsibleProps) {
     super(props);
     this.state = { collapsed: props.initiallyCollapsed };
   }
-  render(): JSX.Element {
+  render(): VNode {
     const doOpen = (e: any): void => {
       this.setState({ collapsed: false });
       e.preventDefault();
@@ -135,27 +132,24 @@ interface ExpanderTextProps {
 /**
  * Show a heading with a toggle to show/hide the expandable content.
  */
-export function ExpanderText({ text }: ExpanderTextProps): JSX.Element {
+export function ExpanderText({ text }: ExpanderTextProps): VNode {
   return <span>{text}</span>;
 }
 
-export interface LoadingButtonProps extends JSX.HTMLAttributes<HTMLButtonElement> {
+export interface LoadingButtonProps
+  extends h.JSX.HTMLAttributes<HTMLButtonElement> {
   isLoading: boolean;
 }
 
-export function ProgressButton({isLoading, ...rest}: LoadingButtonProps): JSX.Element {
+export function ProgressButton({
+  isLoading,
+  ...rest
+}: LoadingButtonProps): VNode {
   return (
-    <button
-      class="pure-button pure-button-primary"
-      type="button"
-      {...rest}
-    >
+    <button class="pure-button pure-button-primary" type="button" {...rest}>
       {isLoading ? (
         <span>
-          <object
-            class="svg-icon svg-baseline"
-            data="/img/spinner-bars.svg"
-          />
+          <object class="svg-icon svg-baseline" data="/img/spinner-bars.svg" />
         </span>
       ) : null}{" "}
       {rest.children}
@@ -163,17 +157,14 @@ export function ProgressButton({isLoading, ...rest}: LoadingButtonProps): JSX.El
   );
 }
 
-export function PageLink(
-  props: { pageName: string, children?: ComponentChildren },
-): JSX.Element {
+export function PageLink(props: {
+  pageName: string;
+  children?: ComponentChildren;
+}): VNode {
+  // eslint-disable-next-line no-undef
   const url = chrome.extension.getURL(`/static/wallet.html#/${props.pageName}`);
   return (
-    <a
-      class="actionLink"
-      href={url}
-      target="_blank"
-      rel="noopener noreferrer"
-    >
+    <a class="actionLink" href={url} target="_blank" rel="noopener noreferrer">
       {props.children}
     </a>
   );