fix imports

39 files changed, 125 insertions, 127 deletions

diff --git a/packages/merchant-backoffice-ui/src/components/exception/AsyncButton.tsx b/packages/merchant-backoffice-ui/src/components/exception/AsyncButton.tsx
index 92bab4bfb..e37362b3a 100644
--- a/packages/merchant-backoffice-ui/src/components/exception/AsyncButton.tsx
+++ b/packages/merchant-backoffice-ui/src/components/exception/AsyncButton.tsx
@@ -20,8 +20,8 @@
 */
 
 import { ComponentChildren, h } from "preact";
-import { LoadingModal } from "../modal";
-import { useAsync } from "../../hooks/async";
+import { LoadingModal } from "../modal.js";
+import { useAsync } from "../../hooks/async.js";
 import { Translate } from "../../i18n";
 
 type Props = {
diff --git a/packages/merchant-backoffice-ui/src/components/exception/login.tsx b/packages/merchant-backoffice-ui/src/components/exception/login.tsx
index 498d994ed..142b9911d 100644
--- a/packages/merchant-backoffice-ui/src/components/exception/login.tsx
+++ b/packages/merchant-backoffice-ui/src/components/exception/login.tsx
@@ -21,10 +21,10 @@
 
 import { h, VNode } from "preact";
 import { useState } from "preact/hooks";
-import { useBackendContext } from "../../context/backend";
-import { useInstanceContext } from "../../context/instance";
+import { useBackendContext } from "../../context/backend.js";
+import { useInstanceContext } from "../../context/instance.js";
 import { Translate, useTranslator } from "../../i18n";
-import { Notification } from "../../utils/types";
+import { Notification } from "../../utils/types.js";
 
 interface Props {
   withMessage?: Notification;
diff --git a/packages/merchant-backoffice-ui/src/components/form/Input.tsx b/packages/merchant-backoffice-ui/src/components/form/Input.tsx
index 9a9691e9b..dc4e9ae1a 100644
--- a/packages/merchant-backoffice-ui/src/components/form/Input.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/Input.tsx
@@ -19,7 +19,7 @@
 * @author Sebastian Javier Marchano (sebasjm)
 */
 import { ComponentChildren, h, VNode } from "preact";
-import { useField, InputProps } from "./useField";
+import { useField, InputProps } from "./useField.js";
 
 interface Props<T> extends InputProps<T> {
   inputType?: 'text' | 'number' | 'multiline' | 'password';
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputArray.tsx b/packages/merchant-backoffice-ui/src/components/form/InputArray.tsx
index 984c6dc49..bcefc25d9 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputArray.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputArray.tsx
@@ -20,8 +20,8 @@
 */
 import { h, VNode } from "preact";
 import { useState } from "preact/hooks";
-import { Translate, useTranslator } from "../../i18n";
-import { InputProps, useField } from "./useField";
+import { Translate, useTranslator } from "../../i18n/index.js";
+import { InputProps, useField } from "./useField.js";
 
 export interface Props<T> extends InputProps<T> {
   isValid?: (e: any) => boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputBoolean.tsx b/packages/merchant-backoffice-ui/src/components/form/InputBoolean.tsx
index 2771fe483..c4ef9441c 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputBoolean.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputBoolean.tsx
@@ -19,7 +19,7 @@
 * @author Sebastian Javier Marchano (sebasjm)
 */
 import { h, VNode } from "preact";
-import { InputProps, useField } from "./useField";
+import { InputProps, useField } from "./useField.js";
 
 interface Props<T> extends InputProps<T> {
   name: T;
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputCurrency.tsx b/packages/merchant-backoffice-ui/src/components/form/InputCurrency.tsx
index d3a46f483..c4c6b8ce3 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputCurrency.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputCurrency.tsx
@@ -19,10 +19,10 @@
 * @author Sebastian Javier Marchano (sebasjm)
 */
 import { ComponentChildren, h } from "preact";
-import { useConfigContext } from "../../context/config";
-import { Amount } from "../../declaration";
-import { InputWithAddon } from "./InputWithAddon";
-import { InputProps } from "./useField";
+import { useConfigContext } from "../../context/config.js";
+import { Amount } from "../../declaration.js";
+import { InputWithAddon } from "./InputWithAddon.js";
+import { InputProps } from "./useField.js";
 
 export interface Props<T> extends InputProps<T> {
   expand?: boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputDate.tsx b/packages/merchant-backoffice-ui/src/components/form/InputDate.tsx
index 77199527f..ce99a02fb 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputDate.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputDate.tsx
@@ -21,9 +21,9 @@
 import { format } from "date-fns";
 import { h, VNode } from "preact";
 import { useState } from "preact/hooks";
-import { Translate, useTranslator } from "../../i18n";
-import { DatePicker } from "../picker/DatePicker";
-import { InputProps, useField } from "./useField";
+import { Translate, useTranslator } from "../../i18n/index.js";
+import { DatePicker } from "../picker/DatePicker.js";
+import { InputProps, useField } from "./useField.js";
 
 export interface Props<T> extends InputProps<T> {
   readonly?: boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputDuration.tsx b/packages/merchant-backoffice-ui/src/components/form/InputDuration.tsx
index d5c208e25..6abe55be0 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputDuration.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputDuration.tsx
@@ -21,10 +21,10 @@
 import { intervalToDuration, formatDuration } from "date-fns";
 import { h, VNode } from "preact";
 import { useState } from "preact/hooks";
-import { Translate, useTranslator } from "../../i18n";
-import { SimpleModal } from "../modal";
-import { DurationPicker } from "../picker/DurationPicker";
-import { InputProps, useField } from "./useField";
+import { Translate, useTranslator } from "../../i18n/index.js";
+import { SimpleModal } from "../modal/index.js";
+import { DurationPicker } from "../picker/DurationPicker.js";
+import { InputProps, useField } from "./useField.js";
 
 export interface Props<T> extends InputProps<T> {
   expand?: boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputGroup.tsx b/packages/merchant-backoffice-ui/src/components/form/InputGroup.tsx
index 8af9c7d96..b73e5c5f7 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputGroup.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputGroup.tsx
@@ -20,7 +20,7 @@
 */
 import { ComponentChildren, h, VNode } from "preact";
 import { useState } from "preact/hooks";
-import { useGroupField } from "./useGroupField";
+import { useGroupField } from "./useGroupField.js";
 
 export interface Props<T> {
   name: T;
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputImage.tsx b/packages/merchant-backoffice-ui/src/components/form/InputImage.tsx
index 6cc9b9dcc..8e2586933 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputImage.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputImage.tsx
@@ -20,10 +20,9 @@
 */
 import { ComponentChildren, h, VNode } from "preact";
 import { useRef, useState } from "preact/hooks";
-import emptyImage from "../../assets/empty.png";
-import { Translate } from "../../i18n";
-import { MAX_IMAGE_SIZE as MAX_IMAGE_UPLOAD_SIZE } from "../../utils/constants";
-import { InputProps, useField } from "./useField";
+import { Translate } from "../../i18n/index.js";
+import { MAX_IMAGE_SIZE as MAX_IMAGE_UPLOAD_SIZE } from "../../utils/constants.js";
+import { InputProps, useField } from "./useField.js";
 
 export interface Props<T> extends InputProps<T> {
   expand?: boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputLocation.tsx b/packages/merchant-backoffice-ui/src/components/form/InputLocation.tsx
index 12755f47a..bc90cf128 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputLocation.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputLocation.tsx
@@ -19,8 +19,8 @@
 * @author Sebastian Javier Marchano (sebasjm)
 */
 import { Fragment, h } from "preact";
-import { useTranslator } from "../../i18n";
-import { Input } from "./Input";
+import { useTranslator } from "../../i18n/index.js";
+import { Input } from "./Input.js";
 
 export function InputLocation({name}:{name:string}) {
   const i18n = useTranslator()
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputNumber.tsx b/packages/merchant-backoffice-ui/src/components/form/InputNumber.tsx
index 046cda59e..7b7499f2d 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputNumber.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputNumber.tsx
@@ -19,8 +19,8 @@
 * @author Sebastian Javier Marchano (sebasjm)
 */
 import { ComponentChildren, h } from "preact";
-import { InputWithAddon } from "./InputWithAddon";
-import { InputProps } from "./useField";
+import { InputWithAddon } from "./InputWithAddon.js";
+import { InputProps } from "./useField.js";
 
 export interface Props<T> extends InputProps<T> {
   readonly?: boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputPayto.tsx b/packages/merchant-backoffice-ui/src/components/form/InputPayto.tsx
index 44252317e..703792936 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputPayto.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputPayto.tsx
@@ -19,9 +19,9 @@
 * @author Sebastian Javier Marchano (sebasjm)
 */
 import { h, VNode } from "preact";
-import { InputArray } from "./InputArray";
-import { PAYTO_REGEX } from "../../utils/constants";
-import { InputProps } from "./useField";
+import { InputArray } from "./InputArray.js";
+import { PAYTO_REGEX } from "../../utils/constants.js";
+import { InputProps } from "./useField.js";
 
 export type Props<T> = InputProps<T>;
 
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputPaytoForm.tsx b/packages/merchant-backoffice-ui/src/components/form/InputPaytoForm.tsx
index 9cfef07cf..22d812971 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputPaytoForm.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputPaytoForm.tsx
@@ -20,13 +20,13 @@
  */
 import { h, VNode, Fragment } from "preact";
 import { useCallback, useState } from "preact/hooks";
-import { Translate, Translator, useTranslator } from "../../i18n";
-import { COUNTRY_TABLE } from "../../utils/constants";
-import { FormErrors, FormProvider } from "./FormProvider";
-import { Input } from "./Input";
-import { InputGroup } from "./InputGroup";
-import { InputSelector } from "./InputSelector";
-import { InputProps, useField } from "./useField";
+import { Translate, Translator, useTranslator } from "../../i18n.js";
+import { COUNTRY_TABLE } from "../../utils/constants.js";
+import { FormErrors, FormProvider } from "./FormProvider.js";
+import { Input } from "./Input.js";
+import { InputGroup } from "./InputGroup.js";
+import { InputSelector } from "./InputSelector.js";
+import { InputProps, useField } from "./useField.js";
 
 export interface Props<T> extends InputProps<T> {
   isValid?: (e: any) => boolean;
@@ -217,7 +217,7 @@ export function InputPaytoForm<T>({
   };
 
   const hasErrors = Object.keys(errors).some(
-    (k) => (errors as any)[k] !== undefined
+    (k) => (errors as any)[k] !== undefined,
   );
 
   const submit = useCallback((): void => {
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputSearchProduct.tsx b/packages/merchant-backoffice-ui/src/components/form/InputSearchProduct.tsx
index 51f84fd12..2b239d483 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputSearchProduct.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputSearchProduct.tsx
@@ -21,11 +21,10 @@
 import { h, VNode } from "preact";
 import { useState } from "preact/hooks";
 import emptyImage from "../../assets/empty.png";
-import { MerchantBackend, WithId } from "../../declaration";
-import { useInstanceProducts } from "../../hooks/product";
-import { Translate, useTranslator } from "../../i18n";
-import { FormErrors, FormProvider } from "./FormProvider";
-import { InputWithAddon } from "./InputWithAddon";
+import { MerchantBackend, WithId } from "../../declaration.js";
+import { Translate, useTranslator } from "../../i18n/index.js";
+import { FormErrors, FormProvider } from "./FormProvider.js";
+import { InputWithAddon } from "./InputWithAddon.js";
 
 type Entity = MerchantBackend.Products.ProductDetail & WithId
 
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputSecured.stories.tsx b/packages/merchant-backoffice-ui/src/components/form/InputSecured.stories.tsx
index 1990eeeae..72355e242 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputSecured.stories.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputSecured.stories.tsx
@@ -21,8 +21,8 @@
 
 import { h, VNode } from 'preact';
 import { useState } from 'preact/hooks';
-import { FormProvider } from "./FormProvider";
-import { InputSecured } from './InputSecured';
+import { FormProvider } from "./FormProvider.js";
+import { InputSecured } from './InputSecured.js';
 
 export default {
   title: 'Components/Form/InputSecured',
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputSecured.tsx b/packages/merchant-backoffice-ui/src/components/form/InputSecured.tsx
index c9b0f43b9..17431fcfc 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputSecured.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputSecured.tsx
@@ -20,8 +20,8 @@
 */
 import { Fragment, h, VNode } from "preact";
 import { useState } from "preact/hooks";
-import { Translate, useTranslator } from "../../i18n";
-import { InputProps, useField } from "./useField";
+import { Translate, useTranslator } from "../../i18n/index.js";
+import { InputProps, useField } from "./useField.js";
 
 export type Props<T> = InputProps<T>;
 
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputSelector.tsx b/packages/merchant-backoffice-ui/src/components/form/InputSelector.tsx
index 86f4de756..f2574240b 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputSelector.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputSelector.tsx
@@ -19,7 +19,7 @@
  * @author Sebastian Javier Marchano (sebasjm)
  */
 import { h, VNode } from "preact";
-import { InputProps, useField } from "./useField";
+import { InputProps, useField } from "./useField.js";
 
 interface Props<T> extends InputProps<T> {
   readonly?: boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputStock.stories.tsx b/packages/merchant-backoffice-ui/src/components/form/InputStock.stories.tsx
index 63c7e4131..bfd607c4e 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputStock.stories.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputStock.stories.tsx
@@ -22,8 +22,8 @@
 import { addDays } from "date-fns";
 import { h, VNode } from "preact";
 import { useState } from "preact/hooks";
-import { FormProvider } from "./FormProvider";
-import { InputStock, Stock } from "./InputStock";
+import { FormProvider } from "./FormProvider.js";
+import { InputStock, Stock } from "./InputStock.js";
 
 export default {
   title: "Components/Form/InputStock",
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputStock.tsx b/packages/merchant-backoffice-ui/src/components/form/InputStock.tsx
index 158f44192..be578d12d 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputStock.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputStock.tsx
@@ -19,16 +19,16 @@
 * @author Sebastian Javier Marchano (sebasjm)
 */
 import { Fragment, h } from "preact";
-import { MerchantBackend, Timestamp } from "../../declaration";
-import { InputProps, useField } from "./useField";
-import { FormProvider, FormErrors } from "./FormProvider";
+import { MerchantBackend, Timestamp } from "../../declaration.js";
+import { InputProps, useField } from "./useField.js";
+import { FormProvider, FormErrors } from "./FormProvider.js";
 import { useLayoutEffect, useState } from "preact/hooks";
-import { Input } from "./Input";
-import { InputGroup } from "./InputGroup";
-import { InputNumber } from "./InputNumber";
-import { InputDate } from "./InputDate";
+import { Input } from "./Input.js";
+import { InputGroup } from "./InputGroup.js";
+import { InputNumber } from "./InputNumber.js";
+import { InputDate } from "./InputDate.js";
 import { Translate, useTranslator } from "../../i18n";
-import { InputLocation } from "./InputLocation";
+import { InputLocation } from "./InputLocation.js";
 
 export interface Props<T> extends InputProps<T> {
   alreadyExist?: boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputTaxes.tsx b/packages/merchant-backoffice-ui/src/components/form/InputTaxes.tsx
index 507a61242..713003a0b 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputTaxes.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputTaxes.tsx
@@ -21,13 +21,13 @@
 import { h, VNode } from "preact";
 import { useCallback, useState } from "preact/hooks";
 import * as yup from 'yup';
-import { MerchantBackend } from "../../declaration";
+import { MerchantBackend } from "../../declaration.js";
 import { Translate, useTranslator } from "../../i18n";
-import { TaxSchema as schema } from '../../schemas';
-import { FormErrors, FormProvider } from "./FormProvider";
-import { Input } from "./Input";
-import { InputGroup } from "./InputGroup";
-import { InputProps, useField } from "./useField";
+import { TaxSchema as schema } from "../../schemas.js";
+import { FormErrors, FormProvider } from "./FormProvider.js";
+import { Input } from "./Input.js";
+import { InputGroup } from "./InputGroup.js";
+import { InputProps, useField } from "./useField.js";
 
 export interface Props<T> extends InputProps<T> {
   isValid?: (e: any) => boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/form/InputWithAddon.tsx b/packages/merchant-backoffice-ui/src/components/form/InputWithAddon.tsx
index a16ebc2e9..16fc5d611 100644
--- a/packages/merchant-backoffice-ui/src/components/form/InputWithAddon.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/InputWithAddon.tsx
@@ -19,7 +19,7 @@
 * @author Sebastian Javier Marchano (sebasjm)
 */
 import { ComponentChildren, h, VNode } from "preact";
-import { InputProps, useField } from "./useField";
+import { InputProps, useField } from "./useField.js";
 
 export interface Props<T> extends InputProps<T> {
   expand?: boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/form/TextField.tsx b/packages/merchant-backoffice-ui/src/components/form/TextField.tsx
index 2579a27b2..3dd157b79 100644
--- a/packages/merchant-backoffice-ui/src/components/form/TextField.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/TextField.tsx
@@ -19,7 +19,7 @@
 * @author Sebastian Javier Marchano (sebasjm)
 */
 import { ComponentChildren, h, VNode } from "preact";
-import { useField, InputProps } from "./useField";
+import { useField, InputProps } from "./useField.js";
 
 interface Props<T> extends InputProps<T> {
   inputType?: 'text' | 'number' | 'multiline' | 'password';
diff --git a/packages/merchant-backoffice-ui/src/components/form/useField.tsx b/packages/merchant-backoffice-ui/src/components/form/useField.tsx
index 8479d7ad8..a6e5a01a8 100644
--- a/packages/merchant-backoffice-ui/src/components/form/useField.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/useField.tsx
@@ -20,7 +20,7 @@
 */
 
 import { ComponentChildren, VNode } from "preact";
-import { useFormContext } from "./FormProvider";
+import { useFormContext } from "./FormProvider.js";
 
 interface Use<V> {
   error?: string;
diff --git a/packages/merchant-backoffice-ui/src/components/form/useGroupField.tsx b/packages/merchant-backoffice-ui/src/components/form/useGroupField.tsx
index a73f464a1..d2bb021cf 100644
--- a/packages/merchant-backoffice-ui/src/components/form/useGroupField.tsx
+++ b/packages/merchant-backoffice-ui/src/components/form/useGroupField.tsx
@@ -19,7 +19,7 @@
 * @author Sebastian Javier Marchano (sebasjm)
 */
 
-import { useFormContext } from "./FormProvider";
+import { useFormContext } from "./FormProvider.js";
 
 interface Use {
   hasError?: boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/instance/DefaultInstanceFormFields.tsx b/packages/merchant-backoffice-ui/src/components/instance/DefaultInstanceFormFields.tsx
index d80c65cc2..af7124a45 100644
--- a/packages/merchant-backoffice-ui/src/components/instance/DefaultInstanceFormFields.tsx
+++ b/packages/merchant-backoffice-ui/src/components/instance/DefaultInstanceFormFields.tsx
@@ -20,17 +20,17 @@
  */
 
 import { Fragment, h, VNode } from "preact";
-import { useBackendContext } from "../../context/backend";
+import { useBackendContext } from "../../context/backend.js";
 import { useTranslator } from "../../i18n";
-import { Entity } from "../../paths/admin/create/CreatePage";
-import { Input } from "../form/Input";
-import { InputCurrency } from "../form/InputCurrency";
-import { InputDuration } from "../form/InputDuration";
-import { InputGroup } from "../form/InputGroup";
-import { InputImage } from "../form/InputImage";
-import { InputLocation } from "../form/InputLocation";
-import { InputPaytoForm } from "../form/InputPaytoForm";
-import { InputWithAddon } from "../form/InputWithAddon";
+import { Entity } from "../../paths/admin/create/CreatePage.js";
+import { Input } from "../form/Input.js";
+import { InputCurrency } from "../form/InputCurrency.js";
+import { InputDuration } from "../form/InputDuration.js";
+import { InputGroup } from "../form/InputGroup.js";
+import { InputImage } from "../form/InputImage.js";
+import { InputLocation } from "../form/InputLocation.js";
+import { InputPaytoForm } from "../form/InputPaytoForm.js";
+import { InputWithAddon } from "../form/InputWithAddon.js";
 
 export function DefaultInstanceFormFields({
   readonlyId,
diff --git a/packages/merchant-backoffice-ui/src/components/menu/LangSelector.tsx b/packages/merchant-backoffice-ui/src/components/menu/LangSelector.tsx
index 41d08a58b..4f35e3f76 100644
--- a/packages/merchant-backoffice-ui/src/components/menu/LangSelector.tsx
+++ b/packages/merchant-backoffice-ui/src/components/menu/LangSelector.tsx
@@ -22,7 +22,7 @@
 import { h, VNode } from "preact";
 import { useState } from "preact/hooks";
 import langIcon from '../../assets/icons/languageicon.svg';
-import { useTranslationContext } from "../../context/translation";
+import { useTranslationContext } from "../../context/translation.js";
 import { strings as messages } from '../../i18n/strings'
 
 type LangsNames = {
diff --git a/packages/merchant-backoffice-ui/src/components/menu/NavigationBar.tsx b/packages/merchant-backoffice-ui/src/components/menu/NavigationBar.tsx
index e1bb4c7c0..7ef446bd1 100644
--- a/packages/merchant-backoffice-ui/src/components/menu/NavigationBar.tsx
+++ b/packages/merchant-backoffice-ui/src/components/menu/NavigationBar.tsx
@@ -21,7 +21,7 @@
 
 import { h, VNode } from 'preact';
 import logo from '../../assets/logo.jpeg';
-import { LangSelector } from './LangSelector';
+import { LangSelector } from "./LangSelector.js";
 
 interface Props {
   onMobileMenu: () => void;
diff --git a/packages/merchant-backoffice-ui/src/components/menu/SideBar.tsx b/packages/merchant-backoffice-ui/src/components/menu/SideBar.tsx
index e9c5ef8ae..7dd0983a2 100644
--- a/packages/merchant-backoffice-ui/src/components/menu/SideBar.tsx
+++ b/packages/merchant-backoffice-ui/src/components/menu/SideBar.tsx
@@ -21,12 +21,12 @@
 
 import { Fragment, h, VNode } from "preact";
 import { useCallback } from "preact/hooks";
-import { useBackendContext } from "../../context/backend";
-import { useConfigContext } from "../../context/config";
-import { useInstanceContext } from "../../context/instance";
-import { useInstanceKYCDetails } from "../../hooks/instance";
+import { useBackendContext } from "../../context/backend.js";
+import { useConfigContext } from "../../context/config.js";
+import { useInstanceContext } from "../../context/instance.js";
+import { useInstanceKYCDetails } from "../../hooks/instance.js";
 import { Translate } from "../../i18n";
-import { LangSelector } from "./LangSelector";
+import { LangSelector } from "./LangSelector.js";
 
 interface Props {
   onLogout: () => void;
diff --git a/packages/merchant-backoffice-ui/src/components/menu/index.tsx b/packages/merchant-backoffice-ui/src/components/menu/index.tsx
index 0a621af56..2a2e6f819 100644
--- a/packages/merchant-backoffice-ui/src/components/menu/index.tsx
+++ b/packages/merchant-backoffice-ui/src/components/menu/index.tsx
@@ -17,11 +17,11 @@
 import { ComponentChildren, Fragment, h, VNode } from "preact";
 import Match from "preact-router/match";
 import { useEffect, useState } from "preact/hooks";
-import { AdminPaths } from "../../AdminRoutes";
-import { InstancePaths } from "../../InstanceRoutes";
-import { Notification } from "../../utils/types";
-import { NavigationBar } from "./NavigationBar";
-import { Sidebar } from "./SideBar";
+import { AdminPaths } from "../../AdminRoutes.js";
+import { InstancePaths } from "../../InstanceRoutes.js";
+import { Notification } from "../../utils/types.js";
+import { NavigationBar } from "./NavigationBar.js";
+import { Sidebar } from "./SideBar.js";
 
 function getInstanceTitle(path: string, id: string): string {
   switch (path) {
diff --git a/packages/merchant-backoffice-ui/src/components/modal/index.tsx b/packages/merchant-backoffice-ui/src/components/modal/index.tsx
index a7edb9e48..c8eb839bc 100644
--- a/packages/merchant-backoffice-ui/src/components/modal/index.tsx
+++ b/packages/merchant-backoffice-ui/src/components/modal/index.tsx
@@ -22,12 +22,12 @@
 
 import { ComponentChildren, h, VNode } from "preact";
 import { useState } from "preact/hooks";
-import { useInstanceContext } from "../../context/instance";
+import { useInstanceContext } from "../../context/instance.js";
 import { Translate, useTranslator } from "../../i18n";
-import { DEFAULT_REQUEST_TIMEOUT } from "../../utils/constants";
-import { Loading, Spinner } from "../exception/loading";
-import { FormProvider } from "../form/FormProvider";
-import { Input } from "../form/Input";
+import { DEFAULT_REQUEST_TIMEOUT } from "../../utils/constants.js";
+import { Loading, Spinner } from "../exception/loading.js";
+import { FormProvider } from "../form/FormProvider.js";
+import { Input } from "../form/Input.js";
 
 interface Props {
   active?: boolean;
diff --git a/packages/merchant-backoffice-ui/src/components/notifications/Notifications.stories.tsx b/packages/merchant-backoffice-ui/src/components/notifications/Notifications.stories.tsx
index 3b95295fe..15e00b790 100644
--- a/packages/merchant-backoffice-ui/src/components/notifications/Notifications.stories.tsx
+++ b/packages/merchant-backoffice-ui/src/components/notifications/Notifications.stories.tsx
@@ -20,7 +20,7 @@
 */
 
 import { h } from 'preact';
-import { Notifications } from './index';
+import { Notifications } from "./index.js";
 
 
 export default {
diff --git a/packages/merchant-backoffice-ui/src/components/notifications/index.tsx b/packages/merchant-backoffice-ui/src/components/notifications/index.tsx
index 34bd40ec6..d4da7b35a 100644
--- a/packages/merchant-backoffice-ui/src/components/notifications/index.tsx
+++ b/packages/merchant-backoffice-ui/src/components/notifications/index.tsx
@@ -20,7 +20,7 @@
 */
 
 import { h, VNode } from "preact";
-import { MessageType, Notification } from "../../utils/types";
+import { MessageType, Notification } from "../../utils/types.js";
 
 interface Props {
   notifications: Notification[];
diff --git a/packages/merchant-backoffice-ui/src/components/picker/DurationPicker.stories.tsx b/packages/merchant-backoffice-ui/src/components/picker/DurationPicker.stories.tsx
index 275c80fa6..81bca17ba 100644
--- a/packages/merchant-backoffice-ui/src/components/picker/DurationPicker.stories.tsx
+++ b/packages/merchant-backoffice-ui/src/components/picker/DurationPicker.stories.tsx
@@ -21,7 +21,7 @@
 
 import { h, FunctionalComponent } from 'preact';
 import { useState } from 'preact/hooks';
-import { DurationPicker as TestedComponent } from './DurationPicker';
+import { DurationPicker as TestedComponent } from "./DurationPicker.js";
 
 
 export default {
diff --git a/packages/merchant-backoffice-ui/src/components/product/InventoryProductForm.stories.tsx b/packages/merchant-backoffice-ui/src/components/product/InventoryProductForm.stories.tsx
index 6504d85ba..fd87283c4 100644
--- a/packages/merchant-backoffice-ui/src/components/product/InventoryProductForm.stories.tsx
+++ b/packages/merchant-backoffice-ui/src/components/product/InventoryProductForm.stories.tsx
@@ -20,7 +20,7 @@
 */
 
 import { h, VNode, FunctionalComponent } from 'preact';
-import { InventoryProductForm as TestedComponent } from './InventoryProductForm';
+import { InventoryProductForm as TestedComponent } from "./InventoryProductForm.js";
 
 
 export default {
diff --git a/packages/merchant-backoffice-ui/src/components/product/InventoryProductForm.tsx b/packages/merchant-backoffice-ui/src/components/product/InventoryProductForm.tsx
index 8f05c9736..c4ec73061 100644
--- a/packages/merchant-backoffice-ui/src/components/product/InventoryProductForm.tsx
+++ b/packages/merchant-backoffice-ui/src/components/product/InventoryProductForm.tsx
@@ -15,12 +15,12 @@
  */
 import { h, VNode } from "preact";
 import { useState } from "preact/hooks";
-import { FormProvider, FormErrors } from "../form/FormProvider";
-import { InputNumber } from "../form/InputNumber";
-import { InputSearchProduct } from "../form/InputSearchProduct";
-import { MerchantBackend, WithId } from "../../declaration";
+import { FormProvider, FormErrors } from "../form/FormProvider.js";
+import { InputNumber } from "../form/InputNumber.js";
+import { InputSearchProduct } from "../form/InputSearchProduct.js";
+import { MerchantBackend, WithId } from "../../declaration.js";
 import { Translate, useTranslator } from "../../i18n";
-import { ProductMap } from "../../paths/instance/orders/create/CreatePage";
+import { ProductMap } from "../../paths/instance/orders/create/CreatePage.js";
 
 type Form = {
   product: MerchantBackend.Products.ProductDetail & WithId,
diff --git a/packages/merchant-backoffice-ui/src/components/product/NonInventoryProductForm.tsx b/packages/merchant-backoffice-ui/src/components/product/NonInventoryProductForm.tsx
index 397efe616..2deddb421 100644
--- a/packages/merchant-backoffice-ui/src/components/product/NonInventoryProductForm.tsx
+++ b/packages/merchant-backoffice-ui/src/components/product/NonInventoryProductForm.tsx
@@ -16,18 +16,18 @@
 import { Fragment, h, VNode } from "preact";
 import { useCallback, useEffect, useState } from "preact/hooks";
 import * as yup from 'yup';
-import { FormErrors, FormProvider } from "../form/FormProvider";
-import { Input } from "../form/Input";
-import { InputCurrency } from "../form/InputCurrency";
-import { InputImage } from "../form/InputImage";
-import { InputNumber } from "../form/InputNumber";
-import { InputTaxes } from "../form/InputTaxes";
-import { MerchantBackend } from "../../declaration";
-import { useListener } from "../../hooks/listener";
+import { FormErrors, FormProvider } from "../form/FormProvider.js";
+import { Input } from "../form/Input.js";
+import { InputCurrency } from "../form/InputCurrency.js";
+import { InputImage } from "../form/InputImage.js";
+import { InputNumber } from "../form/InputNumber.js";
+import { InputTaxes } from "../form/InputTaxes.js";
+import { MerchantBackend } from "../../declaration.js";
+import { useListener } from "../../hooks/listener.js";
 import { Translate, useTranslator } from "../../i18n";
 import {
   NonInventoryProductSchema as schema
-} from '../../schemas';
+} from "../../schemas.js";
 
 
 type Entity = MerchantBackend.Product
diff --git a/packages/merchant-backoffice-ui/src/components/product/ProductForm.tsx b/packages/merchant-backoffice-ui/src/components/product/ProductForm.tsx
index 9434d3de8..115174bf9 100644
--- a/packages/merchant-backoffice-ui/src/components/product/ProductForm.tsx
+++ b/packages/merchant-backoffice-ui/src/components/product/ProductForm.tsx
@@ -22,21 +22,21 @@
 import { h } from "preact";
 import { useCallback, useEffect, useState } from "preact/hooks";
 import * as yup from "yup";
-import { useBackendContext } from "../../context/backend";
-import { MerchantBackend } from "../../declaration";
+import { useBackendContext } from "../../context/backend.js";
+import { MerchantBackend } from "../../declaration.js";
 import { useTranslator } from "../../i18n";
 import {
   ProductCreateSchema as createSchema,
   ProductUpdateSchema as updateSchema,
-} from "../../schemas";
-import { FormProvider, FormErrors } from "../form/FormProvider";
-import { Input } from "../form/Input";
-import { InputCurrency } from "../form/InputCurrency";
-import { InputImage } from "../form/InputImage";
-import { InputNumber } from "../form/InputNumber";
-import { InputStock, Stock } from "../form/InputStock";
-import { InputTaxes } from "../form/InputTaxes";
-import { InputWithAddon } from "../form/InputWithAddon";
+} from "../../schemas.js";
+import { FormProvider, FormErrors } from "../form/FormProvider.js";
+import { Input } from "../form/Input.js";
+import { InputCurrency } from "../form/InputCurrency.js";
+import { InputImage } from "../form/InputImage.js";
+import { InputNumber } from "../form/InputNumber.js";
+import { InputStock, Stock } from "../form/InputStock.js";
+import { InputTaxes } from "../form/InputTaxes.js";
+import { InputWithAddon } from "../form/InputWithAddon.js";
 
 type Entity = MerchantBackend.Products.ProductDetail & { product_id: string };
 
diff --git a/packages/merchant-backoffice-ui/src/components/product/ProductList.tsx b/packages/merchant-backoffice-ui/src/components/product/ProductList.tsx
index ff141bb39..037e90ff4 100644
--- a/packages/merchant-backoffice-ui/src/components/product/ProductList.tsx
+++ b/packages/merchant-backoffice-ui/src/components/product/ProductList.tsx
@@ -16,7 +16,7 @@
 import { Amounts } from "@gnu-taler/taler-util";
 import { h, VNode } from "preact";
 import emptyImage from "../../assets/empty.png";
-import { MerchantBackend } from "../../declaration";
+import { MerchantBackend } from "../../declaration.js";
 import { Translate } from "../../i18n";
 
 interface Props {