Merge branch 'master' into age-withdraw

3 files changed, 15 insertions, 11 deletions

diff --git a/packages/merchant-backoffice-ui/src/paths/instance/templates/list/ListPage.tsx b/packages/merchant-backoffice-ui/src/paths/instance/templates/list/ListPage.tsx
index ab1d5ef91..bf6062c34 100644
--- a/packages/merchant-backoffice-ui/src/paths/instance/templates/list/ListPage.tsx
+++ b/packages/merchant-backoffice-ui/src/paths/instance/templates/list/ListPage.tsx
@@ -49,7 +49,6 @@ export function ListPage({
 
   const { i18n } = useTranslationContext();
   return (
-    <section class="section is-main-section">
       <CardTable
         templates={templates.map((o) => ({
           ...o,
@@ -65,6 +64,5 @@ export function ListPage({
         onLoadMoreAfter={onLoadMoreAfter}
         hasMoreAfter={!onLoadMoreAfter}
       />
-    </section>
   );
 }
diff --git a/packages/merchant-backoffice-ui/src/paths/instance/templates/list/Table.tsx b/packages/merchant-backoffice-ui/src/paths/instance/templates/list/Table.tsx
index 3bea9abe8..9fdf4ead9 100644
--- a/packages/merchant-backoffice-ui/src/paths/instance/templates/list/Table.tsx
+++ b/packages/merchant-backoffice-ui/src/paths/instance/templates/list/Table.tsx
@@ -136,11 +136,10 @@ function Table({
   const { i18n } = useTranslationContext();
   return (
     <div class="table-container">
-      {onLoadMoreBefore && (
+      {hasMoreBefore && (
         <button
           class="button is-fullwidth"
           data-tooltip={i18n.str`load more templates before the first one`}
-          disabled={!hasMoreBefore}
           onClick={onLoadMoreBefore}
         >
           <i18n.Translate>load newer templates</i18n.Translate>
@@ -188,7 +187,7 @@ function Table({
                       data-tooltip={i18n.str`use template to create new order`}
                       onClick={() => onNewOrder(i)}
                     >
-                      New order
+                      Use template
                     </button>
                     <button
                       class="button is-info is-small has-tooltip-left"
@@ -204,11 +203,10 @@ function Table({
           })}
         </tbody>
       </table>
-      {onLoadMoreAfter && (
+      {hasMoreAfter && (
         <button
           class="button is-fullwidth"
           data-tooltip={i18n.str`load more templates after the last one`}
-          disabled={!hasMoreAfter}
           onClick={onLoadMoreAfter}
         >
           <i18n.Translate>load older templates</i18n.Translate>
diff --git a/packages/merchant-backoffice-ui/src/paths/instance/templates/list/index.tsx b/packages/merchant-backoffice-ui/src/paths/instance/templates/list/index.tsx
index 3c9bb231c..b9767442f 100644
--- a/packages/merchant-backoffice-ui/src/paths/instance/templates/list/index.tsx
+++ b/packages/merchant-backoffice-ui/src/paths/instance/templates/list/index.tsx
@@ -35,8 +35,9 @@ import {
 } from "../../../../hooks/templates.js";
 import { Notification } from "../../../../utils/types.js";
 import { ListPage } from "./ListPage.js";
-import { HttpStatusCode } from "@gnu-taler/taler-util";
+import { HttpStatusCode, TranslatedString } from "@gnu-taler/taler-util";
 import { ConfirmModal } from "../../../../components/modal/index.js";
+import { JumpToElementById } from "../../../../components/form/JumpToElementById.js";
 
 interface Props {
   onUnauthorized: () => VNode;
@@ -60,7 +61,7 @@ export default function ListTemplates({
   const [position, setPosition] = useState<string | undefined>(undefined);
   const { i18n } = useTranslationContext();
   const [notif, setNotif] = useState<Notification | undefined>(undefined);
-  const { deleteTemplate } = useTemplateAPI();
+  const { deleteTemplate, testTemplateExist } = useTemplateAPI();
   const result = useInstanceTemplates({ position }, (id) => setPosition(id));
   const [deleting, setDeleting] =
     useState<MerchantBackend.Template.TemplateEntry | null>(null);
@@ -81,9 +82,16 @@ export default function ListTemplates({
   }
 
   return (
-    <Fragment>
+    <section class="section is-main-section">
       <NotificationCard notification={notif} />
 
+      <JumpToElementById
+        testIfExist={testTemplateExist} 
+        onSelect={onSelect}
+        description={i18n.str`jump to template with the given template ID`}
+        palceholder={i18n.str`template id`}
+      />
+
       <ListPage
         templates={result.data.templates}
         onLoadMoreBefore={
@@ -139,6 +147,6 @@ export default function ListTemplates({
           </p>
         </ConfirmModal>
       )}
-    </Fragment>
+    </section>
   );
 }