Fix the cross signing reset cancel and error screens

Author: sandhose

frontend/src/routes/reset-cross-signing.cancelled.tsx

@@ -17,7 +17,7 @@ export const Route = createFileRoute("/reset-cross-signing/cancelled")({
         <PageHeading
           Icon={IconKeyOffSolid}
           title={t("frontend.reset_cross_signing.cancelled.heading")}
-          success
+          invalid
         />
         <Text className="text-center text-secondary" size="lg">
           {t("frontend.reset_cross_signing.cancelled.description_1")}

frontend/src/routes/reset-cross-signing.tsx

@@ -39,7 +39,7 @@ function ResetCrossSigningError({
 }: ErrorComponentProps): React.ReactElement {
   const { t } = useTranslation();
   return (
-    <>
+    <Layout>
       <PageHeading
         Icon={IconError}
         title={t("frontend.reset_cross_signing.failure.heading")}
@@ -53,6 +53,6 @@ function ResetCrossSigningError({
       <Button kind="tertiary" size="lg" onClick={() => reset()}>
         {t("action.back")}
       </Button>
-    </>
+    </Layout>
   );
 }

frontend/tests/routes/__snapshots__/reset-cross-signing.test.tsx.snap

@@ -12,7 +12,7 @@ exports[`Reset cross signing > renders the cancelled page 1`] = `
         class="_pageHeading_c10486"
       >
         <div
-          class="_icon_c10486 _success_c10486"
+          class="_icon_c10486 _invalid_c10486"
         >
           <svg
             fill="currentColor"
@@ -239,48 +239,89 @@ exports[`Reset cross signing > renders the deep link page 1`] = `
 
 exports[`Reset cross signing > renders the errored page 1`] = `
 <DocumentFragment>
-  <header
-    class="_pageHeading_c10486"
+  <div
+    class="_layoutContainer_0c8bf9"
   >
-    <div
-      class="_icon_c10486 _invalid_c10486"
+    <header
+      class="_pageHeading_c10486"
     >
-      <svg
-        fill="currentColor"
-        height="1em"
-        viewBox="0 0 24 24"
-        width="1em"
-        xmlns="http://www.w3.org/2000/svg"
+      <div
+        class="_icon_c10486 _invalid_c10486"
       >
-        <path
-          d="M12 17a.97.97 0 0 0 .713-.288A.968.968 0 0 0 13 16a.968.968 0 0 0-.287-.713A.968.968 0 0 0 12 15a.968.968 0 0 0-.713.287A.968.968 0 0 0 11 16c0 .283.096.52.287.712.192.192.43.288.713.288Zm0-4c.283 0 .52-.096.713-.287A.968.968 0 0 0 13 12V8a.967.967 0 0 0-.287-.713A.968.968 0 0 0 12 7a.968.968 0 0 0-.713.287A.967.967 0 0 0 11 8v4c0 .283.096.52.287.713.192.191.43.287.713.287Zm0 9a9.738 9.738 0 0 1-3.9-.788 10.099 10.099 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.738 9.738 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.099 10.099 0 0 1 2.137-3.175c.9-.9 1.958-1.612 3.175-2.137A9.738 9.738 0 0 1 12 2a9.74 9.74 0 0 1 3.9.788 10.098 10.098 0 0 1 3.175 2.137c.9.9 1.613 1.958 2.137 3.175A9.738 9.738 0 0 1 22 12a9.738 9.738 0 0 1-.788 3.9 10.098 10.098 0 0 1-2.137 3.175c-.9.9-1.958 1.613-3.175 2.137A9.738 9.738 0 0 1 12 22Z"
-        />
-      </svg>
-    </div>
-    <div
-      class="_header_c10486"
+        <svg
+          fill="currentColor"
+          height="1em"
+          viewBox="0 0 24 24"
+          width="1em"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M12 17a.97.97 0 0 0 .713-.288A.968.968 0 0 0 13 16a.968.968 0 0 0-.287-.713A.968.968 0 0 0 12 15a.968.968 0 0 0-.713.287A.968.968 0 0 0 11 16c0 .283.096.52.287.712.192.192.43.288.713.288Zm0-4c.283 0 .52-.096.713-.287A.968.968 0 0 0 13 12V8a.967.967 0 0 0-.287-.713A.968.968 0 0 0 12 7a.968.968 0 0 0-.713.287A.967.967 0 0 0 11 8v4c0 .283.096.52.287.713.192.191.43.287.713.287Zm0 9a9.738 9.738 0 0 1-3.9-.788 10.099 10.099 0 0 1-3.175-2.137c-.9-.9-1.612-1.958-2.137-3.175A9.738 9.738 0 0 1 2 12a9.74 9.74 0 0 1 .788-3.9 10.099 10.099 0 0 1 2.137-3.175c.9-.9 1.958-1.612 3.175-2.137A9.738 9.738 0 0 1 12 2a9.74 9.74 0 0 1 3.9.788 10.098 10.098 0 0 1 3.175 2.137c.9.9 1.613 1.958 2.137 3.175A9.738 9.738 0 0 1 22 12a9.738 9.738 0 0 1-.788 3.9 10.098 10.098 0 0 1-2.137 3.175c-.9.9-1.958 1.613-3.175 2.137A9.738 9.738 0 0 1 12 22Z"
+          />
+        </svg>
+      </div>
+      <div
+        class="_header_c10486"
+      >
+        <h1
+          class="_title_c10486"
+        >
+          Failed to allow crypto identity reset
+        </h1>
+      </div>
+    </header>
+    <p
+      class="_typography_yh5dq_162 _font-body-md-regular_yh5dq_59 text-center text-secondary"
+    >
+      This might be a temporary problem, so please try again later. If the problem persists, please contact your server administrator.
+    </p>
+    <button
+      class="_button_i91xf_17"
+      data-kind="tertiary"
+      data-size="lg"
+      role="button"
+      tabindex="0"
+    >
+      Back
+    </button>
+    <footer
+      class="_legalFooter_eb428f"
     >
-      <h1
-        class="_title_c10486"
+      <nav>
+        <a
+          class="_link_ue21z_17"
+          data-kind="primary"
+          data-size="medium"
+          href="https://matrix.org/policy"
+          rel="noreferrer noopener"
+          title="Link to the service privacy policy"
+        >
+          Privacy Policy
+        </a>
+        <div
+          aria-hidden="true"
+          class="_separator_eb428f"
+        >
+          •
+        </div>
+        <a
+          class="_link_ue21z_17"
+          data-kind="primary"
+          data-size="medium"
+          href="https://matrix.org/tos"
+          rel="noreferrer noopener"
+          title="Link to the service terms and conditions"
+        >
+          Terms & Conditions
+        </a>
+      </nav>
+      <p
+        class="_imprint_eb428f"
       >
-        Failed to allow crypto identity reset
-      </h1>
-    </div>
-  </header>
-  <p
-    class="_typography_yh5dq_162 _font-body-md-regular_yh5dq_59 text-center text-secondary"
-  >
-    This might be a temporary problem, so please try again later. If the problem persists, please contact your server administrator.
-  </p>
-  <button
-    class="_button_i91xf_17"
-    data-kind="tertiary"
-    data-size="lg"
-    role="button"
-    tabindex="0"
-  >
-    Back
-  </button>
+        All Rights Reserved. The Super Chat name, logo and device are registered trade marks of BigCorp Ltd.
+      </p>
+    </footer>
+  </div>
 </DocumentFragment>
 `;