add extension to every import

19 files changed, 50 insertions, 46 deletions

diff --git a/packages/taler-wallet-webextension/src/components/BalanceTable.tsx b/packages/taler-wallet-webextension/src/components/BalanceTable.tsx
index c69625cd2..e67fb6b4d 100644
--- a/packages/taler-wallet-webextension/src/components/BalanceTable.tsx
+++ b/packages/taler-wallet-webextension/src/components/BalanceTable.tsx
@@ -14,9 +14,9 @@
  TALER; see the file COPYING.  If not, see <http://www.gnu.org/licenses/>
  */
 
-import { Amounts, amountToPretty, Balance } from "@gnu-taler/taler-util";
+import { Amounts, Balance } from "@gnu-taler/taler-util";
 import { h, VNode } from "preact";
-import { TableWithRoundRows as TableWithRoundedRows } from "./styled";
+import { TableWithRoundRows as TableWithRoundedRows } from "./styled/index.js";
 
 export function BalanceTable({
   balances,
diff --git a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
index f55f5c846..aff2badac 100644
--- a/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
+++ b/packages/taler-wallet-webextension/src/components/BankDetailsByPaytoType.tsx
@@ -17,9 +17,9 @@
 import { PaytoUri } from "@gnu-taler/taler-util";
 import { Fragment, h, VNode } from "preact";
 import { useEffect, useState } from "preact/hooks";
-import { useTranslationContext } from "../context/translation";
-import { CopiedIcon, CopyIcon } from "../svg";
-import { ButtonBox, TooltipRight } from "./styled";
+import { useTranslationContext } from "../context/translation.js";
+import { CopiedIcon, CopyIcon } from "../svg/index.js";
+import { ButtonBox, TooltipRight } from "./styled/index.js";
 
 export interface BankDetailsProps {
   payto: PaytoUri | undefined;
diff --git a/packages/taler-wallet-webextension/src/components/Banner.stories.tsx b/packages/taler-wallet-webextension/src/components/Banner.stories.tsx
index 258bd0676..e4fc63ac1 100644
--- a/packages/taler-wallet-webextension/src/components/Banner.stories.tsx
+++ b/packages/taler-wallet-webextension/src/components/Banner.stories.tsx
@@ -19,11 +19,11 @@
  * @author Sebastian Javier Marchano (sebasjm)
  */
 
-import { Banner } from "./Banner";
+import { Banner } from "./Banner.js";
 import { Fragment, h, VNode } from "preact";
-import { Avatar } from "../mui/Avatar";
-import { Icon, SvgIcon } from "./styled";
-import { Typography } from "../mui/Typography";
+import { Avatar } from "../mui/Avatar.js";
+import { Icon, SvgIcon } from "./styled/index.js";
+import { Typography } from "../mui/Typography.js";
 
 export default {
   title: "mui/banner",
diff --git a/packages/taler-wallet-webextension/src/components/Banner.tsx b/packages/taler-wallet-webextension/src/components/Banner.tsx
index 77d79d873..7bbacee8d 100644
--- a/packages/taler-wallet-webextension/src/components/Banner.tsx
+++ b/packages/taler-wallet-webextension/src/components/Banner.tsx
@@ -1,10 +1,10 @@
 import { h, Fragment, VNode, JSX } from "preact";
-import { Divider } from "../mui/Divider";
-import { Button } from "../mui/Button";
-import { Typography } from "../mui/Typography";
-import { Avatar } from "../mui/Avatar";
-import { Grid } from "../mui/Grid";
-import { Paper } from "../mui/Paper";
+import { Divider } from "../mui/Divider.js";
+import { Button } from "../mui/Button.js";
+import { Typography } from "../mui/Typography.js";
+import { Avatar } from "../mui/Avatar.js";
+import { Grid } from "../mui/Grid.js";
+import { Paper } from "../mui/Paper.js";
 
 interface Props extends JSX.HTMLAttributes<HTMLDivElement> {
   title?: string;
diff --git a/packages/taler-wallet-webextension/src/components/CheckboxOutlined.tsx b/packages/taler-wallet-webextension/src/components/CheckboxOutlined.tsx
index de7fb5e6c..959f354a4 100644
--- a/packages/taler-wallet-webextension/src/components/CheckboxOutlined.tsx
+++ b/packages/taler-wallet-webextension/src/components/CheckboxOutlined.tsx
@@ -14,7 +14,7 @@
  GNU Taler; see the file COPYING.  If not, see <http://www.gnu.org/licenses/>
  */
 
-import { Outlined, StyledCheckboxLabel } from "./styled";
+import { Outlined, StyledCheckboxLabel } from "./styled/index.js";
 import { h, VNode } from "preact";
 
 interface Props {
diff --git a/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx b/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx
index dc42b9ef7..8d431f683 100644
--- a/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx
+++ b/packages/taler-wallet-webextension/src/components/DebugCheckbox.tsx
@@ -15,7 +15,7 @@
  */
 
 import { h, VNode } from "preact";
-import { useTranslationContext } from "../context/translation";
+import { useTranslationContext } from "../context/translation.js";
 
 export function DebugCheckbox({
   enabled,
diff --git a/packages/taler-wallet-webextension/src/components/Diagnostics.tsx b/packages/taler-wallet-webextension/src/components/Diagnostics.tsx
index 0cffff693..98e4e7a03 100644
--- a/packages/taler-wallet-webextension/src/components/Diagnostics.tsx
+++ b/packages/taler-wallet-webextension/src/components/Diagnostics.tsx
@@ -16,7 +16,7 @@
 
 import { WalletDiagnostics } from "@gnu-taler/taler-util";
 import { Fragment, h, VNode } from "preact";
-import { useTranslationContext } from "../context/translation";
+import { useTranslationContext } from "../context/translation.js";
 
 interface Props {
   timedOut: boolean;
diff --git a/packages/taler-wallet-webextension/src/components/EditableText.tsx b/packages/taler-wallet-webextension/src/components/EditableText.tsx
index 8f342ef28..5b0ece5a6 100644
--- a/packages/taler-wallet-webextension/src/components/EditableText.tsx
+++ b/packages/taler-wallet-webextension/src/components/EditableText.tsx
@@ -16,7 +16,7 @@
 
 import { h, VNode } from "preact";
 import { useRef, useState } from "preact/hooks";
-import { useTranslationContext } from "../context/translation";
+import { useTranslationContext } from "../context/translation.js";
 
 interface Props {
   value: string;
diff --git a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx
index d6765c13d..88725e9cb 100644
--- a/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx
+++ b/packages/taler-wallet-webextension/src/components/ErrorMessage.tsx
@@ -16,7 +16,7 @@
 import { VNode, h, ComponentChildren } from "preact";
 import { useState } from "preact/hooks";
 import arrowDown from "../svg/chevron-down.svg";
-import { ErrorBox } from "./styled";
+import { ErrorBox } from "./styled/index.js";
 
 export function ErrorMessage({
   title,
diff --git a/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx b/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx
index 9fd8f7a03..5e94578a4 100644
--- a/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx
+++ b/packages/taler-wallet-webextension/src/components/ErrorTalerOperation.tsx
@@ -17,8 +17,8 @@ import { TalerErrorDetail } from "@gnu-taler/taler-util";
 import { Fragment, h, VNode } from "preact";
 import { useState } from "preact/hooks";
 import arrowDown from "../svg/chevron-down.svg";
-import { useDevContext } from "../context/devContext";
-import { ErrorBox } from "./styled";
+import { useDevContext } from "../context/devContext.js";
+import { ErrorBox } from "./styled/index.js";
 
 export function ErrorTalerOperation({
   title,
diff --git a/packages/taler-wallet-webextension/src/components/JustInDevMode.tsx b/packages/taler-wallet-webextension/src/components/JustInDevMode.tsx
index d447f87eb..28e503095 100644
--- a/packages/taler-wallet-webextension/src/components/JustInDevMode.tsx
+++ b/packages/taler-wallet-webextension/src/components/JustInDevMode.tsx
@@ -1,5 +1,5 @@
 import { ComponentChildren, Fragment, h, VNode } from "preact";
-import { useDevContext } from "../context/devContext";
+import { useDevContext } from "../context/devContext.js";
 
 export function JustInDevMode({
   children,
diff --git a/packages/taler-wallet-webextension/src/components/Loading.tsx b/packages/taler-wallet-webextension/src/components/Loading.tsx
index d28953a10..c0749a3f0 100644
--- a/packages/taler-wallet-webextension/src/components/Loading.tsx
+++ b/packages/taler-wallet-webextension/src/components/Loading.tsx
@@ -15,8 +15,8 @@
  */
 import { Fragment, h, VNode } from "preact";
 import { useEffect, useState } from "preact/hooks";
-import { useTranslationContext } from "../context/translation";
-import { CenteredText } from "./styled";
+import { useTranslationContext } from "../context/translation.js";
+import { CenteredText } from "./styled/index.js";
 
 export function Loading(): VNode {
   const { i18n } = useTranslationContext();
diff --git a/packages/taler-wallet-webextension/src/components/LoadingError.tsx b/packages/taler-wallet-webextension/src/components/LoadingError.tsx
index ea0ff40d6..c1e5918f5 100644
--- a/packages/taler-wallet-webextension/src/components/LoadingError.tsx
+++ b/packages/taler-wallet-webextension/src/components/LoadingError.tsx
@@ -14,9 +14,9 @@
  TALER; see the file COPYING.  If not, see <http://www.gnu.org/licenses/>
  */
 import { h, VNode } from "preact";
-import { HookError } from "../hooks/useAsyncAsHook";
-import { ErrorMessage } from "./ErrorMessage";
-import { ErrorTalerOperation } from "./ErrorTalerOperation";
+import { HookError } from "../hooks/useAsyncAsHook.js";
+import { ErrorMessage } from "./ErrorMessage.js";
+import { ErrorTalerOperation } from "./ErrorTalerOperation.js";
 
 export interface Props {
   title: VNode;
diff --git a/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx b/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx
index d1b5e45ad..c4ccaa696 100644
--- a/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx
+++ b/packages/taler-wallet-webextension/src/components/MultiActionButton.tsx
@@ -1,6 +1,10 @@
 import { h, VNode } from "preact";
 import arrowDown from "../svg/chevron-down.svg";
-import { ButtonBoxPrimary, ButtonPrimary, ParagraphClickable } from "./styled";
+import {
+  ButtonBoxPrimary,
+  ButtonPrimary,
+  ParagraphClickable,
+} from "./styled/index.js";
 import { useState } from "preact/hooks";
 
 export interface Props {
diff --git a/packages/taler-wallet-webextension/src/components/Part.tsx b/packages/taler-wallet-webextension/src/components/Part.tsx
index 89cc51391..1d38d16bf 100644
--- a/packages/taler-wallet-webextension/src/components/Part.tsx
+++ b/packages/taler-wallet-webextension/src/components/Part.tsx
@@ -14,7 +14,7 @@
  GNU Taler; see the file COPYING.  If not, see <http://www.gnu.org/licenses/>
  */
 import { AmountLike } from "@gnu-taler/taler-util";
-import { ExtraLargeText, LargeText, SmallLightText } from "./styled";
+import { ExtraLargeText, LargeText, SmallLightText } from "./styled/index.js";
 import { h, VNode } from "preact";
 
 export type Kind = "positive" | "negative" | "neutral";
diff --git a/packages/taler-wallet-webextension/src/components/PendingTransactions.stories.tsx b/packages/taler-wallet-webextension/src/components/PendingTransactions.stories.tsx
index ea29d4a78..27146479b 100644
--- a/packages/taler-wallet-webextension/src/components/PendingTransactions.stories.tsx
+++ b/packages/taler-wallet-webextension/src/components/PendingTransactions.stories.tsx
@@ -19,9 +19,9 @@
  * @author Sebastian Javier Marchano (sebasjm)
  */
 
-import { PendingTransactionsView as TestedComponent } from "./PendingTransactions";
+import { PendingTransactionsView as TestedComponent } from "./PendingTransactions.js";
 import { Fragment, h, VNode } from "preact";
-import { createExample } from "../test-utils";
+import { createExample } from "../test-utils.js";
 import {
   TalerProtocolTimestamp,
   Transaction,
@@ -73,7 +73,7 @@ export const TenPendingTransactions = createExample(TestedComponent, {
     {
       amountEffective: "USD:10",
       type: TransactionType.Withdrawal,
-      timestamp: TalerProtocolTimestamp.fromSeconds(1)
+      timestamp: TalerProtocolTimestamp.fromSeconds(1),
     } as Transaction,
     {
       amountEffective: "USD:10",
diff --git a/packages/taler-wallet-webextension/src/components/PendingTransactions.tsx b/packages/taler-wallet-webextension/src/components/PendingTransactions.tsx
index 7923eb6ad..0a101acd0 100644
--- a/packages/taler-wallet-webextension/src/components/PendingTransactions.tsx
+++ b/packages/taler-wallet-webextension/src/components/PendingTransactions.tsx
@@ -6,12 +6,12 @@ import {
 } from "@gnu-taler/taler-util";
 import { PendingTaskInfo } from "@gnu-taler/taler-wallet-core";
 import { Fragment, h, JSX } from "preact";
-import { useAsyncAsHook } from "../hooks/useAsyncAsHook";
-import { Avatar } from "../mui/Avatar";
-import { Typography } from "../mui/Typography";
-import Banner from "./Banner";
-import { Time } from "./Time";
-import * as wxApi from "../wxApi";
+import { useAsyncAsHook } from "../hooks/useAsyncAsHook.js";
+import { Avatar } from "../mui/Avatar.js";
+import { Typography } from "../mui/Typography.js";
+import Banner from "./Banner.js";
+import { Time } from "./Time.js";
+import * as wxApi from "../wxApi.js";
 
 interface Props extends JSX.HTMLAttributes {
   goToTransaction: (id: string) => void;
diff --git a/packages/taler-wallet-webextension/src/components/SelectList.tsx b/packages/taler-wallet-webextension/src/components/SelectList.tsx
index 122b473b1..aa17d82b8 100644
--- a/packages/taler-wallet-webextension/src/components/SelectList.tsx
+++ b/packages/taler-wallet-webextension/src/components/SelectList.tsx
@@ -15,8 +15,8 @@
  */
 
 import { Fragment, h, VNode } from "preact";
-import { useTranslationContext } from "../context/translation";
-import { NiceSelect } from "./styled";
+import { useTranslationContext } from "../context/translation.js";
+import { NiceSelect } from "./styled/index.js";
 
 interface Props {
   value?: string;
diff --git a/packages/taler-wallet-webextension/src/components/TransactionItem.tsx b/packages/taler-wallet-webextension/src/components/TransactionItem.tsx
index d7eae7bb6..985ddf552 100644
--- a/packages/taler-wallet-webextension/src/components/TransactionItem.tsx
+++ b/packages/taler-wallet-webextension/src/components/TransactionItem.tsx
@@ -23,9 +23,9 @@ import {
   TransactionType,
 } from "@gnu-taler/taler-util";
 import { h, VNode } from "preact";
-import { useTranslationContext } from "../context/translation";
-import { Avatar } from "../mui/Avatar";
-import { Pages } from "../NavigationBar";
+import { useTranslationContext } from "../context/translation.js";
+import { Avatar } from "../mui/Avatar.js";
+import { Pages } from "../NavigationBar.js";
 import {
   Column,
   ExtraLargeText,
@@ -33,8 +33,8 @@ import {
   LargeText,
   LightText,
   SmallLightText,
-} from "./styled";
-import { Time } from "./Time";
+} from "./styled/index.js";
+import { Time } from "./Time.js";
 
 export function TransactionItem(props: { tx: Transaction }): VNode {
   const tx = props.tx;