1 files changed, 43 insertions, 39 deletions
diff --git a/packages/taler-wallet-webextension/src/components/TermsOfService/views.tsx b/packages/taler-wallet-webextension/src/components/TermsOfService/views.tsx
index f8e8b1eba..3a9f9e85d 100644
--- a/packages/taler-wallet-webextension/src/components/TermsOfService/views.tsx
+++ b/packages/taler-wallet-webextension/src/components/TermsOfService/views.tsx
@@ -20,7 +20,7 @@ import { CheckboxOutlined } from "../../components/CheckboxOutlined.js";
 import { ExchangeXmlTos } from "../../components/ExchangeToS.js";
 import {
   LinkSuccess,
-  TermsOfService,
+  TermsOfServiceStyle,
   WarningBox,
   WarningText,
 } from "../../components/styled/index.js";
@@ -31,35 +31,39 @@ import { State } from "./index.js";
 export function ShowButtonsAcceptedTosView({
   termsAccepted,
   showingTermsOfService,
+  children,
 }: State.ShowButtonsAccepted): VNode {
   const { i18n } = useTranslationContext();
-  const ableToReviewTermsOfService =
-    showingTermsOfService.button.onClick !== undefined;
 
   return (
     <Fragment>
-      {ableToReviewTermsOfService && (
-        <section style={{ justifyContent: "space-around", display: "flex" }}>
-          <LinkSuccess
-            upperCased
-            onClick={showingTermsOfService.button.onClick}
-          >
-            <i18n.Translate>Show terms of service</i18n.Translate>
-          </LinkSuccess>
-        </section>
+      {showingTermsOfService.button.onClick !== undefined && (
+        <Fragment>
+          <section style={{ justifyContent: "space-around", display: "flex" }}>
+            <LinkSuccess
+              upperCased
+              onClick={showingTermsOfService.button.onClick}
+            >
+              <i18n.Translate>Show terms of service</i18n.Translate>
+            </LinkSuccess>
+          </section>
+          {termsAccepted.button.onClick !== undefined && (
+            <section style={{ justifyContent: "space-around", display: "flex" }}>
+              <CheckboxOutlined
+                name="terms"
+                enabled={termsAccepted.value}
+                label={
+                  <i18n.Translate>
+                    I accept the exchange terms of service
+                  </i18n.Translate>
+                }
+                onToggle={termsAccepted.button.onClick}
+              />
+            </section>
+          )}
+        </Fragment>
       )}
-      <section style={{ justifyContent: "space-around", display: "flex" }}>
-        <CheckboxOutlined
-          name="terms"
-          enabled={termsAccepted.value}
-          label={
-            <i18n.Translate>
-              I accept the exchange terms of service
-            </i18n.Translate>
-          }
-          onToggle={termsAccepted.button.onClick}
-        />
-      </section>
+      {children}
     </Fragment>
   );
 }
@@ -99,15 +103,15 @@ export function ShowButtonsNonAcceptedTosView({
           </WarningText>
         </section>
       )} */}
-        <section style={{ justifyContent: "space-around", display: "flex" }}>
-          <Button
-            variant="contained"
-            color="success"
-            onClick={showingTermsOfService.button.onClick}
-          >
-            <i18n.Translate>Review exchange terms of service</i18n.Translate>
-          </Button>
-        </section>
+      <section style={{ justifyContent: "space-around", display: "flex" }}>
+        <Button
+          variant="contained"
+          color="success"
+          onClick={showingTermsOfService.button.onClick}
+        >
+          <i18n.Translate>Review exchange terms of service</i18n.Translate>
+        </Button>
+      </section>
     </Fragment>
   );
 }
@@ -119,10 +123,10 @@ export function ShowTosContentView({
 }: State.ShowContent): VNode {
   const { i18n } = useTranslationContext();
   const ableToReviewTermsOfService =
-    showingTermsOfService?.button.onClick !== undefined;
+    termsAccepted.button.onClick !== undefined;
 
   return (
-    <Fragment>
+    <section>
       {!terms.content && (
         <section style={{ justifyContent: "space-around", display: "flex" }}>
           <WarningBox>
@@ -143,9 +147,9 @@ export function ShowTosContentView({
                 </i18n.Translate>
               </WarningBox>
             ) : (
-              <TermsOfService>
+              <TermsOfServiceStyle>
                 <ExchangeXmlTos doc={terms.content.document} />
-              </TermsOfService>
+              </TermsOfServiceStyle>
             ))}
           {terms.content.type === "plain" &&
             (!terms.content.content ? (
@@ -179,7 +183,7 @@ export function ShowTosContentView({
           </LinkSuccess>
         </section>
       )}
-      {termsAccepted && terms.status !== ExchangeTosStatus.Accepted && (
+      {termsAccepted.button.onClick && terms.status !== ExchangeTosStatus.Accepted && (
         <section style={{ justifyContent: "space-around", display: "flex" }}>
           <CheckboxOutlined
             name="terms"
@@ -193,6 +197,6 @@ export function ShowTosContentView({
           />
         </section>
       )}
-    </Fragment>
+    </section>
   );
 }